/* Table of Content
==================================================
	#Font-Face
	#Site Styles
	#Media Queries */

/* #Font-Face
================================================== */


/* #Site Styles
================================================== */

/* ### general ### */
:root {
	--width-base: 880px;
	--width-large: 1280px;
	--font-size-base: 1rem;
	--color-white: #fff;
	--color-black: #000;
	--color-grey: #f3f1ee;
	--color-grey-200: #dddbd9;
	--color-grey-300: #666360;
	--color-light-grey: #c0bfbe;
	--color-medium-grey: #dfddda;
	--color-dark-grey: #797572;
	--color-info: #1a1b1d;
	--color-black-alt: #1D1D1B;
	--color-pastel-black: #1d1d1b;
	--color-gunmetal-black: #15181d;
	--line-height-base: 1.7;
	--font-family-base: 'Helvetica Neue', sans-serif;
	--font-family-guton: 'Guton', sans-serif;
	--font-size-h1: 2.25rem;
	--font-size-h2: 5.625rem;
	--font-size-h3: 3.25rem;
	--font-size-h4: 2.813rem;
	--font-size-h5: 2.188rem;
	--font-size-h6: 1rem;
	--width: 100%;
	--height: 100%;
	--gutter-space-right: 24px;
	--gutter-space-left: 24px;
	--line-decoration: none;
	--line-height-heading: 1.1;
	--duration: all 0.25s ease-in-out;
}

/* ### general ### */
* {
	margin: 0;
	padding: 0;
	box-sizing: border-box;
}

