@font-face {
	font-family: "SF Pro Display";
	src: url("https://raw.githubusercontent.com/weareneture/genglass-kz/main/font/SF-Pro-Display-Light.woff2") format("woff2"),
		url("https://raw.githubusercontent.com/weareneture/genglass-kz/main/font/SF-Pro-Display-Light.woff") format("woff");
	font-weight: 300;
	font-style: normal;
	font-display: swap;
}


@font-face {
	font-family: "SF Pro Display";
	src: url("https://raw.githubusercontent.com/weareneture/genglass-kz/main/font/SF-Pro-Display-Regular.woff2") format("woff2"),
		url("https://raw.githubusercontent.com/weareneture/genglass-kz/main/font/SF-Pro-Display-Regular.woff") format("woff");
	font-weight: 400;
	font-style: normal;
	font-display: swap;
}


@font-face {
	font-family: "SF Pro Display";
	src: url("https://raw.githubusercontent.com/weareneture/genglass-kz/main/font/SF-Pro-Display-Medium.woff2") format("woff2"),
		url("https://raw.githubusercontent.com/weareneture/genglass-kz/main/font/SF-Pro-Display-Medium.woff") format("woff");
	font-weight: 500;
	font-style: normal;
	font-display: swap;
}


@font-face {
	font-family: "SF Pro Display";
	src: url("https://raw.githubusercontent.com/weareneture/genglass-kz/main/font/SF-Pro-Display-Semibold.woff2") format("woff2"),
		url("https://raw.githubusercontent.com/weareneture/genglass-kz/main/font/SF-Pro-Display-Semibold.woff") format("woff");
	font-weight: 600;
	font-style: normal;
	font-display: swap;
}


@font-face {
	font-family: "SF Pro Display";
	src: url("https://raw.githubusercontent.com/weareneture/genglass-kz/main/font/SF-Pr-oDisplay-Bold.woff2") format("woff2"),
		url("https://raw.githubusercontent.com/weareneture/genglass-kz/main/font/SF-Pro-Display-Bold.woff") format("woff");
	font-weight: 700;
	font-style: normal;
	font-display: swap;
}

.circle-blur {
    filter: blur(200px);
}

.gg-main-button { 
	padding: 14px 24px 16px 24px;
	gap: 10px;  
	border-radius: 4px;
	background: #EBAA11;
	color: #141414;
	text-align: center;
	font-family: SF Pro Display;
	font-size: 12px;
	font-style: normal;
	font-weight: 600;
	line-height: 15px; /* 125% */
	width: fit-content;
	display: flex;
	justify-content: center;
	align-items: center;
}

