@charset 'utf-8';

:root {

	--gap-between: 80px;
	--gap-side: 10px;
	--max-width: 1800px;

	--font-title: 'Manrope', serif;
	--font-text: 'Manrope', sans-serif;

}

[data-theme="light"] {
  color-scheme: light;
  --color-bg: #fff;
	--color-text: #000;
	--color-accent: #9C0001;
	--color-gray: rgb(0 0 0 / .5);
}

[data-theme="dark"] {
	color-scheme: dark;
	--color-bg: #1D1D1D;
	--color-text: #fff;
	--color-accent: #fff;
	--color-gray: rgb(255 255 255 / .5);
}

@media (min-width: 414px) {
	:root {
		--gap-side: 15px;
	}
}

@media (min-width: 1200px) {
	:root {
		--gap-between: 150px;
		--gap-side: 20px;
	}
}

@media (min-width: 1400px) {
	:root {
		--gap-side: 30px;
	}
}

@media (min-width: 1900px) {
	:root {
		--gap-between: 200px;
		--gap-side: 60px;
	}
}

@layer reset {

	* {
		margin: 0;
		padding: 0;
		outline: none;
		-webkit-tap-highlight-color: transparent; /* Убирает выделение элемента при тапе */
	}
	*, ::before, ::after {
		box-sizing: border-box;
		background-repeat: no-repeat;
	}
	html {
	  scrollbar-gutter: stable; /* Резервирует место под скроллбар */
		text-size-adjust: none; /* Запретить автоматическое увеличение шрифта */
		-webkit-text-size-adjust: none;
		-webkit-overflow-scrolling: touch; /* Инерция скрола для iOS */
		-webkit-font-smoothing: antialiased; /* Делает шрифт более чистым */
		-moz-osx-font-smoothing: grayscale; /* аналог -webkit-font-smoothing для Firefox на macOS */
		scroll-behavior: smooth;
	}
	img, svg, picture, video, iframe {
		display: block;
		max-inline-size: 100%;
		max-block-size: 100%;
		width: auto;
	}
	table {
		width: 100%;
		border-collapse: collapse;
		border-spacing: 0;
	}
	code, pre {
		font-family: monospace, serif;
	}
	button {
		background: none;
		border: none;
		color: inherit;
	}
	button, input, select, textarea {
		font: inherit;
	}
	label {
		display: block;
	}
	label, button, input[type="file"] {
		cursor: pointer;
	}
	input[type="number"]::-webkit-outer-spin-button,
	input[type="number"]::-webkit-inner-spin-button {
		-webkit-appearance: none;
	}
	input[type="number"],
	input[type="number"]:hover,
	input[type="number"]:focus {
		appearance: none;
		-moz-appearance: textfield;
	}
	[disabled], :disabled {
		cursor: not-allowed;
	}
	a {
		color: inherit;
		text-decoration: none;
	}
	a:hover {
		color: currentColor;
	}

	@media (prefers-reduced-motion: reduce) {
		body * {
			animation: none !important;
			transition-duration: unset !important;
		}
	}

}

@layer text {

	body {
		font-size: 16px;
		font-family: var(--font-text);
		font-style: normal;
		font-weight: 400;
		color: var(--color-text);
		letter-spacing: -0.01em;
		background: var(--color-bg);
	}

	p a,
	.link {
		transition: all 300ms linear;
		text-decoration: underline;
		text-decoration-style: solid;
		text-underline-offset: 2px;
		text-decoration-thickness: 1px;
		text-decoration-color: oklch(from currentColor l c h / .5);
	}
	p a:hover,
	.link:hover {
		text-decoration-color: transparent;
	}
	ol, ul {
		padding-left: 30px;
	}
	ol, ul:not(:last-child) {
		margin-bottom: 1lh;
	}
	li {
		margin: 0;
	}
	ol.none,
	ul.none {
		margin: 0;
		padding: 0;
		list-style: none;
	}


	li[data-count] {
		position: relative;
		min-height: 40px;
		display: flex;
		align-items: center;
		gap: 10px;
	}
	li[data-count]::before {
		content: attr(data-count);
		display: block;
		height: 40px;
		aspect-ratio: 1;
		border-radius: 50%;
		display: grid;
		place-content: center;
		color: #fff;
		background: var(--color-accent);
		font-weight: 500;
		font-size: smaller;
	}

	p:not(:first-child) {
		margin-top: 10px;
	}

	@media (min-width: 1024px) {
		li[data-count] {
			gap: 15px;
		}
		li[data-count]::before {
			height: 60px;
			font-size: larger;
		}
	}

	@media (min-width: 1400px) {
		body {
			font-size: 20px;
		}
	}

}