html,
body {
	font-family: var(--font-family-base), sans-serif;
	font-size: var(--font-size-base);
	font-weight: 300;
	line-height: var(--line-height-base);
	color: var(--color-info);
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

body {
	background: var(--color-grey);
}

input,
select,
textarea {
	padding: 11px 8px 5px;
	width: var(--width);
	height: 41px;
	font-family: var(--font-family-base), sans-serif;
	font-size: var(--font-size-base);
	font-weight: 400;
	color: var(--color-info);
	border: 0;
	border-bottom: 1px solid var(--color-grey);
	background-color: transparent;
	appearance: none;
}

input::placeholder,
textarea::placeholder {
	color: var(--color-light-grey);
}

textarea {
	padding-top: 15px;
	height: 68px;
	color: #000;
	resize: none;
}

img {
	display: block;
	max-width: var(--width);
	border: 0;
}

ul,
li {
	list-style: none;
}

:focus {
	outline: none;
}

a {
	display: inline-block;
	transition: var(--duration);
}

p {
	margin-bottom: 20px;

	a {
		color: inherit;
	}
}

.h1,
h1,
.h2,
h2,
.h3,
h3,
.h4,
h4,
.h5,
h5,
h6 {
	margin-bottom: 20px;
	font-family: var(--font-family-guton), sans-serif;
	font-weight: 500;
	line-height: var(--line-height-heading);
	color: var(--color-pastel-black);
}

.h1,
h1 {
	font-size: var(--font-size-h1);
}

.h2,
h2 {
	font-size: var(--font-size-h2);
}

.h3,
h3 {
	font-size: var(--font-size-h3);
}

.h4,
h4 {
	font-size: var(--font-size-h4);
}

.h5,
h5 {
	font-size: var(--font-size-h5);
}

.h6,
h6 {
	font-size: var(--font-size-h6);
}

/* ### global classes ### */
.clear {
	visibility: hidden;
	clear: both;
	height: 0;
	line-height: 0;
}

.centered {
	padding-right: var(--gutter-space-right);
	padding-left: var(--gutter-space-left);
}

.centered-lg {
	padding-right: 12px;
	padding-left: 12px;
}

/* ### button ### */
.button {
	padding: 7px 17px 6px;
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 46px;
	font-family: var(--font-family-base), sans-serif;
	font-size: var(--font-size-base);
	font-weight: 400;
	text-decoration: none;
	color: var(--color-grey);
	border: solid 1px rgba(255, 255, 255, 0.1);
	border-radius: 25px;
	transition: var(--duration);
	cursor: pointer;
}

.button span {
	display: none;
}

.button.button-dot:before {
	margin-right: 12px;
	position: relative;
	top: -1px;
	display: inline-block;
	width: 6px;
	height: 6px;
	vertical-align: middle;
	border-radius: 75px;
	background-color: rgba(255, 255, 255, 0.2);
	transition: var(--duration);
	content: '';
}

.button:focus,
.button:hover {
	background-color: rgba(255, 255, 255, 0.1);
	backdrop-filter: blur(8px);
}

.button.button-dot:focus:before,
.button.button-dot:hover:before {
	transform: scale(1.2);
}

.button.no-button {
	padding: 0;
	min-height: auto;
	line-height: normal;
}

.button.button-link {
	position: relative;
	color: var(--color-pastel-black);

	&:after {
		position: absolute;
		/* inset: 0; */
		bottom: -4px;
		left: 0;
		right: 0;
		height: 1px;
		transform: scaleX(0);
		transform-origin: right;
		transition: transform 0.3s ease-in-out;
		background-color: var(--color-dark-grey);
		content: '';
		pointer-events: none;
		/* transition: var(--duration); */
	}

	@media(width >=768px) {

		&:hover,
		&:focus {
			&:after {
				transform: scaleX(1);
				transform-origin: left;
			}
		}
	}

	@media(width < 768px) {
		&:after {
			transform: scaleX(1);
			transform-origin: left;
		}
	}
}

.button.button-black {
	color: var(--color-black-alt);
	border-color: rgba(255, 255, 255, 0.2);
}

.button.button-submit {
	color: var(--color-info);
	border: solid 1px rgba(102, 99, 96, 0.2);
	background-color: transparent;
}

.button.button-submit.button-dot:before {
	margin-right: 19px;
	width: 8px;
	height: 8px;
	background-color: rgba(102, 99, 96, 0.4);
}

.button.button-submit:focus,
.button.button-submit:hover {
	color: var(--color-white);
	background-color: var(--color-grey-300);
}

.button.button-submit:focus.button-dot:before,
.button.button-submit:hover.button-dot:before {
	background-color: var(--color-white);
}

/* ### wrapper ### */
.wrapper {
	position: relative;
	display: block;
	width: var(--width);
	min-height: var(--height);
	overflow-x: clip;
}

.wrapper:after {
	position: absolute;
	top: 0;
	left: 12px;
	z-index: 17;
	width: 1px;
	height: var(--height);
	background-color: rgba(26, 27, 29, 0.1);
	content: '';
	pointer-events: none;
}

/* ### header ### */
.header {
	padding-top: 16px;
	padding-bottom: 16px;
	position: relative;
	z-index: 10;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: flex-end;
	width: var(--width);
	background: var(--color-grey);
}

.header-logo {
	width: 168px;
	mix-blend-mode: difference;
	position: fixed;
	left: 12px;

	@media(width > 1330px) {
		left: calc((100% - var(--width-large)) / 2)
	}

	@media(width < 480px) {
		width: 145px;
	}
}

.header .button {
	min-height: 44px;

	@media(768px < width <=1024px) {
		background-color: rgba(0, 0, 0, 0.3);
	}
}

/* ### header-menu ### */
.header-menu {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	mix-blend-mode: difference;
}

.header-menu ul {
	display: none;
	list-style: none;
}

.header-menu li {
	font-weight: 400;
}

.header-menu li a {
	text-decoration: var(--line-decoration);
	color: var(--color-grey);
}

.header-menu li:not(:last-child) {
	margin-right: 33px;
}

.header-menu li a:hover {
	color: var(--color-dark-grey);
}

/* ### hero ### */
.hero {
	margin-top: -76px;
	padding-top: 120px;
	padding-bottom: 60px;
	position: relative;
	display: flex;
	align-items: flex-end;
	min-height: 606px;
	z-index: 1;
}

.hero h1 {
	margin-bottom: 29px;
	color: var(--color-grey);
}

.hero-block {
	position: relative;
	z-index: 2;
	width: var(--width);
}

.hero-intro {
	width: var(--width);
	max-width: 650px;
}

.hero-intro img {
	width: 80px;
}

.hero-bg-picture {
	position: absolute;
	top: 0;
	left: 0;
	width: var(--width);
	height: var(--height);
}

.hero-bg-picture img {
	width: var(--width);
	height: var(--height);
	object-fit: cover;
	object-position: top center;
	transition: scale 2s ease-in-out;
	scale: 1.1;

	@starting-style {
		scale: 1;
	}

}

.hero-line {
	position: absolute;
	bottom: 120px;
	left: 50%;
	width: 2px;
	height: 120px;
	background-color: rgba(255, 255, 255, .20);
	z-index: 2;
	transform: translateX(-50%);
	margin-left: 440px;
	display: none;
	transition: var(--duration);
	overflow: hidden;
}

.hero-line:after {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 3px;
	height: 33px;
	background-color: var(--color-white);
	z-index: 9;
	animation: slideBounce 2s ease forwards, bounce 1.5s 2s cubic-bezier(.28, .84, .42, 1) infinite;
}

/* ### intro-block ### */
.intro-block {
	padding-top: 55px;
	padding-bottom: 67px;
	line-height: 2;
	position: relative;
	z-index: 1;
	background-color: var(--color-grey);
}

.intro-block-large {
	margin-bottom: 30px;
	font-size: 1.313rem;
	font-weight: 400;
	line-height: 1.23;
	color: var(--color-info);
}

.intro-block-large p:last-of-type,
.intro-block-bottom p:last-of-type {
	margin-bottom: 0;
}

.intro-block-large p br {
	display: none;
}

.intro-block.inner {
	padding-top: 0;
	padding-bottom: 46px;
}

.intro-block.inner .intro-block-large {
	margin-bottom: 29px;
}

.intro-block.alt {
	padding-top: 0;
	padding-bottom: 49px;
}

.intro-block.alt .intro-block-bottom p {
	margin-bottom: 25px;
}

/* ### faqs ### */
.faqs {
	padding-bottom: 53px;
	position: relative;
	z-index: 1;
	background-color: var(--color-grey);
}

.faqs-block {
	margin-bottom: 18px;
	display: flex;
	flex-wrap: wrap;
	background-color: var(--color-white);
}

.faqs-picture {
	position: relative;
	order: 2;
	width: var(--width);
	height: 425px;
}

.faqs-picture:after {
	position: absolute;
	bottom: 0;
	left: 0;
	width: var(--width);
	height: var(--height);
	background: linear-gradient(186.15deg, rgba(30, 30, 30, 0) 54.32%, rgba(30, 30, 30, 0.6) 97.32%);
	content: '';
	pointer-events: none;
}

.faqs-picture img {
	width: var(--width);
	height: var(--height);
	object-fit: cover;
}

.faqs-right {
	margin-bottom: 5px;
	padding: 0 24px;
	order: 1;
	width: var(--width);
}

.faqs-according {
	border-bottom: solid 1px var(--color-grey);
	position: relative;
}

.faqs-text {
	padding: 24px 0 25px;
	width: var(--width);
	font-family: var(--font-family-base), sans-serif;
	font-size: 1.125rem;
	text-align: start;
	border: 0;
	background-color: transparent;
	transition: var(--duration);
	cursor: pointer;
	color: inherit;
}

.faqs-text strong {
	font-weight: 500;
}

.faqs-icon {
	display: none;
}

.faqs-content {
	max-height: 0;
	font-size: 1.063rem;
	color: var(--color-info);
	transform: translateY(-13px);
	transition: max-height 0.3s ease;
	overflow: hidden;
}

.faqs-info {
	padding-bottom: 3px;
	font-size: 1rem;
	font-weight: 300;
	line-height: 1.85;
}

.faqs-info p:last-of-type {
	margin-bottom: 0;
}

.faqs-list {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	list-style: none;
}

.faqs-list li {
	margin-right: 9px;
	position: relative;
	font-size: 0.875rem;
}

.faqs-list li strong {
	font-size: 1rem;
	font-weight: 400;
}

.faqs-list li b {
	font-size: 1rem;
	font-weight: 400;
}

.faqs-list li:nth-child(2) {
	padding-top: 3px;
	padding-left: 28px;
}

/* .faqs-list li:not(:last-child):after {
	margin: 0 13px;
	display: none;
	width: 4px;
	height: 4px;
	vertical-align: super;
	border-radius: 75px;
	background-color: var(--color-dark-grey);
	content: '';
	pointer-events: none;
	position: relative;
	top: 3px;
} */

/*.faqs-according:nth-child(2n) .faqs-text,
.faqs-according:nth-child(3n) .faqs-text { padding: 20px 0 19px; } */

/* ### parallax-block ### */
.parallax-block {
	height: 300px;
	position: relative;
}

.parallax-block img {
	position: fixed;
	top: 0;
	left: 0;
	width: var(--width);
	height: var(--height);
	object-fit: cover;
}

/* ### explain ### */
.explain {
	padding-top: 88px;
	padding-bottom: 49px;
	position: relative;
	z-index: 1;
	background-color: var(--color-grey);
}

.explain h2 {
	margin-bottom: 0;
	padding-left: 12px;
	position: relative;
	z-index: 2;
	font-size: 2.25rem;
	line-height: 0.98;
	color: var(--color-medium-grey);
}

.explain-block {
	margin-top: -11px;
}

.explain-picture {
	margin-bottom: 40px;
	width: var(--width);
}

.explain-picture img {
	width: var(--width);

	@media(width < 768px) {
		object-fit: cover;
	}
}

.explain-intro {
	line-height: 2;
}

.explain-intro p {
	margin-bottom: 25px;
	opacity: 0;
}

.explain-intro .button {
	opacity: 0;
}

/* ### partner ### */
.partner {
	padding-top: 59px;
	padding-bottom: 50px;
	background-color: var(--color-white);
	position: relative;
	z-index: 1;
}

.partner-lead {
	margin-bottom: 50px;
	font-size: 1.125rem;
	font-weight: 400;
	font-family: var(--font-family-base);
}

.partner .swiper {
	overflow: visible;
	margin-bottom: 37px;
}

.partner .swiper-wrapper {
	align-items: center;
	transition-timing-function: linear;
}

.partner .swiper-slide {
	width: auto;
}

.partner .swiper:last-of-type {
	margin-bottom: 0;
}

/* ### place ### */
.place {
	padding-top: 50px;
	padding-bottom: 14px;
	position: relative;
	z-index: 1;
	display: flex;
	flex-wrap: wrap;
	align-items: flex-end;
	min-height: 327px;
}

.place h2 {
	margin-bottom: 25px;
	font-size: 2.5rem;
	line-height: 0.88;
	color: var(--color-white);
}

.place h2 br {
	display: none;
}

.place-block {
	position: relative;
	z-index: 2;
	width: var(--width);
}

.place-block img {
	width: 80px;
}

.place-bg-picture {
	position: absolute;
	top: 0;
	left: 0;
	width: var(--width);
	height: var(--height);
}

.place-bg-picture:after {
	position: absolute;
	top: 0;
	left: 0;
	width: var(--width);
	height: var(--height);
	background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.39) 93.91%);
	content: '';
	pointer-events: none;
}

.place-bg-picture img {
	width: var(--width);
	height: var(--height);
	object-fit: cover;
	object-position: top center;
}

