
@media screen and (max-width: 1600px){
	#contacts .ct__data{padding: 30px}
}

@media screen and (max-width: 1200px){
	.section{padding: 60px 0}
	article .go__back{position: absolute; top: 0; left: 0;}
	.bt .bt__note{text-transform: none;}
	.bt .bt__title{font-size: 42px;}


	.btn-white-tr{height: 48px}

	.btn-white{height: 48px; padding: 0 20px; font-size: 14px;}


	.btn-blue{height: 64px; padding: 0 25px; font-size: 16px}


	header{padding: 10px 0}
	header nav{display: none; position: fixed; top: 81px; left: 0; width: 100%; height: calc(100% - 80px); background: #fff; z-index: 302; overflow-y: auto; box-sizing: border-box; padding: 20px 30px}
	header nav .mobile{display: block;}
	header nav .mobile img{border-radius: 12px; width: 100%; height: 220px; object-fit: cover; margin-bottom: 40px}
	header nav ul{gap: 0; flex-wrap: wrap;}
	header nav ul li{width: 100%;}
	header nav ul li a{display: block; padding: 12px 12px; font-size: 20px; line-height: 110%; font-weight: 500; letter-spacing: 0.02em; text-align: center; text-transform: none; color: #292725!important; opacity: 1!important}
	header .logo{position: relative; left: 0; top: 0; display: flex;}
	header .logo a{display: flex;}
	header .lang{position: relative; top: 0; right: 0;}
	header .container{justify-content: space-between;}
	header .data{gap: 10px;}
	header .pull{display: flex; align-items: center; justify-content: center; width: 48px; height: 48px; border-radius: 50%; box-sizing: border-box; background: #F4F4F4}
	header#transparent .pull{background: rgba(255, 255, 255, 0.1);}
	header#transparent .pull svg path{stroke: #fff;}


	#promo{margin-bottom: 60px}
	#promo .data{padding-bottom: 80px}
	#promo h1{font-size: 70px}
	#promo p{font-size: 18px}


	#whoweare .image{width: 100%; margin-bottom: 30px}
	#whoweare .text{width: 100%;}


	#investments .data{padding: 20px 10px 40px}
	#investments .item{width: 100%; margin-bottom: 40px}

	.product__item img{height: 380px}
	.product__item .product__data{padding: 0 30px 30px 30px}
	.product__item .product__title{font-size: 48px; max-width: calc(100% - 170px)}


	#values .item{width: 100%; padding: 50px}
	#values .item:first-child{padding: 0}


	#news .swiper{overflow-x: inherit;}
	#news .swiper-slide{width: 420px}


	#breadcrumbs{padding: 100px 0 20px}


	#promo__page .image img{height: 480px}
	#promo__page .note{padding: 40px 0}
	#promo__page .note h1{width: 100%; margin-bottom: 10px; font-size: 48px}
	#promo__page .note .text{font-size: 18px; max-width: 100%; width: 100%;}


	#about .advantages{padding: 60px 0;}
	#about .content{font-size: 24px;}
	#about .content p{margin-bottom: 40px; font-size: 15px;line-height: 150%;}
	#about .advantages p{font-size: 18px}


	#investments.investments__about .data{padding: 40px;}
	#investments.investments__about .data .content{margin-bottom: 20px; font-size: 24px;}
	#investments.investments__about .data .grid{grid-template-columns: repeat(1, 1fr);}
	#investments.investments__about .data .grid .it{border: none; border-bottom: 1px solid rgba(41, 39, 37, 0.1); padding: 20px 0;}
	#investments.investments__about .data .grid .it:last-child{border-bottom: none;}


	#whoweare.right .image{order: 0}
	#whoweare.right .text{order: 1}


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


	#popups .popup__window{padding: 40px;}
	#popups .popup__window .image{width: 200px;}
	#popups .popup__window .image img{height: 200px}
	#popups .popup__window .info{width: calc(100% - 220px)}
	#popups .popup__window .info .name{font-size: 22px}
	#popups .popup__window .info .description{margin-top: 15px; padding-top: 15px; font-size: 16px}


	#excellence .grid{grid-template-columns: repeat(1, 1fr);}
	#excellence .item{height: auto; padding: 30px}
	#excellence .item .count{font-size: 62px}
	#excellence .item .text{position: relative; bottom: 0; left: 0; padding: 0; margin-top: 30px}


	#ventures .items{grid-template-columns: repeat(2, 1fr);}
	#ventures .item{height: 260px}

    .photo-gallery {
        grid-template-columns: repeat(3, 1fr); /* 2 columns on mobile */
		display: grid;
    }


	#news .grid{grid-template-columns: repeat(2, 1fr);}


	#contacts{padding: 20px 0 60px}
	#contacts .ct__data{padding: 40px 30px}
	#contacts .container{padding: 0}
	#contacts .inn{padding: 40px}
	#contacts .inn .text{width: 100%; margin-bottom: 30px}
	#contacts .inn .form{width: 100%; max-width: 100%; padding: 40px}
	#contacts .text h1{font-size: 70px}


	article .go__back{position: relative; margin-bottom: 20px}


	footer .product__item img{height: 360px}
	footer .product__item .product__title{font-size: 70px}
}











@media screen and (max-width: 767px){
	.container,.container__max{padding: 0 12px}

	body{font-size: 15px}

	.bt .bt__note{margin-bottom: 10px; font-size: 14px}
	.bt .bt__title{font-size: 32px; margin-bottom: 15px}

	.btn-white-tr,.btn-blue,.btn-black{height: 48px; font-size: 14px}


	.section{padding: 40px 0;}

	header{box-sizing: border-box; height: 69px}
	header .logo svg{width: 68px; height: 48px}
	header nav{padding: 12px; top: 69px; height: calc(100% - 69px)}
	header nav .mobile img{height: 150px}


	#promo{margin-bottom: 40px}
	#promo .data{padding-bottom: 250px}
	#promo h1{font-size: 54px;}
	#promo p{font-size: 16px;}


	#whoweare .image{margin-bottom: 20px}
	#whoweare p{font-size: 15px; line-height: 150%;}
	#whoweare .btn{width: 100%;}


	#investments .container{padding: 0}
	#investments .data{padding: 20px 20px 30px}
	#investments .block__title{padding: 0 0 20px; gap: 10px; margin-bottom: 30px}
	#investments .block__title svg{order: 0; width: 52px; height: 36px}
	#investments .block__title span{order: 1; width: 100%; font-size: 16px}
	#investments .item .title{margin-bottom: 15px; font-size: 26px}
	#investments .item p{font-size: 15px; line-height: 150%;}
	#investments .content p{font-size: 15px;line-height: 150%;}

	.product__item .product__data{padding: 0 16px 20px}
	.product__item .product__data .product__title{max-width: 100%; width: 100%; font-size: 36px; margin-bottom: 20px; font-weight: 600;}
	.product__item .product__data .btn{width: 100%;}


	#values .bt .bt__title{margin-bottom: 0}
	#values .item{padding: 20px;}
	#values .item .icon{margin-bottom: 20px; width: 60px;}
	#values .item .icon img{width: 60px; height: 60px; object-fit: cover;}
	#values .item .title{margin-bottom: 10px; font-size: 20px;}
	#values .item p{font-size: 15px; line-height: 150%;}


	#news .bt{max-width: 100%; width: 100%; margin-bottom: 20px}
	#news .flex .btn{width: 100%;}
	#news .flex{margin-bottom: 30px}
	#news .swiper-slide{padding: 20px 20px 60px; width: 320px}
	.news__item .title{font-size: 20px}
	.news__item .date{left: 20px; bottom: 20px; font-size: 14px;}


	#breadcrumbs{padding: 90px 0 20px}
	article{padding: 68px 0 30px 0}


	#promo__page .image img{height: 280px}
	#promo__page .note{padding: 20px 0;}
	#promo__page .note h1{font-size: 36px; max-width: 90%;}
	#promo__page .note .text{font-size: 16px;}


	#about .content{font-size: 20px;}
	#about .content img{min-height: 220px}
	#about .advantages{padding: 20px 0; margin: 40px 0 0;}
	#about .advantages .item{width: 100%; margin-bottom: 15px}
	#about .advantages .item:last-child{margin-bottom: 0}
	#about .advantages img{margin-bottom: 20px; width: 60px}
	#about .advantages .title{font-size: 26px; margin-bottom: 10px}
	#about .advantages p{font-size: 15px}


	#investments.investments__about .data{padding: 20px}
	#investments.investments__about .data .content{font-size: 20px}
	#investments.investments__about .data .it img{width: 60px}
	#investments.investments__about .data .it .title{font-size: 18px}
	#investments.investments__about .data .it p{font-size: 15px}


	#team .bt__note{margin-bottom: 30px}
	#team .grid{grid-template-columns: repeat(1, 1fr);}
	#team .item img{height: 355px}


	#popups .popup__window{padding: 60px 20px 20px}
	#popups .popup__window .image{width: 100%; margin-bottom: 20px}
	#popups .popup__window .info{width: 100%}
	#popups .popup__window .info .description{font-size: 15px}

    .photo-gallery {
        grid-template-columns: repeat(2, 1fr); /* 2 columns on mobile */
		display: grid;
    }


	#excellence .item{padding: 20px;}
	#excellence .item .text{margin-top: 20px}
	#excellence .bt,#ventures .bt{margin-bottom: 30px}


	#news .grid,#ventures .items{grid-template-columns: repeat(1, 1fr);}
	#news.section__page .news__item{padding: 20px}
	#news.section__page .news__item .date{position: relative; bottom: 0; left: 0; padding: 20px 0 0;}


	.pagination a,.pagination span{font-size: 15px; max-width: 44px; height: 44px; font-weight: normal;}


	article .main__image{margin-bottom: 20px}
	article .main__image img{height: 240px}
	article .content{font-size: 15px;}
	article .content h1{font-size: 36px;}
	article .content .gallery img{width: 100%; height: 350px}
	article.section_page{padding-top: 40px}


	#contacts .ct__data{padding: 20px 12px;}
	#contacts .inn{padding: 30px 20px}
	#contacts .text h1{font-size: 54px;}
	#contacts .text .ct{font-size: 16px}
	#contacts .inn .form{padding: 30px 20px}




	footer .top{padding: 20px 0;}
	footer .logo{display: none;}
	footer .bottom nav ul{flex-wrap: wrap; justify-content: center; gap: 0}
	footer .bottom nav ul li a{display: block; padding: 10px 20px}
	footer .product__item .product__data .product__title{font-size: 54px; font-weight: 500;}
	footer .copyright nav{order: 0; width: 100%}
	footer .copyright nav ul{justify-content: center; flex-wrap: wrap; gap: 20px}
	footer .copyright span{width: 100%; text-align: center; order: 1; margin-top: 15px}
}
@media (max-width: 480px) {
    .photo-gallery {
        grid-template-columns: 1fr; /* 1 column on very small screens */
    }
}