@font-face {
	font-family: 'Montserrat';
	src: url('/local/assets/v2/fonts/Montserrat-VariableFont_wght.ttf');
}

:root {
	--section-padding-bottom: 56px;
}

body, html {
	height: 100%;
}
body {
	font: 100%/150% 'Montserrat', sans-serif;
	color: var(--text-main);
}

ul {
	list-style: none;
	padding-left: 0;
	margin-bottom: 0;
}

a:hover {
	text-decoration: none;
}

.js-sticky-detector {
	height: 1px;
	margin-bottom: -1px;
}

.rounded-corners {
	border-radius: var(--border-radius-m);
}

.section-padding {
	padding-top: var(--ui-section-padding);
	padding-bottom: var(--ui-section-padding);
}

.mb-32 {
	margin-bottom: 32px;
}

.bg-white {
	background-color: var(--brand-white);
}

.color-secondary {
	color: var(--text-secondary)
}

#wrapper {
	display: flex;
	flex-direction: column;
	min-width: 360px;
	min-height: 100vh;
	padding-top: 0;
	background-color: var(--page-background);
	overflow: hidden;
}

#main {
    padding-top: 104px;
	flex-grow: 1;
}

.content-container {
	max-width: 1728px;
	padding: 0 32px;
}

section,
.section-mb {
	margin-bottom: var(--section-padding-bottom);
}

.section-header {
	margin-bottom: 40px;
	font-size: 42px;
	font-weight: 700;
	line-height: 56px;
}

.section-header--sm {
	font-size: 24px;
	font-weight: 700;
	margin-bottom: 20px;
	line-height: 1.5;
}

.js-swiper-project-images:not(.swiper-initialized) .image-slider-prev,
.js-swiper-project-images:not(.swiper-initialized) .image-slider-next,
.js-swiper-project-images:not(.swiper-initialized) .slider-pagination {
	display: none;
}

.project-card__name {
	display: block;
	margin-bottom: 40px;
	color: var(--text-main);
	font-size: 32px;
	font-weight: 600;
	line-height: 120%;
}

a.project-card__name {
	text-decoration: none;
}

.project-card__name::before {
	content: '/\00a0';
}

.project-card__description {
	margin-bottom: 32px;
	color: var(--text-secondary);
	font-size: 16px;
	font-weight: 400;
	line-height: 24px;
}

.project-card__image {
	border-radius: 24px;
	overflow: hidden;
}

a.project-card__image {
	display: block;
}

.project-card__image img {
	width: 100%;
    height: 100%;
	object-fit: cover;
}

.project-params {
    display: flex;
    flex-direction: column;
	margin-bottom: 24px;
}

.project-params__project-name {
	margin-bottom: 16px;
}

.project-param {
	display: flex;
	justify-content: space-between;
}

.project-param > :first-child {
	color: var(--ui-some-gray-text);
}

.project-param:not(:last-child) {
	margin-bottom: 10px;
}


/* Фикс для свайпера с фэйдом, когда клики ловятся слайдами, которые не активны */
.projects-our .swiper-fade .swiper-slide-active,
.projects-our-dev .swiper-fade .swiper-slide-active,
.project-spotlight .swiper-fade .swiper-slide-active,
.pros .swiper-fade .swiper-slide-active {
	z-index: 15;
	opacity: 1 !important;
}

.pros .swiper-fade .swiper-slide-prev {
	opacity: 0 !important;
}

.projects-our .swiper-fade .swiper-slide:not(.swiper-slide-active),
.project-spotlight .swiper-fade .swiper-slide:not(.swiper-slide-active) {
	z-index: 10;
}

.text-expandable {
	--line-height: 24px;
	--container-height: calc(var(--line-height) * 2);

	max-height: var(--container-height);
	line-height: var(--line-height);
}

.text-expandable__container,
.text-expandable__text {
	display: block;
}

.text-expandable__container {
	position: relative;
	height: var(--container-height);
	overflow: hidden;
	background-color: var(--page-background);
	transition: height .4s ease-in-out, box-shadow .3s;
	z-index: 10;
}