@layer h {

	.h1, h1,
	.h2, h2,
	.h3, h3 {
		font-weight: 500;
		font-family: var(--font-title);
		font-optical-sizing: auto;
		font-style: normal;
	}
	:where(.h1, h1, .h2, h2, .h3, h3) .accent {
		color: var(--color-accent);
	}

	.h1, h1,
	.h2, h2 {
		font-size: 30px;
	}
	.h3, h3 {}

	@media (min-width: 1400px) {
		.h1, h1,
		.h2, h2 {
			font-size: 35px;
		}
	}

}

@layer other {

	:has( > .inner) {
		padding-inline: var(--gap-side);
	}
	.inner {
		max-width: var(--max-width);
		margin-inline: auto;
	}

	.noscroll {
		overflow: hidden;
	}

	main {
		display: grid;
		gap: var(--gap-between);
	}

	.visually-hidden {
		position: absolute;
		width: 1px;
		height: 1px;
		margin: -1px;
		padding: 0;
		border: 0;
		clip: rect(0 0 0 0);
		overflow: hidden;
	}

	.fit {
		width: 100%;
		height: 100%;
		max-width: none;
		max-height: none;
		object-fit: cover;
		object-position: center;
	}

	.hover {
		display: inline-block;
		position: relative;
	}
	.hover::before {
		content: '';
		display: block;
		width: 0;
		height: 1px;
		position: absolute;
		left: 0;
		bottom: 0;
		background: currentColor;
		transition: all 300ms ease-in-out;
	}
	.hover:hover::before {
		width: 100%;
	}

	.linkMore {
		position: relative;
		display: inline-block;
		margin-top: 10px;
		padding-left: 13px;
		font-size: 14px;
	}
	.linkMore::before {
		content: '';
		display: block;
		width: 8px;
		aspect-ratio: 1;
		position: absolute;
		top: 6px;
		left: 0;
		background: var(--color-text);
	}

	[hidden] {
		display: none !important;
	}

	picture:not([data-fancybox]):not(.swiper-slide) {
		pointer-events: none;
	}

}