/* ### page-title ### */
.page-title {
	padding-bottom: 29px;
	padding-top: 75px;
	background: var(--color-grey);
	position: relative;
	z-index: 1;
}

.page-title h1 {
	margin-bottom: 0;
	margin-left: -2px;
	font-size: 3rem;
	line-height: 0.9;
	color: var(--color-medium-grey);
}

.page-title.inner {
	padding-bottom: 14px;
	padding-top: 14px;
}

.page-title.inner h1 {
	line-height: 1.3;
}

/* ### project ### */
.project {
	padding-bottom: 54px;
	position: relative;
	z-index: 7;
	background: var(--color-grey);
}

.project .swiper {
	overflow: visible;
	margin-bottom: 46px;
}

.project .swiper-slide {
	width: 320px;
	height: auto;
}

.project .card-project {
	height: var(--height);
}

.project .swiper-pagination {
	position: relative;
	height: 1px;
	background-color: var(--color-medium-grey);
}

.project .swiper-pagination-progressbar-fill {
	background-color: var(--color-dark-grey);
}

/* ### support ### */
.support {
	position: relative;
}

.support .slides {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100vh;
	overflow: hidden;
}

.support .slide {
	position: absolute;
	inset: 0;
	height: 100vh;
}

@supports(-webkit-touch-callout: none) {
	.support .slide {
		background-attachment: unset !important;
	}
}

.support .slide img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: top center;
}

.support .slide:after {
	content: '';
	position: absolute;
	bottom: 0;
	left: 0;
	width: var(--width);
	height: var(--height);
	background: linear-gradient(180deg, rgba(0, 0, 0, 0) 39.45%, rgba(0, 0, 0, 0.8) 100%);
	content: '';
	pointer-events: none;
}

.support-block {
	position: sticky;
	bottom: 0;
	left: 0;
	z-index: 1;
	width: var(--width);
}

.support-intro {
	width: var(--width);
	max-width: 650px;
	line-height: 1.5;
	color: var(--color-grey);
}

.support h2 {
	margin-bottom: 9px;
	font-size: 2.25rem;
	color: var(--color-grey);
}

.support p:last-of-type {
	margin-bottom: 0;
}

.support .heading {
	padding-top: 50px;
	padding-bottom: 120px;
	width: 100%;
	z-index: 2;
	position: absolute;
	bottom: 0;
	left: 0;
}

.support .support-overlay {
	height: 100vh;
	width: 100%;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 3;
	background: var(--color-black);
	opacity: 0;
}

.support-spacer {
	height: 100vh;
}

/* ### team ### */
.team {
	padding-bottom: 69px;
	padding-top: 70px;
	background: var(--color-grey);
	position: relative;
	z-index: 1;
}

.team h2 {
	margin-bottom: 29px;
	font-size: 3rem;
	color: var(--color-medium-grey);
}

.team-intro {
	margin-bottom: 46px;
	width: var(--width);
	max-width: 650px;
	line-height: 2;
}

.team-intro p:last-of-type {
	margin-bottom: 0;
}

.team-holder {
	display: grid;
	grid-row-gap: 19px;
	grid-column-gap: 21px;
	grid-template-columns: repeat(2, 1fr);
}

/* ### action ### */
.action {
	padding-bottom: 40px;
	position: relative;
	background: var(--color-grey);
	position: relative;
	z-index: 1;
}

.action h2 {
	margin-bottom: 22px;
	font-family: var(--font-family-base), sans-serif;
	font-size: 1.313rem;
	line-height: 1.25;
}

.action-block {
	padding: 30px 24px 24px;
	min-height: 120px;
	background-color: var(--color-dark-grey);
}

.action-title {
	width: var(--width);
	max-width: 250px;
}

.action-right .button {
	width: var(--width);
}

.action-right .button.button-dot:before {
	margin-right: 14px
}

/* ### text-block ### */
.text-block {
	margin-bottom: 37px;
	line-height: 2;

	.text-block-holder {

		p,
		strong,
		li,
		h3,
		h4,
		h5,
		h6 {
			opacity: 0;
			transform: translateY(50px);
		}
	}
}

.text-block p:first-child {
	font-size: 1.313rem;
	font-weight: 400;
	line-height: 1.25;
}

.text-block p {
	margin-bottom: 29px;
}

.text-block h6,
.text-block strong {
	margin-bottom: 22px;
	padding-top: 18px;
}

.text-block ul {
	margin-top: -7px;
	margin-bottom: 30px;
}

.text-block li {
	margin-bottom: 19px;
	padding-left: 18px;
	position: relative;
}

.text-block li:before {
	position: absolute;
	top: 9px;
	left: -1px;
	width: 6px;
	height: 10px;
	background-image: url('../images/plus.svg');
	background-repeat: no-repeat;
	background-position: top center;
	background-size: 6px 10px;
	content: '';
	pointer-events: none;
}

/* ### connect ### */
.connect {
	margin-bottom: 43px;
	padding-top: 38px;
}

.connect h1 {
	margin-bottom: 0;
	margin-left: -12px;
	width: var(--width);
	max-width: 250px;
	font-size: 3rem;
	line-height: 0.9;
}

.connect-left {
	margin-bottom: 32px;
}

.connect-items:not(:last-child) {
	margin-bottom: 58px;
}

.connect-info {
	display: none;
	width: var(--width);
	font-weight: 400;
}

.connect-info img {
	margin-bottom: 42px;
	width: var(--width);
}

.connect-info address {
	margin-bottom: 18px;
	font-style: normal;
}

.connect-info ul {
	display: flex;
	flex-wrap: wrap;
	list-style: none;
}

.connect-info li:not(:last-child) {
	margin-right: 33px;
}

.connect-info li a {
	position: relative;
	text-decoration: var(--line-decoration);
	color: var(--color-pastel-black);
}

.connect-info li a:after {
	position: absolute;
	right: 0;
	bottom: -3px;
	width: var(--width);
	height: 1px;
	background-color: var(--color-dark-grey);
	transition: width 0.25s ease-in-out;
	content: '';
}

.connect-info li a:hover:after {
	width: 0;
}

.connect .card-form {
	margin-left: -24px;
	width: calc(100% + 48px);

	@media(width < 480px) {
		margin-left: -40px;
		width: calc(100% + 80px);
	}
}

/* ### news ### */
.news {
	margin-bottom: 40px;
	padding-top: 16px;
}

.news h1 {
	margin-bottom: 53px;
	line-height: 0.9;
}

.news h1 strong {
	display: block;
	font-weight: 500;
}

.news-items {
	margin-bottom: 24px;
	margin-left: -12px;
	width: calc(100% + 24px);
	opacity: 0;
	transform: translateY(50px);
}

/* ### banner ### */
.banner {
	margin-top: -76px;
	margin-bottom: 55px;
	padding-top: 120px;
	padding-bottom: 26px;
	position: relative;
	display: flex;
	align-items: flex-end;
	min-height: 606px;
}

.banner h1 {
	color: var(--color-grey);
}

.banner-block {
	position: relative;
	z-index: 1;
	width: var(--width);
}

.banner-block ul {
	margin-bottom: 0;
	display: flex;
	flex-wrap: wrap;
}

.banner-block li {
	margin-bottom: 16px;
	padding: 6px 14px 2px;
	position: relative;
	z-index: 1;
	display: inline-flex;
	align-items: center;
	width: 45%;
	height: 49px;
	font-size: 1rem;
	font-weight: 400;
	color: var(--color-white);
}

.banner-block li:after {
	position: absolute;
	top: 0;
	left: 0;
	z-index: -1;
	width: var(--width);
	height: var(--height);
	background-image: url('../images/banner-shape1.svg');
	background-repeat: no-repeat;
	background-position: center center;
	background-size: 100% 100%;
	content: '';
	pointer-events: none;
}