.gg-white-button { 
	padding: 14px 24px 16px 24px;
	gap: 10px;  
	border-radius: 4px;
	background: #FFF;
	color: var(--0, #FFF);
	text-align: center;
	font-family: SF Pro Display;
	font-size: 12px;
	font-style: normal;
	font-weight: 600;
	line-height: 15px; /* 125% */
	width: fit-content;
	display: flex;
	justify-content: center;
	align-items: center;
}

.gg-second-button { 
	padding: 14px 24px 16px 24px;
	gap: 10px;
	border-radius: 4px;
	border: 1px solid var(--0, #FFF);
	color: var(--0, #FFF);
	text-align: center;
	font-family: "SF Pro Display";
	font-size: 12px;
	font-style: normal;
	font-weight: 600;
	line-height: 15px; /* 125% */
	width: fit-content;
	display: flex;
	justify-content: center;
	align-items: center;
}

.materials-block {
	width: 100%;
	display: flex;
	flex-direction: row;
	justify-content: center;
	align-items: center;
	gap: 12px;
}

.material-block {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 12px;
	border-radius: 8px;
	background: #F7F7F7;
	overflow: hidden !important;
}

.material-head { 
	color: var(--900, #141414);
	font-family: "SF Pro Display";
	font-size: 14px;
	font-style: normal;
	font-weight: 500;
	line-height: 18px; /* 128.571% */
}

.material-description {
	color: var(--600, #525252);
	font-family: "SF Pro Display";
	font-size: 12px;
	font-style: normal;
	font-weight: 400;
	line-height: 16px; /* 133.333% */
}

.material-img {
	display: flex;
	align-items: center;
	align-self: stretch;
	width: 100%;
}

.text {
	display: flex;
	padding: 20px 20px 0 20px;
	flex-direction: column;
	justify-content: center;
	align-items: left;
	gap: 4px;
	align-self: stretch;
}

@media(max-width:640px) {
	.materials-block {
		display: block;
		flex-direction: column;
	}
	.material-block:first-child { 
		margin-bottom: 8px !important;
	}
}


/* Карусель */
/* Infinite Carousel */
.top-container-projects {
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	align-items: flex-start;
	align-self: stretch;
	padding-bottom: 16px;
}
.header-projects { 
	color: var(--900, #141414);
	font-family: "SF Pro Display";
	font-size: 32px;
	font-style: normal;
	font-weight: 500;
	line-height: 32px; /* 100% */
	letter-spacing: -0.64px;
}

.uc-carousel{position:relative; width:100%; margin:0 auto; overflow:visible;}
.uc-viewport{overflow:visible; width:100%}
.uc-track{display:flex; will-change:transform; transition:transform .45s ease}
.uc-slide{flex:0 0 auto; width:100%; box-sizing:border-box; padding:6px}

/* Карточка */
.uc-card{border-radius:0px; overflow:hidden; background: transparent; border:0px;}
.uc-media{position:relative; aspect-ratio: 1120 / 920; background: transparent; border-radius: 8px; overflow:hidden;}
.uc-media img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; display:block}
.uc-body{padding:12px 14px;}
.uc-title{margin:0; color: #FFF;text-align: center;font-family: "RF Dewi";font-size: 16px;font-style: normal;font-weight: 400;line-height: 20px; /* 125% */}

h3.uc-title {
	border-radius: 4px;
	position: absolute;
	bottom: 8px;
	left: 8px;
	background: #fff;
	z-index: 99;
	width: fit-content;
	padding: 4px 8px;
	color: var(--900, #141414);
	font-family: "SF Pro Display";
	font-size: 12px;
	font-style: normal;
	font-weight: 400;
	line-height: 16px; /* 133.333% */
}

/* только для второй карусели */
#ucCarouselPanorama .uc-track{
	margin-left: 0 !important;
	margin-right: 0 !important;
}
#ucCarouselPanorama .uc-viewport{
	padding-left: 0 !important;
	padding-right: 0 !important;
}

/* базовый аспект (работает на всех ширинах) */
#ucCarouselPanorama .uc-media{
	aspect-ratio: 16/10 !important;
	height: auto !important;
}

/* на десктопе: одна карточка, макс-высота 340px */
@media (min-width: 960px){
	#ucCarouselPanorama .uc-media{
		max-height: 340px;          /* лимит высоты */
		overflow: hidden;           /* чтобы не вылезало */
	}
	#ucCarouselPanorama .uc-media img{
		width: 100%;
		height: 100%;
		display: block;
		object-fit: cover;          /* обрезка по краям */
	}
}

.uc-nav{pointer-events:auto}
.uc-btn {
	width: 8px !important;
	height: 8px !important;
	background: transparent !important;
	border-radius: 4px !important;
	border: 1px solid #DADADA !important;
	pointer-events:auto; 
	position:absolute; 
	top:50%; 
	color: #151411;
	transform:translateY(-50%); 
	padding: 10px 13px 14px 11px;
	/*backdrop-filter:blur(8px);*/ 
	cursor:pointer; transition: all 0.4s;
}
.uc-btn svg{ width:12px; height:12px; fill:#151411}
.uc-btn:hover{background:#f5f5f5 !important;}
.uc-prev {left: -80px}
.uc-next{right:8px}


/* Адаптив: 1 / 2 / 3 колонки */
@media (min-width:480px){ .uc-slide{width:50%} }
@media (min-width:960px){ .uc-slide{width:33.3333%} }

/* Узкие экраны */
@media (max-width:360px){
	.uc-body{padding:10px 12px}
	.uc-title{font-size:12px}
	.uc-btn{width:23px; height:23px}
	/*.uc-carousel { width: 320px !important; }
	.uc-slide { width: 50% !important; }*/
}

/* Навигация */
.uc-nav {
    display: none;
	position: absolute !important;
	top: 12px !important;
	right: 0px !important;
}


/* Конец карусели */

@media(max-width: 981px) {
    .header-projects { 
    	font-size: 24px;
    }
    .top-container-projects {
    	padding-bottom: 8px;
    }
}


@media(max-width: 640px) {
    .material-block:last-child {
        margin-top: 12px;
    }
    .text {
    	padding: 16px 16px 0 16px;
    }
    .header-projects { 
    	font-size: 22px;
    }
    .t-popup__container.t-width.t-width_6.t-popup__container-animated {
        height: auto;
        display: flex;
        align-items: center;
    }
}

@media(min-width: 981px) {
    .t280__menu__content.t280__col-12 {
        padding-top: 32px;
    }
}

@media(max-width: 981px) {
    .t280__menu__content.t280__col-12 {
        padding-top: 12px;
    }
}