
:root {
	--c-green:         #76AA4D;
	--c-green-light:   #8BB769;
	--c-green-dark:    #6F9155;
	--c-green-muted:   #8CAC73;
	--c-yellow:        #FFF3A4;
	--c-yellow-bright: #FFDF5C;
	--c-orange:        #FF8A59;
	--c-brown:         #924501;
	--c-text:          #4F4F4F;
	--c-text-muted:    #9A9A9A;
	--c-line:          #C8C8C8;
	--c-bg:            #FFFFFF;
	--c-bg-soft:       #F5F4F0;
	--c-bg-card:       #ECEAE3;

	--font-main: "Nunito", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;

	--container: 1120px;
	--gutter: 20px;
	--radius: 12px;
	--radius-lg: 24px;
	--header-h: 72px;
	--header-top: 32px;
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body {
	margin: 0;
	font-family: var(--font-main);
	font-size: 16px;
	line-height: 1.5;
	color: var(--c-text);
	background: var(--c-bg);
	-webkit-font-smoothing: antialiased;
}
h1, h2, h3, h4, p, ul, ol, figure { margin: 0; }
ul, ol { padding: 0; list-style: none; }
img, svg, video { display: block; max-width: 100%; height: auto; }
a { color: inherit; text-decoration: none; }
button, input, textarea { font: inherit; color: inherit; }
button { cursor: pointer; background: none; border: 0; padding: 0; }
* { -webkit-tap-highlight-color: transparent; }
@media (hover: none) and (pointer: coarse) {
	body { -webkit-user-select: none; user-select: none; -webkit-touch-callout: none; }
	input, textarea { -webkit-user-select: text; user-select: text; }
}

.container {
	width: 100%;
	max-width: calc(var(--container) + var(--gutter) * 2);
	margin: 0 auto;
	padding: 0 var(--gutter);
}
.container--narrow { max-width: 820px; }

.visually-hidden {
	position: absolute !important;
	width: 1px; height: 1px;
	margin: -1px; padding: 0;
	overflow: hidden; clip: rect(0 0 0 0);
	white-space: nowrap; border: 0;
}
.skip-link {
	position: absolute; left: -9999px; top: 0;
	padding: 8px 16px; background: var(--c-yellow); z-index: 1000;
}
.skip-link:focus { left: 0; }

.btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 48px;
	padding: 12px 24px;
	border-radius: 5px;
	font-size: 16px;
	font-weight: 600;
	line-height: 1.2;
	transition: background-color .2s, color .2s, transform .1s;
}
.btn:active { transform: translateY(1px); }
.btn--yellow { background: var(--c-yellow); color: var(--c-text); }
@media (hover: hover) { .btn--yellow:hover { background: var(--c-yellow-bright); } }
.btn--yellow:active { background: var(--c-yellow-bright); }
.btn--green { background: var(--c-green-dark); color: #fff; }
@media (hover: hover) { .btn--green:hover { background: var(--c-green); } }
.btn--green:active { background: var(--c-green); }

.tag {
	display: inline-block;
	height: 36px;
	padding: 0 16px;
	border: 1px solid var(--c-green);
	border-radius: 10px;
	color: var(--c-green);
	font-size: 16px;
	line-height: 34px;
	letter-spacing: .05em;
	text-transform: uppercase;
}
.tag--white { color: #fff; border-color: #fff; }
.tag--filled { color: #fff; border-color: transparent; }
.tag--orange { background: var(--c-orange); }
.tag--green { background: var(--c-green); border-color: var(--c-green); }

.section { padding-top: 120px; }
.section__title {
	margin-top: 35px;
	font-size: 48px;
	font-weight: 600;
	line-height: 54px;
}
.section__stub { margin-top: 16px; color: var(--c-text-muted); }

.header {
	position: fixed;
	top: var(--header-top);
	left: 0;
	right: 0;
	z-index: 100;
	pointer-events: none;
}
.header__bar {
	position: relative;
	display: flex;
	align-items: center;
	height: var(--header-h);
	padding: 0 18px 0 15px;
	border-radius: 10px;
	background: rgba(217, 217, 217, .2);
	-webkit-backdrop-filter: blur(10px);
	backdrop-filter: blur(10px);
	color: #fff;
	pointer-events: auto;
	transition: background-color .25s, color .25s;
}
.header__bar::before {
	content: "";
	position: absolute;
	inset: 0;
	border-radius: inherit;
	padding: 1px;
	background: linear-gradient(98deg, #fff 0%, rgba(255, 255, 255, .3) 100%);
	opacity: .4;
	-webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
	mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
	-webkit-mask-composite: xor;
	mask-composite: exclude;
	pointer-events: none;
}
.header__logo { display: block; flex: none; width: 137px; height: 37px; overflow: hidden; }
.header__logo-img { display: block; width: 141.6px; height: 37px; max-width: none; }
.header__logo-img--dark { display: none; }
.header__divider { flex: none; width: 1px; height: 48px; margin-left: 20px; background: #D9D9D9; }
.header__nav { margin-left: 35px; }
.nav { display: flex; gap: 32px; }
.nav a { display: block; font-size: 16px; line-height: 20px; transition: opacity .2s; }
@media (hover: hover) { .nav a:hover { opacity: .75; } }
.nav a:active { opacity: .75; }
.header__cta { margin-left: auto; min-height: 40px; height: 40px; width: 158px; padding: 0; color: #000; }
.header__burger { display: none; }
.header__menu-cta { display: none; }

.header--scrolled .header__bar,
body:not(.home) .header__bar { background: rgba(255, 255, 255, .8); color: var(--c-text); }
.header--scrolled .header__logo-img--light,
body:not(.home) .header__logo-img--light { display: none; }
.header--scrolled .header__logo-img--dark,
body:not(.home) .header__logo-img--dark { display: block; }

.hero {
	position: relative;
	height: 800px;
	overflow: hidden;
	color: #fff;
}
.hero__bg { position: absolute; inset: 0; z-index: 0; }
.hero__bg img {
	position: absolute;
	left: calc(50% - 1243px);
	top: -114px;
	width: 2218px;
	height: 1248px;
	max-width: none;
}
.hero__bg::after {
	content: "";
	position: absolute;
	inset: 0;
	background: rgba(0, 0, 0, .2);
}
.hero__inner { position: relative; height: 100%; }
.hero__circle {
	position: absolute;
	left: 730px;
	top: 333px;
	width: 600px;
	height: 609px;
	border-radius: 50%;
	background: rgba(255, 255, 255, .5);
	-webkit-backdrop-filter: blur(20px);
	backdrop-filter: blur(20px);
	z-index: 1;
}
.hero__content { position: absolute; left: 0; top: 175px; z-index: 2; width: 500px; }
.hero__title {
	font-size: 60px;
	font-weight: 600;
	line-height: 66px;
	letter-spacing: 0;
}
.hero__text {
	max-width: 402px;
	margin-top: 36px;
	font-size: 16px;
	line-height: 18px;
}
.hero__btn {
	position: absolute;
	top: 480px;
	left: 0;
	width: 240px;
	height: 48px;
	min-height: 48px;
	padding: 0;
	color: var(--c-text);
}
.hero__sectors { position: absolute; left: 730px; top: 335px; z-index: 3; }
.hero__phone {
	position: absolute;
	left: 866px;
	top: 173px;
	width: 237px;
	z-index: 4;
	border-radius: 17.36% / 8.28%;
	overflow: hidden;
	-webkit-mask-image: -webkit-radial-gradient(#fff, #000);
}
.hero__phone video { display: block; width: 100%; height: auto; }
.br-tab { display: none; }

.problems__list {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 14px;
	margin-top: 36px;
}
.problem-card {
	min-height: 212px;
	padding: 22px 21px 24px;
	border-radius: 10px;
	background: var(--c-bg-soft);
}
.problem-card__icon { display: block; width: 28px; height: 28px; color: var(--c-text-muted); }
.problem-card__icon svg { width: 28px; height: 28px; }

.problems__list[data-animate] .problem-card__icon svg { transform-origin: 50% 50%; }
.problems__list.is-visible .problem-card:nth-child(1) .problem-card__icon svg { animation: ico-zoom 1.6s ease-in-out 0s both; }
.problems__list.is-visible .problem-card:nth-child(2) .problem-card__icon svg { animation: ico-zoom 1.6s ease-in-out 1.5s both; }
.problems__list.is-visible .problem-card:nth-child(3) .problem-card__icon svg { animation: ico-zoom 1.6s ease-in-out 3s both; }
@keyframes ico-zoom {
	0%   { transform: scale(1); }
	12%  { transform: scale(1.8); }
	78%  { transform: scale(1.8); }
	100% { transform: scale(1); }
}
.problems__list[data-animate] .problem-card { transform-origin: 50% 50%; will-change: transform, opacity; }
.problems__list.is-visible .problem-card:nth-child(1) { animation: card-turn-1 4.6s ease-in-out both; }
.problems__list.is-visible .problem-card:nth-child(2) { animation: card-turn-2 4.6s ease-in-out both; }
.problems__list.is-visible .problem-card:nth-child(3) { animation: card-turn-3 4.6s ease-in-out both; }
@keyframes card-turn-1 {
	0%        { transform: scale(1);    opacity: 1; }
	6%, 30%   { transform: scale(1.04); opacity: 1; }
	36%, 94%  { transform: scale(1);    opacity: .78; }
	100%      { transform: scale(1);    opacity: 1; }
}
@keyframes card-turn-2 {
	0%        { transform: scale(1);    opacity: 1; }
	6%, 30%   { transform: scale(1);    opacity: .78; }
	38%, 62%  { transform: scale(1.04); opacity: 1; }
	68%, 94%  { transform: scale(1);    opacity: .78; }
	100%      { transform: scale(1);    opacity: 1; }
}
@keyframes card-turn-3 {
	0%        { transform: scale(1);    opacity: 1; }
	6%, 62%   { transform: scale(1);    opacity: .78; }
	70%, 94%  { transform: scale(1.04); opacity: 1; }
	100%      { transform: scale(1);    opacity: 1; }
}
@media (prefers-reduced-motion: reduce) {
	.problems__list[data-animate] .problem-card { opacity: 0; will-change: opacity; }
	.problems__list.is-visible .problem-card:nth-child(n) { animation: soft-in .8s ease both; }
	.problems__list.is-visible .problem-card:nth-child(2) { animation-delay: .4s; }
	.problems__list.is-visible .problem-card:nth-child(3) { animation-delay: .8s; }
}
@keyframes soft-in { from { opacity: 0; } to { opacity: 1; } }
.ico-clock__min, .ico-clock__hour { transform-box: view-box; transform-origin: 450px 1117px; }
.problems__list.is-visible .ico-clock__min  { animation: ico-clock-min 1.1s cubic-bezier(.4, 0, .2, 1) .2s forwards; }
.problems__list.is-visible .ico-clock__hour { animation: ico-clock-hour 1.1s cubic-bezier(.4, 0, .2, 1) .2s forwards; }
@keyframes ico-clock-min  { from { transform: rotate(0); } to { transform: rotate(720deg); } }
@keyframes ico-clock-hour { from { transform: rotate(0); } to { transform: rotate(360deg); } }
.ico-fuel__ghost { opacity: .3; }
.ico-fuel__fill { clip-path: inset(0 0 0 0) fill-box; }
.problems__list.is-visible .ico-fuel__fill { animation: ico-fuel-fill 1.2s ease-in-out 1.7s forwards; }
@keyframes ico-fuel-fill {
	0%   { clip-path: inset(100% 0 0 0) fill-box; }
	100% { clip-path: inset(0 0 0 0) fill-box; }
}
.ico-chart__bar { transform-box: fill-box; transform-origin: 50% 100%; }
.problems__list.is-visible .ico-chart__bar:nth-child(1) { animation: ico-bar-1 1.2s ease-out 3.1s forwards; }
.problems__list.is-visible .ico-chart__bar:nth-child(2) { animation: ico-bar-2 1.2s ease-out 3.1s forwards; }
.problems__list.is-visible .ico-chart__bar:nth-child(3) { animation: ico-bar-3 1.2s ease-out 3.1s forwards; }
@keyframes ico-bar-1 { 0% { transform: scaleY(1); } 20% { transform: scaleY(0); } 45% { transform: scaleY(1.15); } 55%, 100% { transform: scaleY(1); } }
@keyframes ico-bar-2 { 0% { transform: scaleY(1); } 20%, 42% { transform: scaleY(0); } 67% { transform: scaleY(1.15); } 77%, 100% { transform: scaleY(1); } }
@keyframes ico-bar-3 { 0% { transform: scaleY(1); } 20%, 64% { transform: scaleY(0); } 89% { transform: scaleY(1.15); } 100% { transform: scaleY(1); } }
@media (prefers-reduced-motion: reduce) {
	.problems__list.is-visible .problem-card:nth-child(n) .problem-card__icon svg, .problems__list.is-visible .ico-clock__min, .problems__list.is-visible .ico-clock__hour,
	.problems__list.is-visible .ico-fuel__fill, .problems__list.is-visible .ico-chart__bar:nth-child(n) { animation: none; }
}
.problem-card__title {
	margin-top: 31px;
	font-size: 18px;
	font-weight: 600;
	line-height: 22px;
	text-transform: uppercase;
}
.problem-card__sub {
	margin-top: 6px;
	padding-bottom: 9px;
	border-bottom: 1px solid #D9D9D9;
	font-size: 14px;
	line-height: 16px;
	color: var(--c-text-muted);
}
.problem-card__text {
	margin-top: 8px;
	font-size: 14px;
	line-height: 15px;
	color: var(--c-green);
}
.roles { padding-bottom: 200px; }
.roles__top {
	position: relative;
	display: grid;
	grid-template-columns: 378px 356px 1fr;
	min-height: 337px;
}
.roles__title { margin-top: 0; }
.roles__text {
	margin-top: 23px;
	font-size: 16px;
	line-height: 18px;
	color: var(--c-text-muted);
}
.roles__btn { width: 274px; height: 48px; margin-top: 28px; padding: 0; color: var(--c-text); }
.roles__before, .roles__after { position: relative; }
.roles__after { padding-left: 22px; }
.roles__after::before {
	content: "";
	position: absolute;
	left: -1px;
	top: 0;
	width: 1px;
	height: 337px;
	background: #D9D9D9;
}
.roles__screen {
	position: relative;
	overflow: hidden;
	border: 1px solid #DADADA;
	background: #fff;
	transform-origin: 50% 50%;
	transition: transform .45s cubic-bezier(.2, .8, .2, 1), box-shadow .45s ease;
}
@media (hover: hover) {
	.roles__screen:hover {
		transform: scale(1.6);
		z-index: 5;
		box-shadow: 0 18px 50px rgba(0, 0, 0, .28);
	}
	.roles__before:hover, .roles__after:hover { z-index: 6; }
}
.roles__screen.is-zoomed {
	transform: translate(var(--zoom-x, 0px), var(--zoom-y, 0px)) scale(var(--zoom-k, 1.6));
	z-index: 5;
	box-shadow: 0 18px 50px rgba(0, 0, 0, .28);
}
.roles__before, .roles__after, .roles__screens { z-index: 1; }
.roles__before:has(.is-zoomed), .roles__after:has(.is-zoomed) { z-index: 6; }
.roles__screen img { display: block; max-width: none; }
.roles__screen--dashboard { width: 334px; height: 250px; margin-top: 50px; border-radius: 10px; }
.roles__screen--dashboard img { width: 100%; height: 100%; }
.roles__screens { display: flex; gap: 10px; margin-top: 49px; }
.roles__screen--chat { border-radius: 7px; }
.roles__screen--chat img { position: absolute; }
.roles__screen--chat-2 { width: 191px; height: 250px; }
.roles__screen--chat-2 img { width: 247px; left: -31px; top: -99px; }
.roles__screen--chat-1 { width: 162px; height: 250px; margin-top: 1px; }
.roles__screen--chat-1 img { width: 210px; left: -26px; top: -69px; }

.roles__tabs {
	display: grid;
	grid-template-columns: repeat(5, 212px);
	grid-auto-rows: 49px;
	gap: 15px;
	align-items: start;
	margin-top: 60px;
}
.role-tab {
	position: relative;
	border-radius: 10px;
	background: var(--c-bg-soft);
	transition: border-radius .2s ease;
}
.role-tab.is-open { z-index: 2; border-bottom-left-radius: 0; border-bottom-right-radius: 0; }
.role-tab__btn {
	display: block;
	width: 100%;
	height: 49px;
	padding: 7px 14px 0;
	font-size: 16px;
	line-height: 18px;
	text-align: center;
	color: var(--c-text);
	cursor: default;
}
.role-tab__title {
	display: block;
	padding-bottom: 5px;
	border-bottom: 1px solid transparent;
	transition: border-color .35s ease, color .35s ease;
}
.role-tab__panel {
	position: absolute;
	left: 0;
	right: 0;
	top: 100%;
	display: grid;
	grid-template-rows: 0fr;
	border-radius: 0 0 10px 10px;
	background: var(--c-bg-soft);
	transition: grid-template-rows .35s ease;
}
.role-tab__panel > * { overflow: hidden; min-height: 0; }
.role-tab__text {
	padding: 0;
	font-size: 14px;
	line-height: 15px;
	text-align: center;
	color: var(--c-text);
	opacity: 1;
}
.role-tab__text > span { display: block; padding: 8px 14px 10px; }
.role-tab.is-open .role-tab__title { border-bottom-color: rgba(79, 79, 79, .5); color: rgba(79, 79, 79, .7); }
.role-tab.is-open .role-tab__panel { grid-template-rows: 1fr; }
.industries {
	position: relative;
	height: 736px;
	overflow: hidden;
	background: var(--c-green-dark);
	color: #fff;
}
.industries__arcs { position: absolute; right: 0; top: -3px; width: 551px; height: 551px; }
.industries .container { position: relative; }
.industries__head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-top: 35px;
}
.industries__title { margin-top: 0; }
.industries__btn { width: 268px; height: 48px; padding: 0; color: var(--c-text); }
.industries__list {
	display: grid;
	grid-template-columns: repeat(4, 268px);
	gap: 16px;
	margin-top: 40px;
}
.industry-card {
	position: relative;
	height: 335px;
	overflow: hidden;
	border-radius: 20px;
}
.industry-card__img { position: absolute; inset: 0; }
.industry-card__img img { position: absolute; max-width: none; transform-origin: 50% 50%; transition: transform .45s ease, filter .45s ease; }
.industry-card--industry-agro img      { width: 623px; height: 415px; left: -126px; top: -81px; }
.industry-card--industry-oil img       { width: 594px; height: 335px; left: -163px; top: 0; }
.industry-card--industry-build img     { width: 596px; height: 335px; left: -164px; top: 0; }
.industry-card--industry-transport img { width: 997px; height: 335px; left: -296px; top: 0; }
.industry-card--shade::before {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(to top, rgba(0, 0, 0, .4) 37%, rgba(0, 0, 0, 0) 70%);
	pointer-events: none;
}
.industry-card::after {
	content: "";
	position: absolute;
	inset: 0;
	background: rgba(0, 0, 0, .35);
	opacity: 0;
	transition: opacity .45s ease;
	pointer-events: none;
}
.industry-card__body { z-index: 1; }
.industry-card__panel {
	display: grid;
	grid-template-rows: 0fr;
	transition: grid-template-rows .4s ease;
}
.industry-card__panel > * { overflow: hidden; }
@media (hover: hover) {
	.industry-card:hover::after { opacity: 1; }
	.industry-card:hover .industry-card__img img { transform: scale(1.06); }
	.industry-card:hover .industry-card__panel { grid-template-rows: 1fr; }
	.industry-card:hover .industry-card__text { opacity: 1; margin-top: 10px; color: #fff; }
	.industry-card:hover .industry-card__title { color: var(--c-line); }
}
.industry-card.is-open::after, .industry-card:focus-within::after { opacity: 1; }
.industry-card.is-open .industry-card__img img, .industry-card:focus-within .industry-card__img img { transform: scale(1.06); }
.industry-card.is-open .industry-card__panel, .industry-card:focus-within .industry-card__panel { grid-template-rows: 1fr; }
.industry-card.is-open .industry-card__text, .industry-card:focus-within .industry-card__text { opacity: 1; margin-top: 10px; color: #fff; }
.industry-card.is-open .industry-card__title, .industry-card:focus-within .industry-card__title { color: var(--c-line); }
.industry-card__body {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	padding: 0 28px 27px;
}
.industry-card__num { display: block; font-size: 14px; line-height: 16px; color: var(--c-line); }
.industry-card__title {
	margin-top: 10px;
	font-size: 20px;
	font-weight: 600;
	line-height: 22px;
	transition: color .4s ease;
}
.industry-card__text {
	margin-top: 0;
	font-size: 14px;
	line-height: 15px;
	color: var(--c-line);
	opacity: 0;
	transition: opacity .3s ease .1s, margin .4s ease, color .4s ease;
}
.mechanics { padding-bottom: 120px; }
.mechanics__head {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	margin-top: 35px;
}
.mechanics__title { margin-top: 0; }
.mechanics__btn { width: 274px; height: 48px; margin-top: 2px; padding: 0; color: var(--c-text); }
.steps {
	position: relative;
	height: 132px;
	margin-top: 66px;
}
.steps::before {
	content: "";
	position: absolute;
	left: 30px;
	right: 0;
	top: 0;
	height: 1px;
	background: var(--c-green);
}
.step { position: absolute; top: 0; display: flex; gap: 20px; }
.step:nth-child(1) { left: 0; }
.step:nth-child(2) { left: 278px; }
.step:nth-child(3) { left: 554px; }
.step:nth-child(4) { left: 866px; }
.step::before {
	content: "";
	position: absolute;
	left: 30px;
	top: 0;
	width: 1px;
	height: 38px;
	background: var(--c-green);
}
.step__num {
	display: flex;
	align-items: center;
	justify-content: center;
	flex: none;
	width: 60px;
	height: 60px;
	margin-top: 38px;
	border-radius: 50%;
	background: var(--c-green-light);
	font-size: 24px;
	font-weight: 600;
	color: var(--c-yellow);
}
.step__body { padding-top: 38px; }
.step__title { font-size: 18px; font-weight: 600; line-height: 20px; }
.step__text { margin-top: 8px; font-size: 14px; line-height: 15px; color: var(--c-text-muted); }

.steps[data-animate]::before { transform: scaleX(0); transform-origin: left; transition: transform .8s ease; }
.steps[data-animate] .step::before { transform: scaleY(0); transform-origin: top; transition: transform .3s ease; }
.steps[data-animate] .step__num { transform: scale(0); transition: transform .45s cubic-bezier(.34, 1.56, .64, 1); }
.steps[data-animate] .step__body { opacity: 0; transform: translateY(10px); transition: opacity .45s ease, transform .45s ease; }
.steps.is-visible::before { transform: scaleX(1); }
.steps.is-visible .step::before { transform: scaleY(1); }
.steps.is-visible .step__num { transform: scale(1); }
.steps.is-visible .step__body { opacity: 1; transform: none; }
.steps.is-visible .step:nth-child(1)::before { transition-delay: .35s; }
.steps.is-visible .step:nth-child(1) .step__num { transition-delay: .5s; }
.steps.is-visible .step:nth-child(1) .step__body { transition-delay: .65s; }
.steps.is-visible .step:nth-child(2)::before { transition-delay: .8s; }
.steps.is-visible .step:nth-child(2) .step__num { transition-delay: .95s; }
.steps.is-visible .step:nth-child(2) .step__body { transition-delay: 1.1s; }
.steps.is-visible .step:nth-child(3)::before { transition-delay: 1.25s; }
.steps.is-visible .step:nth-child(3) .step__num { transition-delay: 1.4s; }
.steps.is-visible .step:nth-child(3) .step__body { transition-delay: 1.55s; }
.steps.is-visible .step:nth-child(4)::before { transition-delay: 1.7s; }
.steps.is-visible .step:nth-child(4) .step__num { transition-delay: 1.85s; }
.steps.is-visible .step:nth-child(4) .step__body { transition-delay: 2s; }
@media (prefers-reduced-motion: reduce) {
	.steps[data-animate]::before, .steps[data-animate] .step::before, .steps[data-animate] .step__num, .steps[data-animate] .step__body { opacity: 0; transform: none; transition: opacity .6s ease; }
	.steps.is-visible::before, .steps.is-visible .step::before, .steps.is-visible .step__num, .steps.is-visible .step__body { opacity: 1; }
}
.features {
	position: relative;
	padding-bottom: 120px;
	overflow: hidden;
	background: var(--c-bg-soft);
}
.features__sectors {
	position: absolute;
	left: calc(50% + 285px);
	top: 191px;
	width: 487px;
	height: 487px;
}
.features .container { position: relative; }
.features__head {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	margin-top: 35px;
}
.features__title { margin-top: 0; }
.features__btn { width: 246px; height: 48px; padding: 0; }
.features__list {
	display: grid;
	grid-template-columns: repeat(3, 320px);
	grid-template-rows: 169px 155px;
	row-gap: 36px;
	margin-top: 65px;
}
.feature__icon {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 60px;
	height: 60px;
	border-radius: 10px;
	background: var(--c-yellow);
	color: var(--c-orange);
}
.feature__icon svg { width: 24px; height: 24px; }
.feature__title { margin-top: 16px; font-size: 18px; font-weight: 600; line-height: 20px; }
.feature__text { margin-top: 8px; font-size: 14px; line-height: 15px; color: var(--c-text-muted); }

.features__list[data-animate] .feature { opacity: 0; transform: translateX(-28px); }
.features__list.is-visible .feature { animation: feature-in .9s cubic-bezier(.2, .7, .2, 1) forwards; }
.features__list.is-visible .feature:nth-child(1) { animation-delay: 0s; }
.features__list.is-visible .feature:nth-child(2) { animation-delay: .27s; }
.features__list.is-visible .feature:nth-child(3) { animation-delay: .54s; }
.features__list.is-visible .feature:nth-child(4) { animation-delay: .81s; }
.features__list.is-visible .feature:nth-child(5) { animation-delay: 1.08s; }
.features__list.is-visible .feature:nth-child(6) { animation-delay: 1.35s; }
@keyframes feature-in { to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) {
	.features__list[data-animate] .feature { transform: none; }
}
.case {
	padding-top: 0;
	padding-bottom: 120px;
	background: linear-gradient(to bottom, var(--c-bg-soft) 0, #fff 182px);
}
.case-card {
	position: relative;
	display: flex;
	height: 660px;
	border-radius: 20px;
	background: var(--c-green-dark);
	color: #fff;
}
.case-card__info { flex: none; width: 546px; padding: 54px 0 0 45px; }
.case-card__title { margin-top: 35px; }
.case-card__stats { margin-top: 38px; }
.case-stat + .case-stat { margin-top: 24px; }
.case-stat__num {
	display: block;
	font-size: 48px;
	font-weight: 700;
	line-height: 54px;
	color: var(--c-yellow-bright);
}
.case-stat__label { display: block; margin-top: 3px; font-size: 16px; font-weight: 700; line-height: 18px; }
.case-stat__sub { display: block; margin-top: 8px; font-size: 16px; line-height: 18px; opacity: .5; }
.case-card__photo {
	position: relative;
	flex: 1 1 auto;
	min-width: 0;
	height: 660px;
	overflow: hidden;
	border-radius: 20px;
}
.case-card__photo img,
.case-card__photo video {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: 50% 50%;
}
.case-card__photo picture { position: absolute; inset: 0; }
.case-card__btn { position: absolute; right: 52px; top: 54px; width: 274px; height: 48px; padding: 0; color: var(--c-text); }
.case-card__place { position: absolute; left: 42px; right: 52px; bottom: 44px; }
.case-card__region { display: block; font-size: 24px; font-weight: 700; line-height: 28px; }
.case-card__fleet {
	display: block;
	margin-top: 6px;
	padding-bottom: 24px;
	border-bottom: 1px solid #fff;
	font-size: 16px;
	line-height: 18px;
	opacity: .7;
}
.case-card__period { display: block; margin-top: 24px; font-size: 16px; line-height: 18px; opacity: .7; }
.case-card__period b { font-weight: 700; }
.page-content { padding: 144px 0 60px; }
.page-content__title { font-size: 36px; margin-bottom: 24px; }
.prose > * + * { margin-top: 1em; }
.prose h2 { font-size: 24px; margin-top: 1.5em; }
.prose ul { list-style: disc; padding-left: 1.2em; }
.prose a { color: var(--c-green); text-decoration: underline; }
.prose .legal-rev { margin-top: -8px; font-size: 14px; color: #7a7a7a; }

.form {
	position: relative;
	padding-bottom: 51px;
	color: #fff;
}
.form__bg {
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	height: 949px;
	overflow: hidden;
	z-index: 0;
}
.form__bg img {
	position: absolute;
	left: 50%;
	top: -176px;
	width: 1950px;
	max-width: none;
	height: 1300px;
	transform: translateX(-50%);
}
.form__bg::after { content: ""; position: absolute; inset: 0; background: rgba(0, 0, 0, .3); }
.form .container { position: relative; z-index: 1; }
.form__top {
	display: flex;
	justify-content: space-between;
	height: 304px;
}
.form__intro { display: flex; flex-direction: column; justify-content: space-between; }
.form__title { margin-top: 3px; }
.form__text { font-size: 16px; line-height: 18px; }

.lead-form {
	position: relative;
	width: 573px;
	padding: 12px 32px 32px 33px;
	border-radius: 10px;
	background: rgba(217, 217, 217, .2);
	-webkit-backdrop-filter: blur(10px);
	backdrop-filter: blur(10px);
}
.lead-form::before {
	content: "";
	position: absolute;
	inset: 0;
	border-radius: inherit;
	padding: 1px;
	background: linear-gradient(90deg, #fff 0%, rgba(255, 255, 255, .3) 100%);
	opacity: .4;
	-webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
	mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
	-webkit-mask-composite: xor;
	mask-composite: exclude;
	pointer-events: none;
}
.lead-form__trap { position: absolute; left: -9999px; }
.lead-form__field { border-bottom: 1px solid #fff; }
.lead-form__input {
	display: block;
	width: 100%;
	padding: 20px 0 11px;
	border: 0;
	background: none;
	font-size: 16px;
	line-height: 18px;
	color: #fff;
	outline: none;
}
.lead-form__input::placeholder { color: #fff; opacity: .5; }
.lead-form__consent {
	display: flex;
	align-items: center;
	gap: 10px;
	margin-top: 20px;
	font-size: 13px;
	line-height: 16px;
	cursor: pointer;
}
.lead-form__checkbox { position: absolute; opacity: 0; width: 1px; height: 1px; }
.lead-form__check {
	flex: none;
	width: 16px;
	height: 16px;
	border: 1px solid #fff;
	border-radius: 4px;
	transition: background-color .2s;
}
.lead-form__checkbox:checked + .lead-form__check {
	background: var(--c-yellow) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3.5 8.5l3 3 6-7' fill='none' stroke='%234F4F4F' stroke-width='2'/%3E%3C/svg%3E") center / 14px no-repeat;
	border-color: var(--c-yellow);
}
.lead-form__checkbox:focus-visible + .lead-form__check { outline: 2px solid var(--c-yellow); outline-offset: 2px; }
.lead-form__consent-text a { text-decoration: underline; text-underline-offset: 2px; }
.lead-form__submit { width: 100%; height: 48px; margin-top: 16px; padding: 0; color: #000; }
.form-tip {
	position: absolute;
	z-index: 5;
	width: max-content;
	max-width: 300px;
	padding: 10px 14px;
	border-radius: 8px;
	background: rgba(30, 20, 10, .78);
	-webkit-backdrop-filter: blur(6px);
	backdrop-filter: blur(6px);
	color: #fff;
	font-size: 14px;
	line-height: 18px;
	opacity: 0;
	transform: translateX(6px);
	transition: opacity .25s ease, transform .25s ease;
	pointer-events: none;
}
.form-tip::after {
	content: "";
	position: absolute;
	right: -6px;
	top: 50%;
	margin-top: -6px;
	border: 6px solid transparent;
	border-right: 0;
	border-left-color: rgba(30, 20, 10, .78);
}
.form-tip.is-visible { opacity: 1; transform: none; }
.form-tip--ok { background: rgba(118, 170, 77, .9); }
.form-tip--ok::after { border-left-color: rgba(118, 170, 77, .9); }
.lead-form.is-sending .lead-form__submit { opacity: .6; pointer-events: none; }
/* Yandex SmartCaptcha: виджет невидимый; уведомление об обработке данных (обязательно по условиям
   сервиса, раз его значок скрыт) — мелкой строкой под карточкой, чтобы размер карточки остался по макету */
.lead-form__captcha { position: absolute; }
.lead-form__captcha-note {
	position: absolute;
	left: 0;
	right: 0;
	top: 100%;
	margin-top: 10px;
	font-size: 12px;
	line-height: 16px;
	text-align: center;
	color: rgba(255, 255, 255, .6);
}
.lead-form__captcha-note a { color: inherit; text-decoration: underline; }

.form__questions {
	position: relative;
	margin-top: 39px;
	padding-top: 45px;
	border-top: 1px solid #fff;
	min-height: 100px;
}
.form__questions-title { margin-top: 0; }
.form__questions-text {
	position: absolute;
	left: 546px;
	top: 38px;
	font-size: 16px;
	line-height: 18px;
}
.form__arrow { position: absolute; left: 993px; top: 48px; width: 30px; height: 30px; }
.form__arrow svg { width: 30px; height: 30px; }
.form__mail {
	position: absolute;
	right: 0;
	top: 38px;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 50px;
	height: 50px;
	border-radius: 50%;
	background: #fff;
	color: var(--c-brown);
	transition: opacity .2s ease;
}
@media (hover: hover) { .form__mail:hover { opacity: .6; } }
.form__mail:active { opacity: .6; }
.form__mail svg { width: 24px; height: 24px; }
.form__mail--mobile { display: none; }

.footer {
	position: relative;
	z-index: 1;
	height: 335px;
	padding-top: 181px;
	background: linear-gradient(to bottom, rgba(26, 0, 0, 0) 0, #1A0000 104px);
	color: #fff;
}
body:not(.home) .footer { background: #1A0000; }
.footer .container { position: relative; }
.footer__row { display: flex; align-items: flex-start; }
.footer__row--bottom { margin-top: 42px; }
.footer__logo { display: block; flex: none; width: 137px; height: 36px; overflow: hidden; }
.footer__logo-img { display: block; width: 141.6px; height: 37px; max-width: none; }
.footer__nav { margin-left: 128px; }
.footer__menu { display: flex; gap: 34px; margin-top: 8px; }
.footer__menu a, .footer__contacts a, .footer__copy, .footer__legal-menu a { font-size: 16px; line-height: 18px; }
.footer__contacts {
	position: absolute;
	right: var(--gutter);
	top: 8px;
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	gap: 17px;
}
.footer__link, .footer__legal-menu a { text-decoration: underline; text-underline-offset: 2px; }
.footer__menu a, .footer__legal-menu a, .footer__contact { transition: opacity .2s ease; }
@media (hover: hover) { .footer__menu a:hover, .footer__legal-menu a:hover, .footer__contact:hover { opacity: .6; } }
.footer__menu a:active, .footer__legal-menu a:active, .footer__contact:active { opacity: .6; }
.footer__contact { display: inline-flex; align-items: center; gap: 6px; }
.footer__contact svg { width: 18px; height: 18px; flex: none; }
.footer__copy { flex: none; width: 265px; }
.footer__copy-short { display: none; }
.footer__legal-menu { display: flex; gap: 52px; }
html.is-loading { overflow: hidden; }
.skeleton {
	position: fixed;
	inset: 0;
	z-index: 1000;
	background: var(--c-bg);
	overflow: hidden;
	transition: opacity .45s ease;
}
.skeleton--hide { opacity: 0; pointer-events: none; }
.skeleton__inner { position: relative; height: 100%; }
.sk {
	display: block;
	position: absolute;
	border-radius: 8px;
	background: linear-gradient(90deg, #E4E2DA 0%, #F3F2EE 40%, #E4E2DA 80%);
	background-size: 600px 100%;
	animation: sk-shimmer 1.4s linear infinite;
}
@keyframes sk-shimmer { from { background-position: -600px 0; } to { background-position: 600px 0; } }
.skeleton__bar {
	position: absolute;
	left: var(--gutter);
	right: var(--gutter);
	top: var(--header-top);
	height: var(--header-h);
	border-radius: 10px;
	background: var(--c-bg-soft);
}
.sk--logo { left: 15px; top: 18px; width: 137px; height: 36px; }
.sk--nav { top: 27px; width: 96px; height: 18px; }
.sk--nav:nth-child(2) { left: 208px; } .sk--nav:nth-child(3) { left: 336px; } .sk--nav:nth-child(4) { left: 464px; }
.sk--nav:nth-child(5) { left: 592px; } .sk--nav:nth-child(6) { left: 720px; }
.sk--cta { right: 18px; top: 16px; width: 158px; height: 40px; border-radius: 5px; }
.skeleton__hero { position: absolute; left: var(--gutter); right: var(--gutter); top: 0; height: 800px; }
.sk--h1 { left: 0; height: 46px; }
.sk--h1:nth-child(1) { top: 180px; } .sk--h1:nth-child(2) { top: 246px; } .sk--h1:nth-child(3) { top: 312px; }
.sk--p { left: 0; height: 12px; border-radius: 6px; }
.skeleton__hero .sk--p:nth-child(4) { top: 410px; } .skeleton__hero .sk--p:nth-child(5) { top: 428px; }
.skeleton__hero .sk--p:nth-child(6) { top: 446px; } .skeleton__hero .sk--p:nth-child(7) { top: 464px; }
.sk--btn { left: 0; top: 655px; width: 240px; height: 48px; border-radius: 5px; }
.sk--phone { left: 845px; top: 173px; width: 279px; height: 530px; border-radius: 40px; }
.sk--circle { left: 730px; top: 333px; width: 600px; height: 600px; border-radius: 50%; opacity: .45; }
.skeleton__cards { position: absolute; left: var(--gutter); right: var(--gutter); top: 800px; height: 600px; }
.sk--tag { left: 0; top: 120px; width: 176px; height: 36px; border-radius: 10px; }
.sk--h2 { left: 0; top: 192px; width: 750px; height: 44px; }
.sk--card { top: 281px; width: 364px; height: 212px; border-radius: 10px; }
.sk--card:nth-child(3) { left: 0; } .sk--card:nth-child(4) { left: 378px; } .sk--card:nth-child(5) { left: 756px; }
.skeleton__page { position: absolute; left: var(--gutter); right: var(--gutter); top: 144px; height: 300px; }
.skeleton__page .sk--h2 { top: 0; }
.skeleton__page .sk--p:nth-child(2) { top: 80px; } .skeleton__page .sk--p:nth-child(3) { top: 104px; }
.skeleton__page .sk--p:nth-child(4) { top: 128px; } .skeleton__page .sk--p:nth-child(5) { top: 152px; }
@media (prefers-reduced-motion: reduce) { .sk { animation: none; } }
@media (max-width: 1180px) {
	:root { --container: 920px; }

	.header__divider { margin-left: 16px; }
	.header__nav { flex: 1 1 auto; min-width: 0; margin: 0 20px; }
	.nav { justify-content: space-between; gap: 12px; }
	.nav a { font-size: 14px; line-height: 18px; white-space: nowrap; }
	.header__cta { margin-left: 0; width: 144px; font-size: 14px; }

	.hero__circle, .hero__sectors { left: 530px; }
	.hero__phone { left: 666px; }

	.br-tab { display: inline; }
	.br-desk { display: none; }

	.problems__list { gap: 16px; }
	.problem-card { height: 222px; min-height: 0; padding-right: 14px; padding-bottom: 18px; }

	.roles { padding-top: 96px; padding-bottom: 160px; }
	.roles__title br { display: none; }
	.roles__top {
		grid-template-columns: 442px 1fr;
		grid-template-areas: "intro intro" "before after";
		min-height: 0;
	}
	.roles__intro { grid-area: intro; position: relative; }
	.roles__text { max-width: 563px; margin-top: 39px; }
	.roles__text br { display: none; }
	.roles__btn { position: absolute; right: 0; top: 94px; margin: 0; }
	.roles__before { grid-area: before; margin-top: 50px; }
	.roles__after { grid-area: after; margin-top: 50px; padding-left: 28px; }
	.roles__after::before { height: 375px; }
	.roles__screen--dashboard { width: 414px; height: 310px; margin-top: 28px; }
	.roles__screens { margin-top: 27px; gap: 11px; }
	.roles__screen--chat-2 { width: 237px; height: 311px; }
	.roles__screen--chat-1 { width: 201px; height: 311px; margin-top: 1px; }
	.roles__screen--chat img { width: 129.5%; left: -16%; }
	.roles__screen--chat-2 img { top: -39.5%; }
	.roles__screen--chat-1 img { top: -27.8%; }
	.roles__tabs { grid-template-columns: repeat(5, 1fr); gap: 12px; margin-top: 25px; }
	.role-tab__btn { padding-left: 12px; padding-right: 12px; }
	.role-tab__text br { display: none; }
	.role-tab__text > span { padding: 8px 10px 10px; }

	.industries__head { display: block; margin-top: 35px; }
	.industries__btn { position: absolute; right: var(--gutter); top: 0; }
	.industries .container { position: relative; }
	.industries__list { grid-template-columns: repeat(4, 218px); gap: 16px; margin-top: 37px; }
	.industry-card__text br { display: none; }

	.mechanics { padding-top: 100px; padding-bottom: 138px; }
	.steps::before { right: calc(50% - 50vw + var(--sbw, 0px) / 2); }
	.step { gap: 12px; }
	.step:nth-child(2) { left: 230px; }
	.step:nth-child(3) { left: 460px; }
	.step:nth-child(4) { left: 690px; }
	.step__body { max-width: 158px; }
	.step__title br, .step__text br { display: none; }

	.features { padding-bottom: 113px; }
	.features__list { grid-template-columns: 320px 320px 280px; }
	.features__btn { width: 280px; }
	.features__sectors { left: calc(50% + 260px); }

	.case { padding-bottom: 75px; }
	.case-card__info { width: 452px; }

	.form { padding-bottom: 7px; }
	.form__bg img { left: calc(50% + 100px); }
	.lead-form { width: 508px; padding-right: 31px; }
	.form__questions { border-top: 0; min-height: 104px; }
	.form__questions::before {
		content: "";
		position: absolute;
		left: 0;
		right: calc(50% - 50vw + var(--sbw, 0px) / 2);
		top: 0;
		height: 1px;
		background: #fff;
	}
	.form__questions-title { max-width: 320px; line-height: 52px; }
	.form__questions-text { left: 412px; top: 36px; max-width: 280px; }
	.form__questions-text br { display: none; }
	.form__arrow { left: 773px; top: 50px; }
	.form__mail { top: 40px; }

	.footer__nav { display: none; }
	.footer__row { display: block; }
	.footer__row--bottom { margin-top: 20px; }
	.footer__copy { width: auto; }
	.footer__legal { position: absolute; left: calc(var(--gutter) + 265px); top: 9px; }
	.footer__legal-menu { flex-direction: column; gap: 29px; }
	.footer__contacts { top: 9px; gap: 29px; }

	.sk--nav { width: 74px; }
	.sk--nav:nth-child(2) { left: 174px; } .sk--nav:nth-child(3) { left: 270px; } .sk--nav:nth-child(4) { left: 366px; }
	.sk--nav:nth-child(5) { left: 462px; } .sk--nav:nth-child(6) { left: 558px; }
	.sk--cta { width: 144px; }
	.sk--phone { left: 645px; }
	.sk--circle { left: 530px; }
	.sk--card { width: 296px; }
	.sk--card:nth-child(4) { left: 312px; }
	.sk--card:nth-child(5) { left: 624px; }
}

@media (max-width: 959px) {
	:root { --gutter: 20px; --header-top: 16px; --header-h: 44px; }
	.container { max-width: none; }
	.section { padding-top: 80px; }
	.section__title { margin-top: 24px; font-size: 32px; line-height: 38px; }
	.tag:not(.tag--filled) { height: 20px; padding: 0 8px; border-radius: 5px; font-size: 10px; line-height: 18px; }
	.roles__title, .mechanics__title, .features__title, .form__questions-title { margin-top: 0; }
	.hero__title br, .roles__title br, .roles__text br, .mechanics__title br, .form__title br, .form__text br,
	.form__questions-text br, .role-tab__title br, .role-tab__text br, .industry-card__title br, .industry-card__text br,
	.step__title br, .step__text br, .feature__title br, .feature__text br, .case-stat__sub br,
	.br-tab, .br-desk { display: none; }

	.header__bar { padding: 0 10px 0 15px; }
	.header__nav { display: none; margin: 0; }
	.header__divider { display: none; }
	.header__cta { margin-left: auto; width: 144px; font-size: 14px; }
	.header__burger {
		display: flex;
		align-items: center;
		justify-content: center;
		flex: none;
		width: 40px;
		height: 40px;
		margin-left: 10px;
		border-radius: 8px;
		transition: background-color .2s;
	}
	.header__burger:active { background: rgba(255, 255, 255, .15); }
	.header__burger-line,
	.header__burger-line::before,
	.header__burger-line::after {
		display: block;
		width: 22px;
		height: 2px;
		border-radius: 2px;
		background: currentColor;
		transition: transform .25s ease, opacity .25s ease;
	}
	.header__burger-line { position: relative; }
	.header__burger-line::before, .header__burger-line::after { content: ""; position: absolute; left: 0; }
	.header__burger-line::before { top: -7px; }
	.header__burger-line::after { top: 7px; }
	.header--open .header__burger-line { background: transparent; }
	.header--open .header__burger-line::before { transform: translateY(7px) rotate(45deg); }
	.header--open .header__burger-line::after { transform: translateY(-7px) rotate(-45deg); }
	.header--open .header__nav {
		display: block;
		position: absolute;
		left: 0;
		right: 0;
		top: calc(100% + 8px);
		padding: 18px 24px;
		border-radius: 10px;
		background: rgba(255, 255, 255, .92);
		-webkit-backdrop-filter: blur(10px);
		backdrop-filter: blur(10px);
		box-shadow: 0 12px 40px rgba(0, 0, 0, .12);
		color: var(--c-text);
	}
	.header--open .nav { flex-direction: column; gap: 14px; }
	.header--open .nav a { font-size: 18px; line-height: 24px; white-space: normal; }

	.hero { height: auto; }
	.hero__bg img { left: 0; top: 0; width: 100%; height: 100%; object-fit: cover; object-position: 62% 50%; }
	.hero__inner { height: auto; padding: 120px 0 460px; }
	.hero__content { position: static; width: auto; max-width: 600px; }
	.hero__title { font-size: 40px; line-height: 46px; }
	.hero__text { max-width: 480px; margin-top: 24px; line-height: 20px; }
	.hero__btn { position: static; display: flex; width: 100%; max-width: 320px; margin-top: 32px; }
	.hero__circle, .hero__sectors { left: calc(50% - 200px); top: auto; bottom: -113px; width: 400px; height: 400px; }
	.hero__phone { left: calc(50% - 93px); top: auto; bottom: 69px; width: 186px; }

	.problems__list { grid-template-columns: 1fr; gap: 12px; margin-top: 28px; }
	.problem-card { height: auto; min-height: 0; padding: 20px; }
	.problem-card__title { margin-top: 20px; }

	.roles { padding-top: 80px; padding-bottom: 80px; }
	.roles__top { display: block; min-height: 0; }
	.roles__intro { position: static; }
	.roles__text { max-width: none; margin-top: 16px; line-height: 20px; }
	.roles__btn { position: static; display: flex; width: 100%; max-width: 320px; margin-top: 24px; }
	.roles__before { margin-top: 40px; }
	.roles__after { margin-top: 32px; padding-left: 0; }
	.roles__after::before { display: none; }
	.roles__screen--dashboard { width: 100%; height: auto; aspect-ratio: 334 / 250; margin-top: 20px; }
	.roles__screens { gap: 10px; margin-top: 20px; }
	.roles__screen--chat-2 { flex: 1.18 1 0; width: auto; height: auto; aspect-ratio: 191 / 250; }
	.roles__screen--chat-1 { flex: 1 1 0; width: auto; height: auto; aspect-ratio: 162 / 250; margin-top: 0; }
	.roles__tabs { grid-template-columns: 1fr; grid-auto-rows: auto; gap: 10px; margin-top: 36px; }
	.role-tab.is-open { z-index: auto; }
	.role-tab__btn { height: auto; min-height: 49px; padding: 14px 16px 12px; }
	.role-tab__title { padding-bottom: 6px; }
	.role-tab__panel { position: static; }
	.role-tab__text > span { padding: 4px 16px 14px; }

	.industries { height: auto; padding-bottom: 60px; }
	.industries__arcs { width: 300px; height: 300px; }
	.industries__head { margin-top: 24px; }
	.industries__title { margin-top: 0; }
	.industries__btn { position: static; display: flex; width: 100%; max-width: 320px; margin-top: 24px; }
	.industries__list { grid-template-columns: 1fr; gap: 16px; margin-top: 32px; }
	.industry-card { height: 260px; }
	.industry-card__img img { left: 0; top: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50% 50%; }
	.industry-card--industry-agro img { object-position: 42% 60%; }
	.industry-card__body { padding: 0 24px 22px; }

	.mechanics { padding-top: 80px; padding-bottom: 80px; }
	.mechanics__head { display: block; margin-top: 24px; }
	.mechanics__btn { position: static; display: flex; width: 100%; max-width: 320px; margin-top: 24px; }
	.steps { height: auto; margin-top: 40px; }
	.steps::before { left: 30px; right: auto; top: 30px; bottom: 30px; width: 1px; height: auto; z-index: 0; }
	.steps[data-animate]::before { transform: scaleY(0); transform-origin: top; }
	.steps.is-visible::before { transform: scaleY(1); }
	.step, .step:nth-child(n) { position: relative; left: auto; top: auto; gap: 16px; z-index: 1; }
	.step + .step { margin-top: 28px; }
	.step::before { display: none; }
	.step__num { margin-top: 0; }
	.step__body { max-width: none; padding-top: 8px; }
	.step__text { line-height: 17px; }

	.features { padding-bottom: 80px; }
	.features__sectors { left: auto; right: -170px; top: 40px; width: 340px; height: 340px; }
	.features__head { display: block; margin-top: 24px; }
	.features__btn { display: flex; width: 100%; max-width: 320px; margin-top: 24px; }
	.features__list { grid-template-columns: 1fr 1fr; grid-template-rows: none; column-gap: 16px; row-gap: 28px; margin-top: 40px; }
	.feature__text { line-height: 17px; }

	.case { padding-top: 0; padding-bottom: 80px; background: linear-gradient(to bottom, var(--c-bg-soft) 0, #fff 120px); }
	.case-card { display: block; height: auto; }
	.case-card__info { width: auto; padding: 28px 20px 32px; }
	.case-card__title { margin-top: 24px; }
	.case-card__stats { margin-top: 28px; }
	.case-stat__num { font-size: 40px; line-height: 44px; }
	.case-card__photo { height: 400px; }
	.case-card__btn { right: 20px; top: 20px; width: auto; padding: 0 20px; }
	.case-card__place { left: 20px; right: 20px; bottom: 24px; }

	.form { padding-bottom: 32px; }
	.form__bg { height: calc(100% + 120px); }
	.form__bg img { left: 0; top: 0; width: 100%; height: 100%; transform: none; object-fit: cover; object-position: 50% 50%; }
	.form__top { display: block; height: auto; }
	.form__intro { display: block; }
	.form__title { margin-top: 24px; }
	.form__text { margin-top: 16px; line-height: 20px; }
	.lead-form { width: 100%; margin-top: 32px; padding: 8px 20px 24px; }
	.form__questions { margin-top: 40px; padding-top: 32px; border-top: 1px solid #fff; min-height: 0; }
	.form__questions::before { display: none; }
	.form__questions-title { max-width: none; line-height: 38px; }
	.form__questions-text { position: static; max-width: none; margin-top: 16px; line-height: 20px; }
	.form__arrow { display: none; }
	.form__contacts { display: flex; gap: 12px; margin-top: 20px; }
	.form__mail, .form__mail--mobile { position: static; display: flex; }
	.form-tip--top { max-width: calc(100% - 40px); transform: translateY(6px); }
	.form-tip--top::after { right: auto; left: 16px; top: 100%; margin: 0; border: 6px solid transparent; border-bottom: 0; border-top-color: rgba(30, 20, 10, .78); }
	.form-tip--top.form-tip--ok::after { border-top-color: rgba(118, 170, 77, .9); }
	.form-tip--top.is-visible { transform: none; }

	.footer { height: auto; padding: 40px 0 32px; }
	.footer__nav, .footer__contacts { display: none; }
	.footer__copy-full { display: none; }
	.footer__copy-short { display: inline; }

	.page-content__title { font-size: 28px; line-height: 34px; -webkit-hyphens: auto; hyphens: auto; overflow-wrap: anywhere; }
	@media (max-width: 359px) { .page-content__title { font-size: 24px; line-height: 30px; } }
	.footer__row { display: block; }
	.footer__contacts { position: static; align-items: flex-start; gap: 14px; margin-top: 24px; }
	.footer__row--bottom { display: flex; flex-direction: column-reverse; margin-top: 24px; }
	.footer__copy { width: auto; margin-top: 24px; opacity: .6; }
	.footer__legal { position: static; }
	.footer__legal-menu { flex-direction: column; gap: 12px; }

	.sk { max-width: 100%; }
	.sk--logo { left: 12px; top: 13px; width: 69px; height: 18px; }
	.sk--nav { display: none; }
	.sk--cta { top: 10px; width: 144px; }
	.sk--h1 { height: 34px; }
	.sk--h1:nth-child(1) { top: 120px; } .sk--h1:nth-child(2) { top: 166px; } .sk--h1:nth-child(3) { top: 212px; }
	.skeleton__hero .sk--p:nth-child(4) { top: 290px; } .skeleton__hero .sk--p:nth-child(5) { top: 310px; }
	.skeleton__hero .sk--p:nth-child(6) { top: 330px; } .skeleton__hero .sk--p:nth-child(7) { top: 350px; }
	.sk--btn { top: 400px; width: 100%; max-width: 320px; }
	.sk--phone, .sk--circle, .skeleton__cards { display: none; }
	.skeleton__page .sk--h2, .skeleton__page .sk--p { max-width: 100%; }
}

@media (min-width: 600px) and (max-width: 959px) {
	.problems__list { grid-template-columns: repeat(3, 1fr); }
	.roles__top { display: grid; grid-template-columns: 1fr 1fr; grid-template-areas: "intro intro" "before after"; column-gap: 24px; }
	.roles__before, .roles__after { margin-top: 40px; }
	.roles__tabs { grid-template-columns: 1fr 1fr; }
	.industries__list { grid-template-columns: 1fr 1fr; }
	.industry-card { height: 300px; }
	.features__list { grid-template-columns: 1fr 1fr; column-gap: 24px; }
	.features__sectors { right: -120px; width: 420px; height: 420px; }
	.case-card__photo { height: 460px; }
	.form__questions-text { max-width: 480px; }
}

@media (max-width: 599px) {
	.header__cta, .sk--cta { display: none; }
	.header__menu-cta { display: flex; margin-top: 18px; width: 100%; color: #000; }
	.hero__title { font-size: 36px; line-height: 42px; }

	.problems__list[data-animate] .problem-card:nth-child(n),
	.problems__list[data-animate] .problem-card:nth-child(n) .problem-card__icon svg,
	.problems__list[data-animate] .problem-card .ico-clock__min, .problems__list[data-animate] .problem-card .ico-clock__hour,
	.problems__list[data-animate] .problem-card .ico-fuel__fill, .problems__list[data-animate] .problem-card .ico-chart__bar:nth-child(n) { animation: none; }
	.problems__list[data-animate] .problem-card.is-shown:nth-child(n) { animation: card-solo 1.6s ease-in-out both; }
	.problems__list[data-animate] .problem-card.is-shown:nth-child(n) .problem-card__icon svg { animation: ico-zoom 1.6s ease-in-out both; }
	.problems__list[data-animate] .problem-card.is-shown .ico-clock__min  { animation: ico-clock-min 1.1s cubic-bezier(.4, 0, .2, 1) .2s both; }
	.problems__list[data-animate] .problem-card.is-shown .ico-clock__hour { animation: ico-clock-hour 1.1s cubic-bezier(.4, 0, .2, 1) .2s both; }
	.problems__list[data-animate] .problem-card.is-shown .ico-fuel__fill  { animation: ico-fuel-fill 1.2s ease-in-out .2s both; }
	.problems__list[data-animate] .problem-card.is-shown .ico-chart__bar:nth-child(1) { animation: ico-bar-1 1.2s ease-out .1s both; }
	.problems__list[data-animate] .problem-card.is-shown .ico-chart__bar:nth-child(2) { animation: ico-bar-2 1.2s ease-out .1s both; }
	.problems__list[data-animate] .problem-card.is-shown .ico-chart__bar:nth-child(3) { animation: ico-bar-3 1.2s ease-out .1s both; }
	@keyframes card-solo {
		0%, 100% { transform: scale(1); }
		10%, 80% { transform: scale(1.04); }
	}
}
@media (max-width: 599px) and (prefers-reduced-motion: reduce) {
	.problems__list[data-animate] .problem-card.is-shown:nth-child(n) { animation: soft-in .8s ease both; }
	.problems__list[data-animate] .problem-card.is-shown:nth-child(n) .problem-card__icon svg,
	.problems__list[data-animate] .problem-card.is-shown .ico-clock__min, .problems__list[data-animate] .problem-card.is-shown .ico-clock__hour,
	.problems__list[data-animate] .problem-card.is-shown .ico-fuel__fill, .problems__list[data-animate] .problem-card.is-shown .ico-chart__bar:nth-child(n) { animation: none; }
}

.bottom-nav { display: none; }
@media (max-width: 959px) {
	.header__burger, .header__cta { display: none; }
	.header__bar { width: fit-content; padding: 0 12px; }
	.header__logo { width: 69px; height: 19px; }
	.header__logo-img { width: 70.8px; height: 18.5px; }
	.skeleton__bar { right: auto; width: 93px; }
	.hero__btn, .roles__btn, .industries__btn, .mechanics__btn, .features__btn, .case-card__btn { display: none; }
	.hero__content { padding-bottom: 16px; }
	.footer { padding-bottom: 128px; }
	.bottom-nav {
		display: block;
		position: fixed;
		left: 16px;
		right: 16px;
		bottom: calc(16px + env(safe-area-inset-bottom, 0px));
		z-index: 100;
	}
	.bottom-nav__bar {
		position: relative;
		height: 64px;
		border-radius: 32px;
		background: rgba(255, 255, 255, .6);
		-webkit-backdrop-filter: blur(10px);
		backdrop-filter: blur(10px);
		color: #434343;
		overflow: hidden;
		transition: background-color .25s, color .25s;
	}
	.bottom-nav__bar::before {
		content: "";
		position: absolute;
		inset: 0;
		border-radius: inherit;
		padding: 1px;
		background: linear-gradient(98deg, #fff 0%, rgba(255, 255, 255, .3) 100%);
		opacity: .4;
		-webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
		mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
		-webkit-mask-composite: xor;
		mask-composite: exclude;
		pointer-events: none;
		z-index: 1;
	}
	.bottom-nav--light .bottom-nav__bar,
	body:not(.home) .bottom-nav__bar { background: rgba(255, 255, 255, .8); box-shadow: 0 8px 30px rgba(0, 0, 0, .12); }
	.bottom-nav__list {
		display: flex;
		gap: 0;
		height: 100%;
		padding: 6px 8px;
		overflow-x: auto;
		overflow-y: hidden;
		scrollbar-width: none;
		-webkit-overflow-scrolling: touch;
		justify-content: safe center;
	}
	.bottom-nav__list--more-right { -webkit-mask-image: linear-gradient(to right, #000 calc(100% - 40px), rgba(0, 0, 0, .35) 100%); mask-image: linear-gradient(to right, #000 calc(100% - 40px), rgba(0, 0, 0, .35) 100%); }
	.bottom-nav__list--more-left { -webkit-mask-image: linear-gradient(to right, rgba(0, 0, 0, .35) 0, #000 40px); mask-image: linear-gradient(to right, rgba(0, 0, 0, .35) 0, #000 40px); }
	.bottom-nav__list--more-left.bottom-nav__list--more-right { -webkit-mask-image: linear-gradient(to right, rgba(0, 0, 0, .35) 0, #000 40px, #000 calc(100% - 40px), rgba(0, 0, 0, .35) 100%); mask-image: linear-gradient(to right, rgba(0, 0, 0, .35) 0, #000 40px, #000 calc(100% - 40px), rgba(0, 0, 0, .35) 100%); }
	.bottom-nav__list::-webkit-scrollbar { display: none; }
	.bottom-nav__item {
		display: flex;
		flex: none;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		gap: 3px;
		min-width: 0;
		height: 52px;
		padding: 0 5px;
		box-sizing: border-box;
		white-space: nowrap;
		border-radius: 26px;
		font-size: 11px;
		line-height: 13px;
		color: inherit;
		transition: background-color .25s ease, color .25s ease;
	}
	.bottom-nav__icon { display: block; height: 24px; }
	.bottom-nav__icon svg { display: block; width: 24px; height: 24px; }
	.bottom-nav__item.is-active { background: rgba(118, 170, 77, .16); color: #4E7A2E; }
	.bottom-nav__cta {
		position: fixed;
		top: var(--header-top);
		right: var(--gutter);
		height: var(--header-h);
		min-height: 0;
		max-width: calc(100% - 2 * var(--gutter) - 93px - 10px);
		padding: 0 16px;
		border-radius: 10px;
		font-size: 15px;
		line-height: 18px;
		text-align: center;
		box-shadow: 0 6px 20px rgba(0, 0, 0, .22);
		color: #000;
		transition: opacity .3s ease, transform .3s ease, background-color .2s;
	}
	.bottom-nav--fit .bottom-nav__bar { width: fit-content; max-width: 100%; margin: 0 auto; }
	.bottom-nav--fit .bottom-nav__item { padding: 0 14px; }
	@media (max-width: 359px) { .bottom-nav__cta { padding: 0 8px; font-size: 13px; line-height: 16px; } }
	.bottom-nav--cta-hidden .bottom-nav__cta { opacity: 0; transform: translateY(-8px); pointer-events: none; }
}