.banner-block li:first-child {
	margin-right: 24px;
}

.banner-block li:nth-child(2n):after {
	background-image: url('../images/banner-shape2.svg');
}

.banner-block li:nth-child(3n) {
	margin-bottom: 0;
	width: var(--width);

	@media(width < 768px) {
		width: calc(var(--width) + 11px);
		left: 11px;
		margin-left: -11px;
	}

}

.banner-block li:nth-child(3n):after {
	width: var(--width);
	height: 47px;
	border: solid 1px rgba(255, 255, 255, 0.2);
	background: linear-gradient(90deg, rgba(255, 255, 255, 0.2) 0%, rgba(255, 255, 255, 0) 100%), #1a1b1d;
}

.banner-bg-picture {
	position: absolute;
	top: 0;
	left: 0;
	width: var(--width);
	height: var(--height);
}

.banner-bg-picture img {
	width: var(--width);
	height: var(--height);
	object-fit: cover;
	object-position: top center;
}

.banner-bg-picture:after,
.banner-bg-picture:before {
	position: absolute;
	top: 0;
	left: 0;
	width: var(--width);
	height: var(--height);
	background: linear-gradient(180deg, rgba(21, 24, 29, 0) 30.96%, #15181d 90.16%);
	content: '';
	pointer-events: none;
}

/* ### decision ### */
.decision {
	padding-top: 55px;
	padding-bottom: 52px;
	background-color: var(--color-white);
}

.decision h2 {
	margin-bottom: 17px;
	font-family: var(--font-family-base), sans-serif;
	font-size: 1.75rem;
	color: var(--color-grey-200);
}

.decision-block {
	display: flex;
	flex-wrap: wrap;
}

.decision-left {
	order: 2;
	width: var(--width);
}

.decision-left span {
	font-size: 0.875rem;
}

.decision-picture {
	margin-bottom: 15px;
	width: var(--width);
	height: 239px;
}

.decision-picture img {
	width: var(--width);
	height: var(--height);
	object-fit: cover;
	object-position: top center;
}

.decision-intro {
	margin-bottom: 42px;
	flex: 1;
	order: 1;
	line-height: 2;
}

.decision-intro p {
	margin-bottom: 14px;
}

.decision-intro li {
	margin-bottom: 4px;
	padding-left: 23px;
	position: relative;
}

.decision-intro li:before {
	position: absolute;
	top: 12px;
	left: 0;
	width: 5px;
	height: 9px;
	background-image: url('../images/plus.svg');
	background-repeat: no-repeat;
	background-position: top center;
	background-size: 5px 9px;
	content: '';
	pointer-events: none;
}

.decision-intro li strong {
	font-weight: 500;
}

.decision-block:not(:last-child) {
	margin-bottom: 33px;
	padding-bottom: 29px;
	position: relative;

	&:after {
		border-bottom: 1px solid var(--color-grey);
		width: 0%;
		height: 1px;
		position: absolute;
		display: block;
		left: 0;
		right: 0;
		bottom: 0px;
		content: '';
		transition: width 0.5s ease-out;
	}

	&.animate-line {
		&:after {
			width: 100%;
		}
	}
}

/* ### dashboard ### */
.dashboard {
	padding-top: 57px;
	padding-bottom: 41px;
	position: relative;
	z-index: 9;
}

.dashboard-block {
	position: relative;
}

.dashboard-picture {
	margin-left: -12px;
	width: calc(100% + 22px);
}

.dashboard-picture img {
	width: var(--width);
	height: var(--height);
	object-fit: cover;
}

.dashboard-info {
	margin-top: -15px;
	padding: 26px 24px 21px;
	position: relative;
	z-index: 1;
	line-height: 1.74;
	background-color: var(--color-white);

	@media(width < 768px) {
		&:empty {
			display: none;
		}

		.card-dashboard-info {
			position: static;
			transform: unset;
			margin: unset;
			width: auto;
			padding: unset;
		}

		.card-dashboard-close {
			display: none;
		}
	}
}

.dashboard-info h6 {
	margin-bottom: 28px;
	font-family: var(--font-family-base), sans-serif;
}

.dashboard-info p:last-of-type {
	margin-bottom: 0;
}

/* ### card-dashboard ### */
.card-dashboard {
	position: absolute;
	top: 13.2%;
	left: 3.5%;
	/* display: none; */
	opacity: 0;
}

.card-dashboard-dot {
	position: relative;
	width: 16px;
	height: 16px;
	border-radius: 50%;
	background-color: rgba(255, 255, 255, 0.4);
	transition: var(--duration);
	cursor: pointer;
	animation: pulse-ring 3.4s ease-out infinite;
	transform-origin: center;

}

.card-dashboard-dot:after {
	position: absolute;
	top: 50%;
	left: 50%;
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background-color: var(--color-white);
	transform: translate(-50%, -50%);
	content: '';

}

.card-dashboard-info {
	margin-top: -15px;
	margin-right: -8px;
	padding: 34px 24px 30px 32px;
	position: absolute;
	top: 23px;
	left: 100%;
	z-index: 1;
	/* display: none; */
	transform: scale(0);
	width: 325px;
	line-height: 1.74;
	background-color: var(--color-white);
	transition: var(--duration);
	transform-origin: top right;

	h6 {
		margin-bottom: 28px;
		font-family: var(--font-family-base), sans-serif;
	}

	p:last-of-type {
		margin-bottom: 0;
	}
}


.card-dashboard-info .card-dashboard.two {
	top: 3.7%;
	right: 14.3%;
	left: unset;
}

.card-dashboard.three {
	top: 40.7%;
	left: 39.6%;
}

.card-dashboard.four {
	top: unset;
	bottom: 33%;
	left: 26.5%;
}

.card-dashboard.five {
	top: unset;
	bottom: 24.3%;
	left: 52.1%;
}

.card-dashboard-dot:hover {
	transform: scale(1.1);
}

.card-dashboard-close {
	position: absolute;
	top: 10px;
	right: 9px;
	z-index: 2;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 30px;
	height: 30px;
	border: 0;
	background: transparent;
	cursor: pointer;
}

.card-dashboard.is-active .card-dashboard-info {
	/* display: block; */
	transform: scale(1);
}

/* ### card-project ### */
.card-project {
	display: block;
	width: var(--width);
	font-size: 0.875rem;
	font-weight: 400;
	text-decoration: var(--line-decoration);
	color: var(--color-pastel-black);
	background-color: var(--color-white);
}

.card-project-picture {
	width: var(--width);
	height: 202px;
}

.card-project-picture img {
	width: var(--width);
	height: var(--height);
	object-fit: cover;
}

.card-project-info {
	padding: 24px 26px 32px 24px;
	line-height: 1.4;
}

.card-project-lead {
	margin-bottom: 7px;
	display: block;
	font-family: var(--font-family-guton), sans-serif;
	font-size: 2rem;
	font-weight: 500;
	line-height: 1;
	color: var(--color-medium-grey);
}

.card-project-lead strong {
	font-weight: 500;
	color: #1A1A19;
}

.card-project-info p {
	color: var(--color-black-alt);
}

.card-project-info p:last-of-type {
	margin-bottom: 0;
}

/* ### card-team ### */
.card-team {
	width: var(--width);
	font-size: 0.875rem;
}

.card-team-picture {
	margin-bottom: 19px;
	width: var(--width);
	height: 192px;
}

.card-team-picture img {
	width: var(--width);
	height: var(--height);
	object-fit: cover;
}

.card-team-name {
	margin-bottom: 2px;
	font-size: 0.938rem;
	font-weight: 400;
	line-height: 1;
}

/* ### card-author ### */
.card-author {
	display: flex;
	flex-wrap: wrap;
}

.card-author-picture {
	margin-top: 13px;
	margin-right: 12px;
	width: 52px;
	height: 52px;
	overflow: hidden;
	border-radius: 50%;
}

.card-author-picture img {
	width: var(--width);
}

.card-author-text {
	padding: 28px 20px 22px 22px;
	position: relative;
	flex: 1;
	line-height: 2;
	background-color: var(--color-white);
}

.card-author-text p:last-of-type {
	margin-bottom: 0;
}

.card-author-text:before {
	position: absolute;
	top: 0;
	left: -16px;
	width: 0;
	height: 0;
	border-color: transparent #fff transparent transparent;
	border-style: solid;
	border-width: 0 28px 28px 0;
	transform: rotate(0deg);
	content: '';
}

/* ### card-form ### */
.card-form {
	padding: 28px 40px;
	background-color: var(--color-white);
}

.card-form-lead {
	margin-bottom: 43px;
	font-size: 1.375rem;
	font-weight: 400;
	font-family: var(--font-family-base);
}

.card-form label {
	display: block;
	font-size: 0.875rem;
	font-weight: 500;
	color: var(--color-gunmetal-black);
}

.card-form-bottom {
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-end;
}

.card-form-group {
	margin-bottom: 39px;

	&.has-error {
		label {

			color: red;
		}

		.error {
			margin-block: 1rem;
			color: red;
			font-style: italic;
		}
	}
}

.card-form-group:nth-child(2) {
	margin-bottom: 45px;
}

.card-form-group:nth-child(3) {
	margin-bottom: 33px;
}

.card-form-group:nth-child(4) {
	margin-bottom: 31px;
}

.card-form-group:nth-child(5) {
	margin-bottom: 31px;
}

.card-form-group:nth-child(6) {
	margin-bottom: 35px;
}

/* ### card-news ### */
.card-news {
	position: relative;
	display: block;
	text-decoration: var(--line-decoration);
	overflow: hidden;
}

.card-news-logo {
	position: absolute;
	top: 16px;
	left: 16px;
	z-index: 2;
	width: 190px;
}

.card-news-logo img {
	width: var(--width);
}

.card-news-info {
	padding: 25px 24px 18px;
	position: absolute;
	bottom: 0;
	left: 0;
	z-index: 2;
	width: var(--width);
	font-weight: 400;
	line-height: 1.5;
	color: var(--color-grey);
}

.card-news-info p {
	margin-bottom: 19px;
}

.card-news-info h2 {
	margin-bottom: 5px;
	font-size: 1.313rem;
	color: var(--color-grey);
}

.card-news-info ul {
	margin-top: auto;
	display: flex;
	flex-wrap: wrap;
}

.card-news-info li {
	margin-bottom: 6px;
	padding: 10px 12px 8px;
	display: flex;
	flex-wrap: wrap;
	font-size: 0.875rem;
	background-color: rgba(255, 255, 255, 0.16);
}

.card-news-info li:not(:last-child) {
	margin-right: 6px;
}

.card-news-picture {
	position: relative;
	width: var(--width);
	height: 479px;
}

.card-news-picture img {
	width: var(--width);
	height: var(--height);
	object-fit: cover;
	transition: var(--duration);
}

.card-news-picture:before {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 1;
	width: var(--width);
	height: var(--height);
	background: linear-gradient(180deg, rgba(26, 27, 29, 0.5) 0%, rgba(26, 27, 29, 0) 50.48%, #1a1b1d 100%);
	content: '';
	pointer-events: none;
}

.card-news:hover .card-news-picture img {
	transform: scale(1.03);
}

.card-news-alt .card-news-logo {
	top: 16px;
	bottom: unset;
}

/* ### sticky-menu ### */
.sticky-menu {
	position: fixed;
	bottom: -50px;
	left: 0;
	z-index: 12;
	display: flex;
	justify-content: center;
	width: var(--width);
	opacity: 0;
	visibility: hidden;
	transition: var(--duration);
}

.sticky-menu-block {
	padding: 8px 12px;
	width: var(--width);
	border-radius: 75px;
	background-color: rgba(0, 0, 0, 0.3);
	backdrop-filter: blur(2px);

	li.is-active a {
		background-color: rgba(255, 255, 255, 0.29);
	}
}

.sticky-menu ul {
	display: flex;
	justify-content: space-between;
}

.sticky-menu li {
	font-size: 0.938rem;
}

.sticky-menu li a {
	padding: 10px 12px;
	font-weight: 400;
	text-decoration: var(--line-decoration);
	color: var(--color-white);
	border-radius: 75px;
}

.sticky-menu li a:focus,
.sticky-menu li a:hover {
	background-color: rgba(255, 255, 255, 0.29);
}

.sticky-menu .button {
	margin-left: 10px;
	display: none;
}

.sticky-menu.is-active {
	opacity: 1;
	visibility: visible;
	bottom: 30px;
}

/* ### is-home ### */
.is-home .header {
	padding-top: 16px;
	padding-bottom: 16px;
	/* mix-blend-mode: difference; */
	background: transparent;

}

.is-home .header-menu li a:hover {
	color: var(--color-dark-grey);
}

/* ### footer ### */
.footer {
	padding-top: 49px;
	padding-bottom: 30px;
	font-size: var(--font-size-base);
	font-weight: 400;
	color: var(--color-white);
	background-color: var(--color-gunmetal-black);
	position: relative;
	z-index: 13;
}

.footer-top {
	margin-bottom: 51px;
}

.footer-logo {
	margin-bottom: 23px;
	width: 224px;
}

.footer-logo img {
	width: var(--width);
}

.footer-info {
	margin-bottom: 56px;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}

.footer-info address {
	margin-right: 10px;
	margin-bottom: 0;
	font-style: normal;
}

.footer-info li a {
	text-decoration: none;
	color: var(--color-white);
}

.footer-info li a:focus,
.footer-info li a:hover {
	text-decoration: underline;
	text-underline-offset: 4px;
}

.footer-copyright {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	font-size: 0.875rem;
	font-weight: 300;
	color: var(--color-dark-grey);

	p,
	li a {
		opacity: 0;
		transform: translateY(50px) scaleY(1.1);

		@starting-style {
			opacity: 0;
			transform: translateY(50px) scaleY(1.1);
		}
	}
}

.footer-copyright p {
	order: 2;
}

.footer-copyright p:last-of-type {
	margin-bottom: 0;
}

.footer-copyright ul {
	display: flex;
	flex-wrap: wrap;
	order: 1;
}

.footer-copyright li {
	margin-bottom: 3px;
}

.footer-copyright li a {
	text-decoration: var(--line-decoration);
	color: var(--color-dark-grey);
}

.footer-copyright li a:focus,
.footer-copyright li a:hover {
	color: var(--color-white);
}

.footer-copyright li:not(:last-child) {
	margin-right: 24px;
}

.footer .button {
	padding-right: 21px;
	border: solid 1px rgba(255, 255, 255, 0.22);
}

/* ###  Slide down ### */
@keyframes slideBounce {
	0% {
		transform: translateY(-90px);
	}

	100% {
		transform: translateY(90px);
	}
}

/* ### Bounce after slide ### */
@keyframes bounce {
	0% {
		transform: translateY(90px);
	}

	50% {
		transform: translateY(75px);
	}

	100% {
		transform: translateY(90px);
	}
}

/* #Media Queries
================================================== */

@media only screen and (max-width: 767px) {
	.button.button-submit {
		padding-right: 20px;
	}

	.header .button {
		color: var(--color-black);
		background-color: rgba(255, 255, 255, 0.35);
	}

	.is-home .header .button {
		color: var(--color-white);
		background-color: rgba(0, 0, 0, 0.3);
	}

	.footer .button.button-dot {
		padding-left: 21px;
	}

	.footer .button.button-dot:before {
		margin-right: 16px;
	}
}

@media only screen and (min-width: 768px) {
	.hero-line {
		display: block;
	}

	.team-holder {
		grid-template-columns: repeat(3, 1fr);
	}

	.action-block {
		display: flex;
		flex-wrap: wrap;
		align-items: center;
		justify-content: space-between;
	}

	.dashboard-info {
		display: none;
	}

	.card-dashboard.two .card-dashboard-info {
		right: 100%;
		left: unset;
	}

	.card-dashboard {
		display: block;
	}

	.card-team-picture {
		height: 336px;
	}

	.card-team-name {
		font-size: 1.125rem;
	}

	.sticky-menu-block {
		padding: 14px 15px 13px 14px;
		display: flex;
		flex-wrap: wrap;
		align-items: center;
		justify-content: space-between;
		background-color: rgba(0, 0, 0, 0.45);
		backdrop-filter: blur(8px);
	}

	.sticky-menu ul {
		justify-content: unset;
	}

	.sticky-menu li {
		margin: 0;
		font-size: 1rem;
	}

	.sticky-menu li:not(:last-child) {
		margin-right: 8px;
	}

	.sticky-menu .button {
		display: inline-flex;
	}

	.footer-top {
		display: flex;
		flex-wrap: wrap;
		align-items: center;
		justify-content: space-between;
	}

	.footer-logo {
		margin-bottom: 0;
	}
}

@media only screen and (min-width: 1025px) {
	:root {
		--font-size-h1: 5.625rem;
	}

	input,
	select,
	textarea {
		padding: 10px 10px 5px;
	}

	textarea {
		padding-top: 13px;
		height: 80px;
	}

	.centered {
		padding-right: calc((100% - var(--width-base)) / 2);
		padding-left: calc((100% - var(--width-base)) / 2);
	}

	.button {
		padding: 6px 21px 5px;
	}

	.button span {
		display: inline-block;
		margin-left: 5px;
	}

	.button.button-dot:before {
		margin-right: 15px;
	}

	.button.button-black.button-dot:before {
		width: 8px;
		height: 8px;
		background-color: rgba(255, 255, 255, 0.4);
	}

	.button.button-submit.button-dot:before {
		margin-right: 12px;
	}

	.wrapper:after {
		background-color: rgba(255, 255, 255, 0.22);
		mix-blend-mode: difference;
	}

	/* 
	.is-home .wrapper:after {
		top: 117px;
		height: calc(100% - 117px);
	} */

	.header {
		padding-top: 27px;
		padding-bottom: 27px;
	}

	.header .button {
		margin-left: 41px;
		min-height: 46px;
	}

	.header-logo {
		width: 303px;
	}

	.header-menu ul {
		padding-top: 1px;
		display: flex;
		flex-wrap: wrap;
	}

	.header-menu li a {
		position: relative;
		display: block;
	}

	.header-menu li a {
		&:after {
			position: absolute;
			/* inset: 0; */
			bottom: -4px;
			left: 0;
			right: 0;
			height: 1px;
			width: 100%;
			transform: scaleX(0);
			transform-origin: right;
			transition: transform 0.3s ease-in-out;
			background-color: var(--color-dark-grey);
			content: '';
			pointer-events: none;
			/* transition: var(--duration); */
		}

		&:hover,
		&:focus {
			&:after {
				transform: scaleX(1);
				transform-origin: left;
			}
		}
	}

	.hero {
		margin-top: -110px;
		padding-bottom: 120px;
		min-height: 1024px;

		@media(width > 1024px) {
			height: 100vh;
		}
	}

	.hero h1 {
		margin-bottom: 63px;
		line-height: 1;
		position: relative;
		left: -3px;
	}

	.hero-intro img {
		width: 138px;
	}

	.intro-block {
		padding-top: 120px;
		padding-bottom: 50px;
	}

	.intro-block-large {
		margin-bottom: 42px;
		font-size: 3.25rem;
		line-height: 1.27;
		max-width: 740px;
		color: #15181D;
	}

	.intro-block-large p br {
		display: block;
	}

	.intro-block-bottom {
		margin-left: auto;
		width: var(--width);
		max-width: 448px;
	}

	.intro-block.inner {
		padding-bottom: 86px;
	}

	.intro-block.inner .intro-block-large {
		margin-bottom: 42px;
		font-size: 2.75rem;
		line-height: 1.5;
	}

	.intro-block.alt {
		padding-bottom: 115px;
	}

	.intro-block.alt .intro-block-bottom p {
		margin-bottom: 45px;
	}

	.faqs {
		padding-top: 37px;
		padding-bottom: 120px;
	}

	.faqs-block {
		align-items: flex-end;
		justify-content: space-between;
		position: relative;
		overflow: hidden;
	}

	.faqs-picture {
		order: 1;
		width: 51%;
		height: var(--height);
	}

	.faqs-right {
		position: relative;
		margin-bottom: 0;
		padding: 0 60px 60px 0;
		order: 2;
		width: 49%;
	}

	.faqs-right:after {
		position: absolute;
		bottom: calc(100% - 10px);
		left: -16px;
		display: block;
		width: 16px;
		height: 100%;
		background: var(--color-white);
		content: '';
	}

	.faqs-right:before {
		position: absolute;
		top: calc(100% - 60px);
		left: -16px;
		display: block;
		width: 16px;
		height: 100%;
		background: var(--color-white);
		content: '';
	}

	.faqs-content {
		padding-left: 56px;
		margin-left: -16px;
		position: relative;
		transition: all 0.3s ease-in-out;
		transform: none;
	}

	.faqs-according.is-active .faqs-content {
		margin-top: -10px;
	}

	.faqs-content .faqs-info {
		padding-bottom: 4px;
	}

	.faqs-according {
		border-bottom: 0;
	}

	.faqs-according:after {
		position: absolute;
		bottom: 0;
		left: 40px;
		content: '';
		width: calc(100% - 40px);
		height: 1px;
		background: var(--color-grey);
	}

	.faqs-content:after {
		content: '';
		position: absolute;
		left: 0;
		top: 0;
		width: 16px;
		height: calc(100% + 30px);
		background: var(--color-white);
	}

	.faqs-text {
		padding: 28px 0 27px 42px;
		position: relative;
		font-size: 1.625rem;
	}

	.faqs-icon {
		position: absolute;
		top: 24px;
		left: -16px;
		display: block;
		width: 16px;
		height: 37px;
	}

	.faqs-icon:before {
		position: absolute;
		bottom: 100%;
		left: 0;
		display: block;
		width: 19px;
		height: 100%;
		background: var(--color-white);
		content: '';
	}

	.faqs-icon:after {
		position: absolute;
		top: calc(100% - 1px);
		left: 0;
		display: block;
		width: 19px;
		height: 160%;
		background: var(--color-white);
		content: '';
	}

	.faqs-icon svg {
		width: 16px;
		height: auto;
	}

	.faqs-icon svg rect {
		fill: #000;
	}

	.faqs-info {
		padding-right: 15px;
		padding-bottom: 0;
		line-height: 1.85;
	}

	.faqs-list li {
		margin-right: 0;
	}

	.faqs-list li:not(:last-child):after {
		display: inline-block;
	}

	.parallax-block {
		height: 800px;
	}

	.explain {
		padding-top: 122px;
		padding-bottom: 120px;
	}

	.explain h2 {
		padding-left: 0;
		font-size: var(--font-size-h2);
		line-height: 0.9;
	}

	.explain-block {
		margin-top: -26px;
		display: flex;
		flex-wrap: wrap;
		align-items: flex-end;
	}

	.explain-picture {
		margin-right: 60px;
		margin-bottom: 0;
		width: 44.1%;
	}

	.explain-picture img {
		width: var(--width);
		height: var(--height);
		object-fit: cover;
		opacity: 0;

		@starting-style {
			opacity: 0;

		}
	}

	.explain-intro {
		margin-bottom: -5px;
		flex: 1;
		line-height: 1.87;
	}

	.explain-intro p {
		margin-bottom: 46px;
	}

	.partner {
		padding-top: 117px;
		padding-bottom: 122px;
	}

	.partner-lead {
		margin-bottom: 73px;
		font-size: 1.25rem;
	}

	.partner .swiper {
		margin-bottom: 60px;
	}

	.place {
		padding-top: 80px;
		padding-bottom: 80px;
		min-height: 750px;
	}

	.place h2 {
		margin-bottom: 77px;
		font-size: 5rem;
	}

	.place h2 br {
		display: block;
	}

	.place-block img {
		width: 138px;
	}

	.place.alt h2 {
		margin-bottom: 83px;
		font-size: 4.5rem;
	}

	.place.inner h2 {
		font-size: 4.5rem;
	}

	.page-title {
		padding-bottom: 48px;
		padding-top: 149px;
	}

	.page-title h1 {
		margin-left: -10px;
		font-size: 10rem;
	}

	.page-title.inner {
		padding-bottom: 70px;
		padding-top: 130px;
	}

	.page-title.inner h1 {
		margin-left: -2px;
		font-size: 5.75rem;
	}

	.project {
		padding-bottom: 120px;
	}

	.project .swiper {
		margin-bottom: 52px;
	}

	.support h2 {
		margin-bottom: 43px;
		font-size: 4.375rem;
	}

	.support-intro {
		line-height: 2;
	}

	.team {
		padding-bottom: 79px;
		padding-top: 113px;

		.card-team {
			opacity: 0;
			transform: translateY(50px);
		}
	}

	.team h2 {
		margin-bottom: 33px;
		margin-left: -5px;
		font-size: 5.625rem;
	}

	.team-intro {
		margin-bottom: 77px;
		line-height: 1.9;
	}

	.team-holder {
		grid-row-gap: 59px;
		grid-column-gap: 50px;
		grid-template-columns: repeat(3, 1fr);
	}

	.action {
		padding-bottom: 62px;
	}

	.action h2 {
		margin-bottom: 0;
		font-size: 1.625rem;
	}

	.action-block {
		padding: 25px 32px 28px;
	}

	.action-right {
		margin-bottom: -14px;
	}

	.text-block {
		margin-bottom: 113px;
	}

	.text-block-holder {
		padding-right: 15%;
	}

	.text-block p:first-child {
		margin-bottom: 68px;
		font-size: 3.25rem;
		line-height: 1.27;
	}

	.text-block p {
		margin-bottom: 65px;

		&.strong-only {
			margin-bottom: 0;
		}
	}

	.text-block h6,
	.text-block strong {
		margin-bottom: 41px;
		padding-top: 0;
		font-family: var(--font-family-base), sans-serif;
	}

	.text-block ul {
		margin-top: -43px;
	}

	.connect {
		margin-bottom: 148px;
		padding-top: 120px;
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
	}

	.connect h1 {
		margin-bottom: 99px;
		margin-left: -62px;
		max-width: unset;
		font-size: 7.5rem;
		line-height: 0.92;
	}

	.connect-left {
		width: 38.7%;
	}

	.connect-info {
		display: block;
		width: var(--width);
	}

	.connect-right {
		padding-top: 6px;
		width: 50.9%;
	}

	.connect .card-author {
		margin-left: -68px;
	}

	.connect-items:not(:last-child) {
		margin-bottom: 52px;
	}

	.connect .card-form {
		margin-left: 0;
		width: var(--width);
	}

	.news {
		margin-bottom: 113px;
		padding-top: 121px;
	}

	.news h1 {
		margin-bottom: 119px;
		margin-left: -2px;
		font-size: 6.25rem;
		line-height: 0.92;
	}

	.news-items {
		margin-left: 0;
		width: var(--width);

		.card-news-logo,
		h2,
		p,
		li {
			opacity: 0;
			transform: translateY(50px);

			@starting-style {
				opacity: 0;
				transform: translateY(50px);
			}
		}
	}

	.news-items:not(:last-child) {
		margin-bottom: 120px;
	}

	.banner {
		margin-top: -110px;
		margin-bottom: 120px;
		padding-bottom: 49px;
		min-height: 864px;
	}

	.banner h1 {
		margin-bottom: 85px;
	}

	.banner-block ul {
		margin-left: 92px;
	}

	.banner-block li {
		padding: 21px 35px 19px 37px;
		max-width: 298px;
		height: 80px;
		font-size: 1.375rem;
	}

	.banner-block li:not(:last-child) {
		margin-right: 22px;
	}

	.banner-block li:nth-child(2) {
		margin-right: 32px;
	}

	.banner-bg-picture:after {
		background: linear-gradient(#1e1e1e -5.7%, rgba(30, 30, 30, 0) 27.25%);
	}

	.banner-block li:nth-child(3n):after {
		width: 100vw;
		height: var(--height);
	}

	.decision {
		padding-top: 120px;
		padding-bottom: 139px;
	}

	.decision h2 {
		margin-bottom: 55px;
		font-size: 2.5rem;
		color: var(--color-pastel-black);
	}

	.decision-left {
		margin-right: 44px;
		order: 1;
		width: 44.2%;
	}

	.decision-picture {
		margin-bottom: 15px;
		height: 269px;
	}

	.decision-intro {
		margin-top: -6px;
		margin-bottom: 0;
		flex: 1;
		order: 2;
	}

	.decision-block:not(:last-child) {
		margin-bottom: 80px;
		padding-bottom: 47px;
	}

	.dashboard {
		padding-top: 120px;
		padding-bottom: 78px;
	}

	.dashboard-picture {
		margin-left: 0;
		width: var(--width);
	}

	.card-dashboard-info {
		right: 100%;
		left: unset;
		width: 364px;
	}

	.card-author-picture {
		margin-top: 2px;
		margin-right: 16px;
	}

	.card-author-text {
		padding: 28px 42px 24px;
	}

	.card-news-logo {
		top: unset;
		bottom: 69px;
		left: 69px;
		width: 281px;
	}

	.card-news-info {
		padding: 80px 50px 73px 0;
		top: 0;
		right: 0;
		bottom: unset;
		left: unset;
		display: flex;
		flex-direction: column;
		width: var(--width);
		max-width: 324px;
		height: var(--height);
		line-height: 2;
		border: solid 1px rgba(255, 255, 255, 0.22);
	}

	.card-news-info h2 {
		margin-bottom: 22px;
		font-size: 2.25rem;
	}

	.card-news-info ul {
		display: block;
	}

	.card-news-info li {
		padding: 2px 17px;
		display: table;
		font-size: 1rem;
	}

	.card-news-info li:not(:last-child) {
		margin-right: 0;
		margin-bottom: 14px;
	}

	.card-news-picture {
		height: 656px;
	}

	.card-news-picture:after,
	.card-news-picture:before {
		position: absolute;
		top: 0;
		left: 0;
		z-index: 1;
		width: var(--width);
		height: var(--height);
		background: linear-gradient(180deg, rgba(26, 27, 29, 0) 69.46%, rgba(26, 27, 29, 0.2) 83.57%);
		content: '';
		pointer-events: none;
	}

	.card-news-picture:after {
		background: linear-gradient(95.53deg, rgba(30, 30, 30, 0) 29.71%, rgba(30, 30, 30, 0.9) 78.13%);
		content: '';
	}

	.card-news-alt .card-news-logo {
		top: 53px;
		bottom: unset;
	}

	.card-form {
		padding: 54px 53px 48px;
	}

	.card-form-lead {
		margin-bottom: 43px;
		/* padding-left: 8px; */
		font-size: 1.375rem;
		font-weight: 400;
	}

	.card-form-group {
		margin-bottom: 32px;
	}

	.card-form label {
		display: block;
		font-size: 0.875rem;
		font-weight: 500;
		color: var(--color-gunmetal-black);
	}

	.card-form-group:nth-child(2) {
		margin-bottom: 32px;
	}

	.card-form-group:nth-child(3) {
		margin-bottom: 32px;
	}

	.card-form-group:nth-child(4) {
		margin-bottom: 30px;
	}

	.card-form-group:nth-child(5) {
		margin-bottom: 32px;
	}

	.card-form-group:nth-child(6) {
		margin-bottom: 32px;
	}

	.card-team {
		font-size: 1rem;
	}

	.card-team-picture {
		margin-bottom: 31px;
	}

	.card-team-name {
		margin-bottom: 9px;
		display: block;
		font-size: 1.25rem;
	}

	.card-project {
		font-size: 1rem;
	}

	.card-project-picture {
		height: 220px;
	}

	.card-project-info {
		padding: 22px 26px 24px;
		line-height: 1.4;
	}

	.card-project-lead {
		margin-bottom: 9px;
		font-size: 2.5rem;
	}

	.sticky-menu-block {
		max-width: 602px;
	}

	.is-home .header {
		padding-top: 32px;
		padding-bottom: 32px;
	}

	.is-home .header-menu li a:after {
		display: none;
	}

	.footer {
		padding-top: 115px;
	}

	.footer ul {
		list-style: none;
	}

	.footer-top {
		margin-bottom: 64px;
	}

	.footer-logo {
		width: 383px;
		position: relative;
		top: 6px;
	}

	.footer-info {
		margin-bottom: 178px;
		display: flex;
		flex-wrap: wrap;
		justify-content: unset;
	}

	.footer-info address {
		margin-right: 53px;
	}

	.footer-copyright p {
		order: 1;
	}

	.footer-copyright ul {
		order: 2;
	}

	.footer-copyright li {
		margin-bottom: 0;
	}

	.footer-copyright li:not(:last-child) {
		margin-right: 41px;
	}
}

@media only screen and (min-width: 1200px) {
	.connect h1 {
		margin-left: -150px;
	}
}

@media only screen and (min-width: 1330px) {
	.centered-lg {
		padding-right: calc((100% - var(--width-large)) / 2);
		padding-left: calc((100% - var(--width-large)) / 2);
	}

	.wrapper:after {
		margin-left: -640px;
		left: 50%;
	}

	.connect h1 {
		margin-left: -200px;
	}
}

.chat-popup {
	position: fixed;
	bottom: 32px;
	right: calc(-100% + 32px);
	z-index: 14;
	max-width: 450px;
	transition: right cubic-bezier(.43, -0.46, .35, 1.5) 3;

	&.show {
		right: 32px;
	}

	@media(width < 768px) {
		display: none;
	}

	&.hide {
		display: none;
	}

	.card-author {

		&:first-child {
			.card-author-text {
				margin-bottom: 33px;
				padding: 26px 32px 26px 32px
			}
		}
	}

	.card-author-text {
		position: relative;
		padding: 26px 32px 26px 42px;
		margin-bottom: 28px;
		box-shadow: 1px 1px 8px 2px rgba(0, 0, 0, 0.1);


		>button {
			border: none;
			background: unset;
			box-shadow: unset;
			position: absolute;
			top: 13px;
			right: 13px;
			cursor: pointer;
		}

		.name {
			font-size: 0.75rem;
			font-style: normal;
			font-weight: 500;
			line-height: 1.33;
			color: var(--color-dark-grey);
			display: block;
			padding-bottom: 26px;

			p {
				line-height: 1.62;
				font-weight: 300;
				color: var(--color-gunmetal-black);
				font-size: 1rem;
			}
		}

		.buttons {
			display: flex;
			gap: 12px;
			margin-top: 13px;

			/* justify-content: space-between; */
			button {
				background-color: var(--color-white);
				border: 1px solid rgba(102, 99, 96, 0.20);
				width: 50%;
				padding-inline: 10px;

				&:hover,
				&:focus {
					background-color: #E1E0E0;
				}
			}
		}

		.card-form {
			padding: 0 !important;

			h2 {
				font-size: 1rem;
				font-weight: 500;
				line-height: 1;
				color: var(--color-gunmetal-black);
				padding-block: 6px 22px;
				margin-bottom: 0;
				padding-left: 0;

			}

			.card-form-group {
				margin-bottom: 28px;
			}

			label {
				font-weight: 400;
				font-size: 0.875rem;
			}
		}

		.card-form-bottom {
			justify-content: flex-start;
		}
	}

	.card-author {
		&.form {
			max-height: 0;
			overflow: hidden;
			transition: all ease-in-out 0.3s;
			opacity: 0;

			.card-author-text {
				padding: 33px 32px 26px 32px;
				max-width: 376px;
				width: 100vw;
			}
		}
	}

	&.show-form {

		/* background-color: red; */
		.card-author.form {
			max-height: none;
			overflow: visible;
			opacity: 1;
		}
	}
}

.header-menu li a {
	position: relative;

	&:after {
		position: absolute;
		/* inset: 0; */
		bottom: -4px;
		left: 0;
		right: 0;
		height: 1px;
		width: 100%;
		transform: scaleX(0);
		transform-origin: right;
		transition: transform 0.3s ease-in-out;
		background-color: var(--color-dark-grey);
		content: '';
		pointer-events: none;
		/* transition: var(--duration); */
	}

	&:hover,
	&:focus {
		&:after {
			transform: scaleX(1);
			transform-origin: left;
		}
	}
}

.header-menu li.is-active {
	a:after {
		transform: scaleX(1);
		transform-origin: left;
	}
}

.header {
	background-color: transparent;
	transition: all 0.3s ease-out;
	/* position: fixed;
	top: 0;
	left: 0;
	right: 0; */
	background-color: transparent;
	mix-blend-mode: difference;

	&.sticky {

		opacity: 0;
		transform: translateY(20px);

	}

	.header-logo img,
	.header-menu li a,
	.header-menu .button {
		opacity: 0;
		transform: translateY(125%);
		transition-timing-function: cubic-bezier(.22, 1, .36, 1) !important;
	}

	.dark-text-logo {
		display: none;
	}

	&.dark-text {
		.header-menu li a {
			color: var(--color-pastel-black);

			&:after {
				background-color: rgb(from var(--color-grey-300) r g b / 0.4);
			}
		}

		.dark-text-logo {
			display: block;
		}

		.header-logo img:not(.dark-text-logo) {
			display: none;
		}

		.button {
			color: var(--color-pastel-black);
			border-color: rgb(from var(--color-grey-300) r g b / 0.4);

			&:before {
				background-color: rgb(from var(--color-grey-300) r g b / 0.4);
			}
		}
	}
}

[data-fade-up] {
	opacity: 0;
	transform: translateY(25%) scaleY(1.1);
}

.template-over-ons {
	main {
		background-color: var(--color-grey);
	}
}

@keyframes pulse-ring {
	0% {
		scale: 1;
		/* opacity: 0.35; */
	}

	70% {
		scale: 2.5;
		/* opacity: 0; */
	}

	100% {
		scale: 1;
		/* opacity: 0; */
	}
}