.text-expandable__container.expanded {
	box-shadow: 0 24px 32px 24px var(--page-background);
}

.text-expandable__btn {
	border: none;
	outline: none;
	padding: 0;

	position: absolute;
	right: 0;
	top: var(--line-height);
	font-weight: 500;
	color: var(--text-main);
	line-height: var(--line-height);
	background: var(--page-background);
	box-shadow: -8px 8px 16px 8px var(--page-background)
}

.text-expandable__btn.text-expandable__btn--collapse {
	top: initial;
	bottom: 0;
}

.text-expandable__container:not(.expanded) .text-expandable__btn--collapse,
.text-expandable__container.expanded .text-expandable__btn {
	transition: opacity .4s, visibility .4s;
}

.text-expandable__container:not(.expanded) .text-expandable__btn:not(.text-expandable__btn--collapse),
.text-expandable__container.expanded .text-expandable__btn--collapse {
	transition: opacity .4s .3s, visibility .4s
}

.text-expandable__btn,
.text-expandable__container.expanded .text-expandable__btn.text-expandable__btn--collapse {
	visibility: visible;
	opacity: 1;
}

.text-expandable__btn.text-expandable__btn--collapse,
.text-expandable__container.expanded .text-expandable__btn:not(.text-expandable__btn--collapse) {
	visibility: hidden;
	opacity: 0;
}

.list-style-star ul li {
	display: flex;
	margin-bottom: 16px;
	align-items: center;
}

.list-style-star ul li::before {
	content: "\2022";
	display: inline-block;
	position: relative;
	top: -1px;
	margin-right: 16px;
	font-size: 24px;
	font-weight: bold;
	color: var(--text-tetriary);
}

.article ol,
.article ul,
.ui-bs-accordion ol,
.ui-bs-accordion ul {
    margin: 8px 0;
}

.article ul,
.ui-bs-accordion ul {
    padding-left: 1.5rem;
    list-style: none;
}

.article ul li::marker,
.ui-bs-accordion ul li::marker {
    content: '\2022   ';
    color: var(--ui-text-primary);
}

.article ol,
.ui-bs-accordion ol {
    padding-left: 1.5rem;
}

.socials-block > a:not(:last-child) {
	margin-right: 12px;
}

.gallery-carousel {
	padding-top: var(--ui-section-padding);
}

.gallery-carousel__item {
	width: auto;
	height: 360px;
}

.gallery-carousel__image {
	width: 100%;
	height: 100%;
	border-radius: var(--border-radius-l);
	object-fit: cover;
}

.project-slider-preview .project-preview-card {
	--project-card-margin-bottom: 0;
	height: 100%;
}

.project-slider-preview .preview-card__image img {
	object-fit: contain;
}

.project-slider-preview .preview-card__image[data-custom-width="100"] {
	margin-bottom: 8px;
	padding: 0;
}

.project-slider-preview .preview-card__image[data-custom-width="100"] img {
	object-fit: cover;
	border-radius: 0;
}

@media (max-width: 1399px) {
	.content-container {
		padding: 0 16px;
	}
}

@media (max-width: 1199px) {
	.row {
		--bs-gutter-x: 24px;
	}

	.project-card__description {
		margin-bottom: 16px;
	}

	.project-params__project-name {
		font-size: 30px;
		line-height: 40px;
	}
}

@media (max-width: 991px) {

	:root {
		--section-padding-bottom: 40px;
	}

	#main {
		padding-top: 88px;
	}

}

@media (max-width: 767px) {
	.content-container {
		padding: 0 8px;
	}
}

@media (max-width: 575px) {
	.gallery-carousel__container {
		display: flex;
		flex-direction: column;
	}

	.gallery-carousel .gallery-carousel__header {
		margin-bottom: 0;
	}

	.gallery-carousel__carousel {
		margin-top: 24px;
		order: 1;
	}

	.gallery-carousel__item  {
		max-height: 200px;
	}

	.section-header {
		margin-bottom: 24px;
		font-size: 36px;
		line-height: 48px;
	}
}