@layer form {

	input,
	textarea,
	select {
		width: 100%;
		height: 40px;
		padding: 0 10px;
		background: #fff;
		border: 1px solid #ddd;
	}
	textarea {
		overflow: auto;
		line-height: 1.1;
		min-height: 5.5em;
		resize: vertical;
		vertical-align: top;
	}

	[placeholder]::-webkit-input-placeholder { color: #ddd; }
	[placeholder]:-ms-input-placeholder      { color: #ddd; }
	[placeholder]::-moz-placeholder          { color: #ddd; }
	[placeholder]:not(:empty)::-webkit-input-placeholder { opacity: 0; }
	[placeholder]:not(:empty):-ms-input-placeholder      { opacity: 0; }
	[placeholder]:not(:empty)::-moz-placeholder          { opacity: 0; }

	input.ui[type="radio"],
	input.ui[type="checkbox"] {
	  display: none;
	}
	input.ui[type="radio"] + span,
	input.ui[type="checkbox"] + span {
	  position: relative;
	  display: block;
	  padding: 0 0 0 30px;
	}
	input.ui[type="radio"] + span::before,
	input.ui[type="radio"] + span::after,
	input.ui[type="checkbox"] + span::before,
	input.ui[type="checkbox"] + span::after {
	  content: '';
	  display: block;
	  position: absolute;
	  box-sizing: border-box;
	}
	input.ui[type="radio"] + span::before,
	input.ui[type="radio"] + span::after {
		border-radius: 50%;
	}
	input.ui[type="radio"] + span::before,
	input.ui[type="checkbox"] + span::before {
	  top: 0;
	  left: 0;
	  width: 16px;
	  height: 16px;
	  border: 1px solid #000;
	}
	input.ui[type="radio"] + span::after,
	input.ui[type="checkbox"] + span::after {
	  opacity: 0;
	  top: 3px;
	  left: 3px;
	  width: 10px;
	  height: 10px;
	  background: #000;
	  transition: all 200ms linear;
	}
	input.ui[type="radio"]:checked + span::after,
	input.ui[type="checkbox"]:checked + span::after {
	  opacity: 1;
	}

	.wrong input,
	.wrong textarea,
	.wrong .jq-selectcontent.__select,
	.wrong input.ui[type="radio"] + span::before,
	.wrong input.ui[type="checkbox"] + span::before {
		border-color: #f3c0c0;
		background: #ffeaea !important;
	}
	.error {
		padding: 5px 0;
		font-size: 14px;
		color: #c34343;
		transition: all 200ms linear;
		transform: translateY(-50%);
		opacity: 0;
	}
	.error.shown {
		opacity: 1;
		transform: translateY(0);
	}

	.ajax_loader {
		position: absolute;
		top: 50%;
		left: 50%;
		width: 60px;
		height: 60px;
		transform: translate(-50%, -50%);
		z-index: 1;
	}
	.ajax_loader_svg {
		width: 100%;
		height: 100%;
	}
	.ajax_loader_circle {
		stroke: #00A499;
		transition: 300ms stroke-dashoffset;
	  transform: rotate(-90deg);
	  transform-origin: 50% 50%;
	}
	.ajax_loader_digit {
		position: absolute;
		top: 0;
		left: 0;
		display: flex;
		align-items: center;
		justify-content: center;
		width: 100%;
		height: 100%;
		font-weight: 400;
		font-size: 14px;
		line-height: 100%;
		text-align: center;
	}

}

@layer modals {

	.fancybox__infobar {
		padding-left: 10px;
	}
	[data-fancybox] {
		cursor: pointer;
	}

	.modal {
		display: none;
	}

}

@layer popups {

	.popup {
		position: absolute;
		transition: all 300ms linear;
		opacity: 0;
		visibility: hidden;
	}

	.popup.shown {
		opacity: 1;
		visibility: visible;
	}

}

@layer map {

	.map_stage {}
	.map_points {
		display: none;
	}
	.map_marker {
		width: 48px;
		height: 48px;
		transform: translate(-50%, -50%);
	}

	/* Ч/Б карта */
	.ymaps3--main-engine-container {
		filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale");
		-webkit-filter: grayscale(100%);
	}

}

/*
*******************************************************************************/

@layer head {

	body {
		--logo-height: 36px;
		--header-height: calc(var(--logo-height) + 40px);
	}
	a[name] {
		scroll-margin-top: calc(var(--header-height) + 20px);
	}

	.head {
		position: sticky;
		top: 0;
		z-index: 10;
	}
	.head_row {
		display: flex;
		align-items: center;
		justify-content: space-between;
		height: var(--header-height);
	}
	.head_logo {
		height: var(--logo-height);
	}
	.head_logo path[fill="black"] {
		fill: light-dark(#000, #fff);
	}
	.head_menu ul {
		list-style: none;
		margin: 0;
		padding: 0;
	}

	body:has(.fullPromo) .head:not(.sticky) {
		position: relative;
	}
	.head.sticky {
		transform: translateY(-100%);
	}
	.head.sticky.shown {
		transition: all 300ms ease-in-out;
		transform: translateY(0);
	}

	@media (max-width: 1023px) {
		.head::before {
			content: '';
			display: block;
			position: fixed;
			inset: 0;
			background: var(--color-bg);
			z-index: -1;
			transition: all 300ms linear;
			opacity: 0;
			visibility: hidden;
		}
		.head:has(.head_menu.shown)::before {
			opacity: 1;
			visibility: visible;
		}
		.head_menu {
			position: fixed;
			inset: var(--header-height) 0 0;
			padding-block: 59px;
			padding-inline: var(--gap-side);
			transition: all 300ms linear;
			opacity: 0;
			visibility: hidden;
		}
		.head_menu.shown {
			opacity: 1;
			visibility: visible;
		}
		.head_menu ul {
			display: grid;
			gap: 30px;
		}
		.head_burger {
			position: relative;
			display: block;
			width: 24px;
			height: 24px;
			padding: 0;
			overflow: hidden;
			font-size: 0;
			text-indent: -9999px;
			border: none;
			background: none;
		}
		.head_burger::before {
			content: '';
			display: block;
			position: absolute;
			inset: -10px;
		}
		.head_burger div,
		.head_burger div::before,
		.head_burger div::after {
			position: absolute;
			left: 0;
			right: 0;
			width: 100%;
			height: 2px;
			background: var(--color-text);
			transition: all 300ms linear;
		}
		.head_burger div {
			left: 50%;
			top: 50%;
			transform: translate(-50%, -50%);
		}
		.head_burger div::before,
		.head_burger div::after {
			content: '';
			display: block;
		}
		.head_burger div::before {
			top: -8px;
		}
		.head_burger div::after {
			bottom: -8px;
		}
		.head_burger[aria-expanded="true"] div {
			background: none;
			width: 16px;
		}
		.head_burger[aria-expanded="true"] div::before {
			top: 0;
			transform: rotate(45deg);
		}
		.head_burger[aria-expanded="true"] div::after {
			bottom: 0;
			transform: rotate(-45deg);
		}
	}

	@media (min-width: 1024px) {
		body {
			--logo-height: 56px;
		}
		.head_menu {
			font-size: 14px;
		}
		.head_menu > ul {
			display: flex;
			align-items: center;
			justify-content: space-between;
			gap: 112px;
		}
		.head_burger {
			display: none;
		}
	}

}

@layer foot {

	.foot {
		margin-top: var(--gap-between);
		padding-block: 25px;
		font-size: 14px;
	}
	.foot_row {
		display: grid;
		align-items: start;
	}
	.foot_logo path[fill="black"] {
		fill: light-dark(#000, #fff);
	}
	.foot_contacts {
		display: grid;
		gap: 14px;
		color: var(--color-accent);
	}
	.foot_menu_title {
		margin-bottom: 30px;
		color: var(--color-gray);
	}
	.foot_menu ul {
		display: grid;
		gap: 15px;
	}
	.foot_made,
	.foot_policy {
		color: var(--color-gray);
		font-size: 12px;
	}

	@media (max-width: 1023px) {
		.foot_row {
			grid-template-columns: 1fr 1fr;
			gap: 0 10px;
		}
		.foot_logo {
			margin-bottom: 43px;
		}
		.foot_menu:nth-child(5) {
			margin-block: 43px 57px;
		}
		.foot_made {
			grid-column: 1 / 2;
		}
		.foot_policy {
			grid-column: 2 / 3;
		}
	}

	@media (min-width: 768px) and (max-width: 1023px) {
		.foot_row {
			grid-template-columns: 1fr 1fr 1fr;
		}
		.foot_contacts {
			grid-column: 3 / 4;
		}
		.foot_menu:nth-child(5) {
			margin-block: 0;
		}
		.foot_made,
		.foot_policy {
			margin-top: 40px;
		}
	}

	@media (min-width: 1024px) {
		.foot_row {
			grid-template-columns: repeat(5, auto);
		}
		.foot_logo,
		.foot_contacts,
		.foot_menu,
		.foot_made,
		.foot_policy {
			grid-column: span 1;
		}
		.foot_menu {
			grid-row: span 2;
		}
		.foot_made,
		.foot_policy {
			align-self: end;
		}
	}

	@media (min-width: 1200px) {
		.foot_row {
			grid-template-columns: repeat(5, 1fr);
		}
	}

}

@layer crumbs {

	.crumbs {}
	.crumbs ol {
		list-style: none;
		display: flex;
		flex-wrap: wrap;
		gap: 4px;
		padding: 0;
		margin: 0;
	}
	.crumbs li {
		padding: 0;
	}
	.crumbs li::before {
		display: none;
	}
	.crumbs li:not(:has(a)) {
		color: #ddd;
	}
	.crumbs a {
		margin-right: 4px;
		color: #000;
	}

	@media (min-width: 1024px) {
		.crumbs {}
	}

}

@layer pagi {

	.pagi {}
	.pagi ul {
	  display: flex;
	  align-items: center;
	  justify-content: center;
	  flex-wrap: wrap;
	  gap: 10px;
	  padding: 0;
	  margin: 0;
	}
	.pagi li {
		padding: 0;
		list-style: none;
	}
	.pagi li::before {
		display: none;
	}
	.pagi_num,
	.pagi_dots {
	  display: flex;
	  align-items: center;
	  justify-content: center;
	  gap: 8px;
	}
	.pagi_num._current {}
	.pagi_prev,
	.pagi_next {}

}

/*
*******************************************************************************/

@layer fullPromo {

	.fullPromo {
		position: relative;
		margin-top: calc(var(--header-height) * -1);
		color: #fff;
	}
	.fullPromo picture {
		position: absolute;
		inset: 0;
	}
	.fullPromo_row {
		display: grid;
		align-content: end;
		position: relative;
		height: 100vh;
		padding-block: 100px;
		z-index: 2;
	}
	.fullPromo::before {
		content: '';
		display: block;
		height: 320px;
		position: absolute;
		left: 0;
		right: 0;
		bottom: 0;
		background: #000;
		background: linear-gradient(to bottom, transparent 0%, #000 100%);
		opacity: .4;
		z-index: 1;
	}
	.fullPromo_subTitle {
		color: oklch(from currentColor l c h / .5);
		font-size: 14px;
	}
	.fullPromo_title {
		margin-block: 10px 25px;
	}

	@media (max-width: 1023px) {
		.fullPromo_logo {
			display: none;
		}
	}

	@media (min-width: 1024px) {
		.fullPromo {}
		.fullPromo_row {
			grid-template-columns: repeat(5, 1fr);
			padding-block: 110px;
		}
		.fullPromo_side {}
		.fullPromo_logo {
			height: 36px;
			margin-top: 55px;
		}
		.fullPromo_logo path {
			fill: #fff;
		}
		.fullPromo_main {
			grid-column: 2 / 4;
		}
		.fullPromo_subTitle {}
		.fullPromo_title {}
		.fullPromo_act {}
	}

}

@layer homeIntro {

	.homeIntro_main h2 {
		margin-block: 15px 27px;
	}
	.homeIntro_row > picture {
		width: 259px;
		margin-top: 50px;
	}

	@media (min-width: 1024px) {
		.homeIntro_row {
			display: grid;
			grid-template-columns: repeat(10, 1fr);
			gap: 0 20px;
		}
		.homeIntro_row > p {
			grid-column: 1 / 3;
		}
		.homeIntro_main {
			grid-column: 3 / 7;
		}
		.homeIntro_main h2 {
			margin-block: 0 20px;
		}
		.homeIntro_row > picture {
			grid-column: 3 / 5;
			width: auto;
		}
	}

}

@layer homeProjects {

	.homeProjects_intro_main h2 {
		margin-block: 15px 20px;
	}
	.homeProjects_row {
		display: flex;
		align-items: flex-start;
		gap: 15px;
		width: 100vw;
		margin-block: 20px 50px;
		margin-inline: calc(var(--gap-side) * -1);
		padding-inline: var(--gap-side);
		overflow-x: scroll;
		-ms-overflow-style: none;
		scrollbar-width: none;
	}
	.homeProjects_row::-webkit-scrollbar {
		display: none;
	}
	.homeProjects_item {
		position: relative;
		flex: 0 0 260px;
		padding-top: 20px;
	}
	.homeProjects_item::before {
		content: '';
		display: block;
		height: 1px;
		position: absolute;
		top: 0;
		left: -15px;
		right: 0;
		background: #D9D9D9;
	}
	.homeProjects_item:first-child::before {
		left: 0;
	}
	.homeProjects_item h3 {
		height: 70px;
		margin-bottom: 5px;
		font-size: 14px;
	}
	.homeProjects_item:nth-child(odd) picture {
		aspect-ratio: 260 / 181;
	}
	.homeProjects_item:nth-child(even) picture {
		aspect-ratio: 260 / 317;
	}
	.homeProjects_item a::before {
		content: '';
		display: block;
		position: absolute;
		inset: 0;
	}
	.homeProjects_item .linkMore {
		transition: all 300ms ease-in-out;
		opacity: 0;
		visibility: hidden;
	}

	@media (min-width: 1024px) {
		.homeProjects_intro {
			display: grid;
			grid-template-columns: repeat(10, 1fr);
			gap: 20px;
			margin-bottom: 50px;
		}
		.homeProjects_intro > p {
			grid-column: 1 / 3;
		}
		.homeProjects_intro_main {
			grid-column: 3 / 8;
		}
		.homeProjects_intro_main h2 {
			margin-block: 0 10px;
		}
		.homeProjects_row {
			display: grid;
			grid-template-columns: repeat(5, 1fr);
			gap: 20px;
		}
		.homeProjects_item:not(:first-child)::before {
			left: -20px;
		}
		.homeProjects_more {
			display: grid;
			grid-template-columns: repeat(5, 1fr);
			gap: 20px;
		}
		.homeProjects_more a {
			grid-column: 2 / 4;
			justify-self: start;
		}
	}

	@media (hover: none) {
		.homeProjects_item .linkMore {
			position: absolute;
			top: 0;
			left: 0;
		}
	}

	@media (hover: hover) {
		.homeProjects_item:hover .linkMore {
			opacity: 1;
			visibility: visible;
		}
	}

}

@layer partners {

	.partners_row {
		display: flex;
		align-items: center;
		gap: 40px;
		width: 100vw;
		margin-top: 15px;
		margin-inline: calc(var(--gap-side) * -1);
		padding-inline: var(--gap-side);
		overflow-x: scroll;
		-ms-overflow-style: none;
		scrollbar-width: none;
	}
	.partners_row::-webkit-scrollbar {
		display: none;
	}

	@media (min-width: 1024px) {
		.partners_grid {
			display: grid;
			grid-template-columns: repeat(5, 1fr);
			gap: 20px;
		}
		.partners_grid h2 {
			grid-column: 2 / 4;
		}
		.partners_row {
			grid-column: 1 / -1;
			justify-content: space-between;
			gap: unset;
			margin-top: 30px;
		}
	}

}