@media all and (max-width:1200px){
}

@media all and (max-width:992px){
}

@media all and (max-width:768px){
	.m-tog-menu{
		display: flex;
		position: fixed;
		width: 56%;
		background: var(--title-color);
		height: 100%;
		z-index: 2;
		right: -430px;
		transition: right 0.4s ease;
		border-top-left-radius: 16px;
		border-bottom-left-radius: 16px;
		flex-direction: column;
		justify-content: center;
		padding: 15px;
		grid-gap: 35px;
	}
	.m-tog-menu.active {
	  right: 0;
	}
	.m-tog{
		display: flex;
		width: 40px;
		height: 40px;
		background: var(--btn-color);
		justify-content: center;
		align-items: center;
		border-radius: 4px;
		position: relative;
		transition: all 0.4s ease;
		z-index: 2;
	}
	.proiz-head{
		grid-template-columns: 1fr;
	}
	.m-tog.active{
		background: var(--accent-color);
	}
	.m-tog span{
		background: #fff;
		width: 20px;
		height: 1.5px;
		border-radius: 4px;
		transition: all 0.4s ease;
	}
	.m-tog::before{
		content: '';
		position: absolute;
		left: 0;
		top: 13px;
		background: #fff;
		width: 20px;
		height: 1.5px;
		right: 0;
        margin: auto;
		border-radius: 4px;
		transition: all 0.4s ease;
	}
	.m-tog.active::before{
		transform: translate(0px, 6px) rotate(45deg);
	}
	.m-tog.active span{
		transform: translate(0px, 0px) rotate(-45deg);
	}
	.m-tog.active::after{
		display: none;
	}
	.m-tog::after{
		content: '';
		position: absolute;
		bottom: 13px;
		left: 0;
		background: #fff;
		width: 20px;
		height: 1.5px;
		right: 0;
        margin: auto;
		border-radius: 4px;
		transition: all 0.4s ease;
	}
	.m-tog-menu[style*="display: block;"]{
		display: flex !important;
	}
	.promo-btns .btn:first-child{
		border: 1px solid var(--title-color);
    	color: var(--title-color);
		background: transparent;
	}
	.promo-btns .btn:last-child{
		background-color: var(--btn-color);
		color: #fff;
	}
	.promo-btns .btn:last-child::before {
		background: url(../img/btn-price-wh.svg) center no-repeat;
		background-size: contain;
	}
	.promo{
		padding-bottom: 165px;
		margin-top: 0;
	}
	.promo .container{
		padding: 0;
	}
	.promo-wr{
		padding: 20px 15px;
	}
	h1{
		font-size: 35px;
	}
	.promo-btns{
		position: absolute;
		bottom: -200px;
		display: flex;
		flex-direction: column;
		width: 100%;
		grid-gap: 20px;
	}
	.btn-price{
		justify-content: center;
	}
	.cats-wr{
		grid-template-columns: 1fr;
	}
	h2{
		font-size: 20px;
	}
	.cats-img{
		grid-column: unset;
		grid-row-start: unset;
		grid-row-end: unset;
		padding: 0;
		height: 358px;
		margin: 0;
	}
	.cats-list a{
		font-size: 18px;
	}
	.cats-cont .btn{
		width: 100%;
	}
	.proiz-desc-wr{
		position: absolute;
        bottom: 77px;
		width: fit-content;
		left: 0;
		margin: 0 15px;
	}
	.proiz-sec .proiz-head .btn{
		margin-top: 15px;
	}
	.proiz-wr-c{
		overflow-x: scroll;
	}
	.proiz-wr{
		display: flex;
		grid-gap: 15px;
    	width: max-content;
		margin-top: 10px;
	}
	.proiz-item{
		grid-gap: 15px;
		padding: 10px;
	}
	.proiz-sec .btn.btn-price{
		margin: 200px 0 0;
    	width: 100%;
	}
	.cont-div{
		display: none;
	}
	.nav-soc a{
		display: none;
	}
	.nav-soc a:has(svg){
		display: flex;
	}
	.nav-soc a svg{
		width: 40px;
		height: 40px;
	}
	#metall .container{
		padding: 0;
	}
	.metall-wr{
		padding: 20px 15px 100px;
	}
	.metall-gal{
		overflow-x: scroll;
	}
	.metall-gal-inn{
		width: max-content;
    	grid-gap: 15px;
	}
	.metall-gal-item{
		max-width: 100%;
	}
	.metall-wr .btn{
		position: absolute;
		bottom: 25px;
		width: 93.8%;
		left: 0;
		right: 0;
		margin: 0 15px;
	}
	.metall-head{
		position: unset;
	}
	.about-sec .container{
		display: grid;
	}
	.about-desc{
		width: 100%;
		column-count: 1;
	}
	.about-img{
		grid-row: 2;
		height: 203px;
	}
	.partners-slider::after{
		opacity: 0;
	}
	.partners-slider2::after{
		opacity: 0;
	}
	.partners-item{
		height: 60px;
	}
	#contacts .container{
		padding: 0;
	}
	.contacts-wr{
		padding: 20px 15px;
	}
	.contacts-inn{
		grid-template-columns: 1fr;
	}
	.contacts-title{
		font-size: 18px;
		margin-bottom: 10px;
	}
	.contacts-item:nth-child(7n+6){
		grid-column-start: unset;
		grid-column-end: unset;
		grid-row: 2;
	}
	.contacts-item:last-child{
		grid-column: unset;
		grid-row-start: unset;
		grid-row-end: unset;
	}
	form .btn{
		margin-top: 15px;
	}
	footer{
		padding: 20px 15px;
	}
	.foot-wr{
		grid-template-columns: 1fr 1fr;
	}
	.foot-nav{
		grid-row: 1;
		flex-direction: column;
		grid-column-start: 1;
		grid-column-end: 3;
		align-items: center;
		text-align: center;
		grid-gap: 30px;
	}
	footer .container{
		padding: 0;
	}
	.nav-div{
		padding: 20px 0;
		display: grid;
		grid-template-columns: 1fr auto auto;
		grid-gap: 15px;
	}
}


@media all and (max-width:420px){
	.m-tog-menu{
		right: -300px;
	}
}


@media all and (max-width:370px){
}


@media all and (max-width:320px){
}