@font-face{
	src:url("../fonts/IRANYekanXVF.woff");
	font-family: "iranYekan";
}
@font-face{
	src:url("../fonts/IRANYekanXVF.woff");
	font-family: "homa";
}
 html {
  scroll-behavior: smooth;
}
*,
*::before,
*::after {
    margin: 0;
    padding: 0; 	
	box-sizing: border-box;
    box-sizing: border-box; /* باعث میشه که padding و border در ابعاد عنصر محاسبه نشه */
	font-family: 'homa';
}
p , li ,a {
	line-height: 28px;
	padding-top: 2px;
}

/* حذف دکمه‌های بالا و پایین اسکرول */
::-webkit-scrollbar-button {
  display: none;
}

/* خود نوار اسکرول */
::-webkit-scrollbar {
  width: 4px;  /* باریکش کن */
  background: transparent;  /* حذف بکگراند */
}

/* قسمت قابل حرکت (thumb) */
::-webkit-scrollbar-thumb {
  background-color: #00bfff;  /* آبی روشن */
  border-radius: 10px;
}

/* برای حالت hover */
::-webkit-scrollbar-thumb:hover {
  background-color: #00bfff;
}

/* برای بخش غیر قابل حرکت (track) */
::-webkit-scrollbar-track {
  background: transparent;
}
html {
  scrollbar-color: #00bfff transparent; /* thumb - track */
  scrollbar-width: none;
}
.scrolling {
    overflow-x: auto;
    overflow-y: hidden;
    white-space: nowrap;

    /* مخفی کردن اسکرول در فایرفاکس */
    scrollbar-width: none;

    /* مخفی کردن اسکرول در IE و Edge قدیمی */
    -ms-overflow-style: none;
}

/* مخفی کردن اسکرول در Chrome و Safari */
.scrolling::-webkit-scrollbar {
    display: none;
}
.scrolling.dragging {
    cursor: grabbing;
    user-select: none;
}
:root{
	--backgrund:#f2f2f2;
	--white:#FFFFFF;
	--blue:#1f6bff;
	--green:#11B856;
	--red:#E90544;
	--yelow:#F6FF00;
	--dark-blue:#204D88;
	--black:#1d1d1d;
	--gray:#5e5e5e;
	--kerem:#E5CDB2;
	--mesi:#C04337;
	--black-opacity:RGBA(0, 0, 0, 50);
		--blue-30: rgba(55, 134, 238, 0.3);
		--green-30: rgba(17, 184, 86, 0.3);
		--red-30: rgba(233, 5, 68, 0.3);
		--yellow-30: rgba(246, 255, 0, 0.3);
		--dark-blue-30: rgba(32, 77, 136, 0.3);
		--black-30: rgba(29, 29, 29, 0.3);
		--gray-30: rgba(118, 118, 118, 0.3);
		--kerem-30: rgba(229, 205, 178, 0.3);
		--mesi-30: rgba(192, 67, 55, 0.3);

}
a{
	text-decoration: none;
}
body{
	direction: rtl;
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;padding-bottom: 0px;
	gap: 10px;
	padding-bottom: 00px;
}
input:focus {
    outline: none; /* حذف حاشیه (outline) هنگام فوکوس */
    border: none;  /* حذف حاشیه (border) اگر اضافه شده باشه */
}

header{
	display: flex;
	align-items: center;
	justify-content: flex-start;
	width: 100%;
	max-height: fit-content;
	padding: 2px 10%;
	background-color: var(--white);
	flex-wrap: wrap;
	position: sticky;
	top: 0;
	z-index: 1000;
}
header.tablet{
	display: none;
	align-items: center;
	justify-content: flex-start;
	width: 100%;
	padding: 2px 10%;
	background-color: var(--white);
	flex-wrap: wrap;
	position: sticky;
	top: 0;
}
.header-ful{
	display: flex;
	align-items: center;
	justify-content: space-between;
	width: 100%;
	height: 62px;
	padding: 0;
	background-color: var(--white);
	gap: 10px;
	z-index: 1000;
}
.header-btn{
	display: flex;
	align-items: center;
	justify-content: space-between;
	width: 100%;
	height: 62px;
	padding: 0;
	background-color: var(--white);
	gap: 10px;
	z-index: 900;
	 transition: left .3s ease;
}
.menu-btns{
	display: flex;
	width: auto;
	align-items: center;
	justify-content: space-between;
	padding: 0;
	background-color: var(--white);
	gap: 10px;
}
.menu-btn{
	display: flex;
	align-items: center;
	justify-content: flex-start;
	padding: 6px 10px;
	border-radius: 9px;
	gap: 10px;
	color: var(--gray);
	border: 1px solid var(--white);
	transition: all .15s ease;
}
.menu-btn:hover{
	color: var(--blue);
	border-bottom: 2px solid var(--blue);
	border-radius: 0;
}
.red:hover{
	color: var(--red);
	border-bottom: 2px solid var(--red);
}
.menu-btn img{
	width: 25px;
}
.active-btn{
	display: flex;
	align-items: center;
	justify-content: flex-start;
	padding: 6px 10px;
	border-radius: 9px;
	gap: 10px;
	color: var(--white);
	background-color: var(--blue);
	transition: all .15s ease;
}
.active-btn:hover{
	padding: 6px 30px;
}
.header-logo{
	width: 195px;
	height: 35px;
	line-height: 0;
	
}
.header-logo img{
	width: 100%;
}
.serch-box{
	width: calc(45% - 195px);
	height: 45px;
	display: flex;
	align-items: center;
	background-color: var(--backgrund);
	border-radius: 5px;
	padding: 8px 10px 5px 10px;
}
 .serch-box input{
	width: 100%;
	display: flex;
	border: none;
	height: 100%;
	font-family: 'homa';
	font-size: 15px;
	background: transparent;
	margin-top: -5px;
	padding: 0 10px;
 }
.save-product{
	min-width: 45px;
	height: 45px ;
	display: flex;
	align-items: center;
	justify-content: center;
	border: 1px solid var(--white);
	border-radius: 5px;
	transition: all .3s ease;
}
.save-product img{
	max-width: 45px;
	width: 100%;
	padding: 5px;
}
.save-product p{
	color: var(--blue);
	font-size: 15px;
}
.login{
	min-width: 160px;
	height: 45px ;
	display: flex;
	align-items: center;
	justify-content: center;
	border: 1px solid var(--backgrund);
	border-radius: 5px;
	gap: 5px;
	transition: all .3s ease;
}
.login img{
	max-width: 45px;
	width: 100%;
	padding: 5px;
}
.login p{
	color: var(--blue);
	font-size: 15px;
	display: flex;
}
.lang{
	min-width: 45px;
	height: 45px ;
	display: flex;
	align-items: center;
	justify-content: center;
	border-right: 1px solid var(--backgrund);
	border-radius: 5px;
	gap: 5px;
	transition: all .3s ease;
}
.lang img{
	max-width: 45px;
	width: 100%;
	padding: 5px;
}
.banener-box{
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
}
.banener-box a.banner{
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 100%;
	background-color: var(--blue);
	color: var(--white);
	padding: 6px ;
	font-size: 20px;
	background-image: url("../image/deal-pattern.svg");
}
.header-fasele{
	width: calc(50% - 270px);
}
.tablet{
	display: none;
	align-items: center;
	justify-content: flex-start;
	background-color: var(--white);
	flex-wrap: wrap;
	position: sticky;
	top: 0;
}
.header-tablet{
	display: none;
}
.slider-box{
      position: relative;
      width: 100%;
	 display: flex;
	 margin-top: 00px;
	 z-index: 10;
    }



    .swiper {
      width: 80%;
      height: 100%;
		display: flex;
		align-items: center;
		justify-content: center;
    }

    .swiper-slide {
     	width: 100%;
		padding: 0 20px;
		border-radius: 10px;
		overflow: hidden;
		display: block;
		flex-direction: row;
		align-items: center;
		justify-content: center;
		
    }
	.swiper-slide img{
		width: 100%;
	}
	
	.digi-story{
		display: flex;
		align-items: center;
		justify-content: flex-start;
		gap: 30px;
		width: 80%;
		
		padding: 10px 0%;
		overflow-x: auto;
	}
	.digi-story .story-item{
		min-width: 85px;
		width: 85px;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: flex-start;
		padding: 0px;
	}
	.digi-story .story-item img{
		min-width: 100%;
		width: 100%;
		padding: 2px;
		border-radius: 50%;
		background:var(--white);
		border: 2px solid var(--blue);
	}
	.digi-story .story-item p{
		font-size: 12px;
		color: var(--black);
	}
	.header-bottom{
		display: none;
	}
	.product-continer{
		width: 80%;
		margin-bottom: 20px;
		background-color: var(--blue);
		margin-top: 20px;
		border-radius: 40px;
		display: flex;
		align-items: flex-start;
		justify-content: flex-start;
		padding: 10px;
		overflow-x: auto;
		gap: 10px;
		background-image:
        linear-gradient(
            rgba(0, 85, 255, 0.85),
            rgba(0, 85, 255, 0.85)
        ),
        url("../image/ChatGPT Image Jun 1, 2026, 09_40_38 AM.png");

    background-repeat: repeat;
    background-size: 100px;
    background-position: center;
	}
	.product-card{
		display: flex;
		flex-direction: column;
		align-items: flex-start;
		justify-content: flex-start;
		max-width: 240px;
		width: calc((100% - 10px) / 2);
		min-width: 240px;
		
		background-color: var(--white);
		border-radius: 10px;
		
		padding: 5px;
	}
	.product-label{
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: flex-start;
		max-width: 180px;
		width: calc((100% - 10px) / 2);
		min-width: 180px;
		gap: 10px;
		background: transparent;
		border-radius: 10px;
		
		padding: 5px;
	}
	.product-label a{
		color: var(--white);
		display: flex;
		justify-content: center;
		align-items: center;
		flex-direction: column;
	}
	.product-label a img{
		max-width: 110px;
		width: 100%;
		border-radius: 10px;
	}
	.product-card a{
	padding: 0;
	box-sizing: border-box;
	}
	.product-card a img{
		width: 100%;
		border-radius: 10px;
	}
	.product-card h2{
		padding-right: 5px;
	font-size: 16px;
	font-weight: 400;
	color: var(--black);
    text-overflow: ellipsis;
	}
	.product-card .offer{
		width: 100%;
		padding: 0 0px;
		display: flex;
		align-items: center;
		justify-content: center;
		gap: 5px;
		
	}
	.product-card .price{
		width: 100%;
		padding: 0 0px;
		display: flex;
		align-items: center;
		justify-content: center;
		gap: 5px;
		
	}
	.product-card .offer p
	{
		font-size: 15px;
		font-weight: 200;
	}
	.product-card .price p
	{padding: 0px 8px;
		border-radius: 5px;
		line-height: 20px;
		font-size: 15px;
		font-weight: 200;
		color: var(--gray);
	}
	.product-card .offer p:first-child
	{
		display: flex;
		align-items: center;
		color: var(--white);
		background-color: var(--blue);
		padding: 3px 8px  2px 8px;
		border-radius: 10px;
		line-height: 20px;
	}
	
	.product-card .offer p:last-child
	{
		
		color: var(--gray);
		text-decoration: line-through;
		padding: 0px 8px;
		border-radius: 5px;
		line-height: 20px;
	}
	.weblog-continer{
		width: 80%;
		
		background-color: var(--green
		);
		
		border-radius: 10px;
		display: flex;
		align-items: flex-start;
		justify-content: flex-start;
		padding: 10px;
		overflow-x: auto;
		gap: 10px;
	}
	.weblog-card{
		display: flex;
		flex-direction: column;
		align-items: flex-start;
		justify-content: flex-start;
		max-width: 350px;
		width: calc((100% - 10px) / 2);
		min-width: 350px;
		overflow: hidden;
		background-color: var(--white);
		border-radius: 10px;
		
		padding: 5px;
	}
	.weblog-label{
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: flex-start;
		max-width: 180px;
		width: calc((100% - 10px) / 2);
		min-width: 180px;
		gap: 10px;
		background: transparent;
		border-radius: 10px;
		
		padding: 5px;
	}
	.weblog-label a{
		color: var(--white);
		display: flex;
		justify-content: center;
		align-items: center;
		flex-direction: column;
	}
	.weblog-label a img{
		max-width: 110px;
		width: 100%;
		border-radius: 10px;
	}
	.weblog-card a{
	padding: 0;
	box-sizing: border-box;
	}
	.weblog-card a img{
		width: 100%;
		border-radius: 10px;
	}
	.weblog-card h2{
		padding-right: 5px;
	font-size: 16px;
	font-weight: 400;
	color: var(--black);
	}
	.weblog-card .offer{
		width: 100%;
		padding: 0 05px;
		display: flex;
		align-items: center;
		justify-content: center;
		gap: 5px;
		
	}
	.weblog-card .offer a{
		width: 100%;
		padding: 5px 15px;
		color: var(--white);
		background-color: var(--green);
		border-radius: 10px;
		display: flex;
		align-items: center;
		justify-content: center;
		
	}
	.weblog-card .price{
		width: 100%;
		padding: 0 0px;
		display: flex;
		align-items: center;
		justify-content: center;
		gap: 5px;
		
	}
	.weblog-card .offer p
	{
		font-size: 15px;
		font-weight: 200;
	}
	.weblog-card .price p
	{padding: 0px 8px;
		border-radius: 5px;
		line-height: 20px;
		font-size: 15px;
		font-weight: 200;
		color: var(--gray);
	}
	
	
	.weblog-card .offer p:last-child
	{
		color: var(--gray);
		
		padding: 0px 0px;
		border-radius: 5px;
		line-height: 20px;
	}
	.comment-continer{
		width: 80%;
		background-color: var(--white);
		border-radius: 10px;
		display: flex;
		align-items: flex-start;
		justify-content: flex-start;
		padding: 10px;
		overflow-x: auto;
		gap: 20px;
	}
	.comment-card{
		display: flex;
		flex-wrap: wrap;
		align-items: flex-start;
		justify-content: flex-start;
		min-width: 490px;
		width: calc((100% - 40px) / 3);
		
		overflow: hidden;
		background-color: var(--backgrund);
		border-radius: 30px 30px 30px 5px;
		padding: 5px;
		gap: 5px;
		border: 1px solid var(--gray);
	}
	.comment-card .user-info{
		width: calc(100% - 75px);
		display: flex;
		flex-direction: column;
		align-items: flex-start;
		justify-content: flex-start;
		gap: 0px;
		padding:5px ;
	}
	.comment-card .user-info p.user-name {
		font-size: 17px;
		font-weight: 500;
	}
	.comment-card  img{
		width: 70px;
		border-radius: 10px 25px 10px 10px;
	}
	.user-comment{
		width: 100%;
		text-align: justify;
		padding: 0px;
	}
	.user-comment p.comment-header{
		font-size: 17px;
		color: var(--black);
		font-weight: 500;
		text-align: justify;
		padding: 5px;
	}
	.user-comment p.comment-text{
		width: 100%;
		font-size: 14px;
		color: var(--gray);
		font-weight: 400;
		text-align: justify;
		padding: 5px;
		word-wrap: break-word;
		overflow-wrap: break-word;
		white-space: normal;
	}
	
	.digi-club{
		width: 70%;
		display: flex;
		align-items: center;
		justify-content: flex-start;
	}
	.digi-club img{
		padding: 30px;
		max-width: 700px;
		width: 50%;}
		.cunter{
			width: 100%;
			display: flex;
			align-items: center;
			justify-content: flex-start;
			gap: 10px;
			margin-top: 20px;
		}
		.cunter-item{
			width: calc((80% - 10px ) / 2);
			display: flex;
			align-items: center;
			justify-content: center;
			gap: 10px;
    		box-shadow: 0 10px 40px rgba(0, 0, 0, 0.08);
			border-radius: 14px;
			background-color: var(--white);
			padding: 5px 12px;
		}
		.cunter-item p span{
			color: var(--blue);
			font-size: 18px;
			font-weight: 700;
		}
		.cunter-item img{
			width: 50px;
			display: flex;
			padding: 0;
		}
	.digi-club-info h1{
		line-height: 50px;
		text-align: right;
	}
	.digi-club-info{
		width: calc(100% - 550px);
		display: flex;
		flex-direction: column;
		align-items: flex-start;
		justify-content: flex-start;
		padding: 10px;
		text-align: justify;
	}
	.digi-info-btn{
		display: flex;
		align-items: center;
		justify-content: flex-start;
		gap: 10px;
		padding: 20px 0;
	}
	.digi-info-btn a{
		display: flex;
		align-items: center;
		justify-content: center;
		padding: 5px 20px ;
		border-radius: 10px;
		font-size: 16px ;
		font-weight: 700;
	}
	.digi-info-btn a#digi-1{
		background-color: var(--white);
		border: 2px solid var(--blue);
		color: var(--blue);
	}
	.digi-info-btn a#digi-2{
		background-color: var(--blue);
		border: 2px solid var(--blue);
		color: var(--white);
		font-weight: 300;
	}
	.catgoory-continer{
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: flex-start;
		width: 70%;

	}
	.catgoory-continer .catgoory-text{
		display: flex;
		align-items: center;
		justify-content: flex-start;
		
	}
	.catgoory-continer .catgoory-text p
	{
		font-size: 20px;
		font-weight: 500;
		align-items: center;
		color: var(--black);
		text-align: center;

	 }
	 .catgoory-continer .catgoory-item{
		width: 100%;
		display: flex;
		flex-wrap: wrap;
		align-items: flex-start;
		justify-content: center;
		gap: 30px;
		padding: 10px;
	 }
	 .catgoory-continer .catgoory-item a.catgoory{
		width: calc((100% - 20px) / 3  );
		max-width: 140px;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: flex-start;
		gap: 5px;
		padding: 5px;
	 }
	 .catgoory-continer .catgoory-item a.catgoory img{
		width: 100%;
	border-radius: 30px;}
	.catgoory-continer .catgoory-item a.catgoory p{
        text-align: center;
		font-size: 14px;
		font-weight: 400;
		color: var(--black);
	}
	.why-digi{
		display: flex;
		align-items: flex-start;
		justify-content: flex-start;
		width: 70%;
		border-radius: 20px;
		padding: 15px;
		margin-top: 20px;
		margin-bottom: 10px;
		gap: 20px;
	}
	.why-digi .why-text{
		width: 50%;
		display: flex;
		flex-direction: column;
		align-items: flex-start;
		justify-content: flex-start;
		text-align: justify;

	}
	.why-digi .why-items{
		width: 50%;
		display: flex;
		align-items: flex-start;
		justify-content: flex-start;
		text-align: justify;
		flex-wrap: wrap;
		gap: 20px;
	}
	.why-digi .why-items .why-item {
		height: 100%;
		width: calc((100% - 20px) / 2);
		display: flex;
		flex-direction: column;
		align-items: flex-start;
		justify-items: flex-start;
		gap: 5px;
		background-color: var(--backgrund);
		border: 1px solid var(--gray);
		padding: 15px;
		border-radius: 10px;
		transition: all .3s ease-in-out;
	}
	.why-digi .why-text img{
		width: 80%;
		
	}
	.why-digi .why-text h2{
		color: var(--black);
		font-size: 28px;
		
	}
	
	.why-digi .why-items .why-item:hover {
		
		background-color: var(--blue);
		border: 1px solid var(--blue);
		color: var(--white);
		
	}
	.why-digi .why-items .why-item img{
		width: 60px;
		padding: 5px ;
		background: var(--white);
		border-radius: 8px;
		border: 1px solid var(--gray);
	}
	.market-plans{
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: flex-start;
		width: 80%;
		padding: 10px ;
		border-radius: 10px;
		background-color: var(--blue);

	}
	.market-plans .market-plans-text{
		display: flex;
		align-items: center;
		justify-content: flex-start;
		width: 80%;
		color: var(--white);
		text-align: justify;
	}
	.market-plans .market-plans-text img{
		width: 30%;

	}
	.market-plans .market-plans-text .plan-text{
		display: flex;
		flex-direction: column;
		align-items: flex-start;
		justify-content: flex-start;
		gap: 10px;
		padding-bottom: 20px;
		max-height: 380px;
		overflow-y: auto;
	}
	.market-plans .market-plans-text .plan-text a.btn-link{
		border-radius: 10px;
		padding: 10px 20px;
		color: var(--blue);
		background-color: var(--white);

	}
	.market-continer{
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: flex-start;
		width: 80%;
		border-radius: 10px;
		
		
	}
	.market-continer .market-text{
		width: 100%;
		display: flex;
		align-items: center;
		justify-content: space-between;
		padding: 10px 20px;

	}
	.market-continer .market-text h2{
		color: var(--blue);
		font-size: 20px;
		font-weight: 500;
	}
	.market-continer .market-text a{
		color: var(--blue);
		font-size: 15px;
		font-weight: 500;
	}

	.market-continer .market-continer-box{
		display: flex;
		align-items: center;
		justify-content: flex-start;
		overflow-x: auto;
		width: 100%;
		border-radius: 10px;
		padding: 10px;
		gap :20px;	
	}
	.product-boxs > .market-box{
		width: calc((100% - 40px) / 5);
		max-width: 350px;
	}
	.city-box{
		min-width: calc((100% - 80px) / 5);
		display: flex;
		align-items: center;
		justify-content: flex-start;
		flex-direction: column;
		gap: 8px;
		border-radius: 12px;
		background-color: var(--white);
		padding: 10px;	
		box-shadow: 0 10px 40px rgba(0, 0, 0, 0.08);
	}
	.city-box img{
		width: 100%;
		border-radius: 12px;
	}
	.city-box p{
		font-size: 16px;
		font-weight: 400;
	}
	.city-box p.cun{
		font-size: 15px;
		color: var(--gray);
		font-weight: 300;
	}
	.plan-box{
		display: flex;
		padding: 0 8%;
	}
	.market-box{
		display: flex;
		flex-direction: column;
		align-items: flex-start;
		justify-content: flex-start;
		width: calc((100% - 10px) / 2);
		
		max-width: 200px;
		padding: 5px;
		border-radius: 10px;
		background-color: var(--white);
		    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.08);
		gap: 0px;
	}
	.market-box > img{
		width: 100%;
		border-radius: 10px;

		margin-bottom: 5px;
	}
	.market-box .market-name{
		width: 100%;
		display: flex;
		align-items: center;
		justify-content: flex-start;
		gap: 5px;
		padding: 00px 5px ;
	}
	.market-box .market-park{
		display: flex;
		gap: 5px;
		padding: 00px 5px ;
		color: var(--gray);
		font-size: 14px;
	}
	.market-box .market-name img{
		width: 20px;
		height: 20px;
		border-radius: 0px;
	}
	.market-box .market-name h2{
		font-size: 16px;
		font-weight: 400;
		color: var(--black);
	}
	.footer{
		width: 100%;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: flex-start;
		margin-top: 30px;
		padding: 20px 10% 20px 10%;
		border-top: 2px solid var(--backgrund);
		gap: 30px;
	}
	.footer-continer{
		display: flex;
		align-items: center;
		justify-content: space-between;
		width: 100%;
	}
	.digi-logo{
		display: flex;
		align-items: flex-start;
		justify-content: flex-start;
		flex-direction: column;
		gap: 10px;
	}
	.digi-logo > div{
		display: flex;
		align-items: flex-start;
		justify-content: flex-start;
		gap: 20px;
		padding: 0 10px;

	}
	.digi-logo > div p ,.digi-logo > div p a{
		display: flex;
		align-items: center;
		justify-content: flex-start;
		line-height: 15px;
		gap: 5px;
		color: var(--gray);
		font-size: 13px;
	}
	.go-top{
		display: flex;
		align-items: center;
		justify-content: center;
		padding: 5px 35px;
		border-radius: 10px;
		border: 2px solid var(--backgrund);
		color: var(--gray);
	}
	.trust-item{
		width: 60px;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: flex-start;
		gap: 10px;
		padding: 10px;
	}
	.trust-item img{
		width: 100%;
	}
	.trust-item p{
		font-size: 11px;
		font-weight: 200	;
	}
	.link-grup{
		width: 22%;
		display: flex;
		flex-direction: column;
		align-items: flex-start;
		justify-content: flex-start;
		gap: 10px;
	}
	.link-grup h3{
		font-size: 18px;
		font-weight: 400;
		color: var(--black);
	}
	.link-grup a{
		font-size: 15px;
		font-weight: 300;
		color: var(--gray);
	}
	.social{
		width: 100%;
		display: flex;
		align-items: center;
		justify-content: space-between;
		padding-top: 10px;
		padding-bottom: 15px;
	}
	.social a{
		width: 20%;
		max-width: 40px;
		display: flex;
		align-items: center;
		justify-content: center;
		padding: 0;
	}
	.social form{
		width: 100%;
		display: flex;
		align-items: center;
		justify-content: center;
		padding: 0;
		gap: 5px;
	}
	.social form input{
		border: none;
		width: 80%;
		padding: 15px 10px;
		font-family: "homa";
		background-color: var(--backgrund);
		border-radius: 5px;

	}
	.social a img{
		width: 100%;
	}
	p.copy{
		font-size: 15px;
		font-weight: 300;
		color: var(--gray);
	}
	.market-plan-card{
		width: calc(100% - 400px);
		display: flex;
		flex-direction: column;
		align-items: flex-start;
		justify-content: flex-start;
		gap: 15px;
	}
	.plan-continer{
		display: flex;
		align-items: center;
		justify-content: flex-start;
		gap: 10px;
		flex-direction: column;
		width: 80%;
		padding-top: 45px;
	}
	.plan-box-continer{
		display: flex;
		align-items: flex-start;
		justify-content: center;
		flex-direction: row;
		gap: 20px;width: 100%;
	}
	.plan-box-2{
		width: calc((100% - 60px) / 4);
		display: flex;
		align-items: center;
		justify-content: flex-start;
		flex-direction: column;
		border: 2px solid var(--backgrund);
		border-radius: 15px;
		padding: 0 0%;
		gap: 5px;
		padding-bottom: 20px;
		transition: all .3s ease-in-out;
	}
	.plan-continer-row{
		display: flex;
		align-items: center;
		justify-content: center;
		width: 100%;
	}
	.plan-option-continer{
		display: flex;
		align-items: center;
		justify-content: space-around;
		width: 100%;
	}
	.plan-option-box{
		display: flex;
		align-items: center;
		justify-content: flex-start;
		gap: 10px;
		border-radius: 10px;
		padding: 10px 20px;
	}
	.option-header{
		font-size: 16px;
		font-weight: 400;
		color: var(--blue);
	}
	.option-text{
		font-size: 14px;
		font-weight: 400;
		color: var(--gray);
	}
	.rahnama{
		padding: 14px;
		font-weight: 400;
		padding: 5px 20px;
		border-radius: 8px;
		background-color: var(--blue);
		color: var(--white);
	}
	.plan-header-text{
		
		font-size: 22px;
		font-weight: 600;
		padding: 0px 0px;
		border-radius: 8px;
		color: var(--black);
		text-align: center;
	}
	.plan-header-text span{
		
		font-weight: 600;
		padding: 0px 0px;
		border-radius: 8px;
		color: var(--blue);
	}
	

	/* =========================
   SILVER ANIMATION
========================= */

.silver-gradient{
    background: linear-gradient(
        135deg,
        #9ea3a8,
        #f5f7fa,
        #c7ccd1,
        #ffffff,
        #b0b7bd
    );

    background-size: 400% 400%;
    animation: silverShine 6s ease infinite;
    position: relative;
    overflow: hidden;
}


.silver-gradient:hover::before{
    content: "";
    position: absolute;
    top: -50%;
    left: -60%;
    width: 40%;
    height: 200%;
    background: rgba(255,255,255,0.35);
    transform: rotate(25deg);
    animation: silverLight 4s linear infinite;
}

@keyframes silverShine{
    0%{ background-position: 0% 50%; }
    50%{ background-position: 100% 50%; }
    100%{ background-position: 0% 50%; }
}

@keyframes silverLight{
    0%{ left: -60%; }
    100%{ left: 140%; }
}


/* =========================
   GOLD ANIMATION
========================= */

.gold-gradient{
    background: linear-gradient(
        135deg,
        #a86f00,
        #ffd700,
        #fff1a8,
        #ffcc00,
        #b8860b
    );

    background-size: 400% 400%;
    animation: goldShine 5s ease infinite;
    position: relative;
    overflow: hidden;
}

.gold-gradient::before{
    content: "";
    position: absolute;
    top: -50%;
    left: -70%;
    width: 30%;
    height: 220%;
    background: rgba(255,255,255,0.45);
    transform: rotate(25deg);
    animation: goldLight 3s linear infinite;
}

@keyframes goldShine{
    0%{ background-position: 0% 50%; }
    50%{ background-position: 100% 50%; }
    100%{ background-position: 0% 50%; }
}

@keyframes goldLight{
    0%{ left: -70%; }
    100%{ left: 150%; }
}


/* =========================
   DIAMOND ANIMATION
========================= */

.diamond-gradient{
    background: linear-gradient(
        135deg,
        #7dcfff,
        #dff6ff,
        #8ad8ff,
        #ffffff,
        #4cbcff
    );

    background-size: 400% 400%;
    animation: diamondShine 5s ease infinite;
    position: relative;
    overflow: hidden;
}

.diamond-gradient:hover::before{
    content: "";
    position: absolute;
    top: -50%;
    left: -70%;
    width: 30%;
    height: 220%;
    background: rgba(255,255,255,0.55);
    transform: rotate(25deg);
    animation: diamondLight 2.8s linear infinite;
}

@keyframes diamondShine{
    0%{ background-position: 0% 50%; }
    50%{ background-position: 100% 50%; }
    100%{ background-position: 0% 50%; }
}

@keyframes diamondLight{
    0%{ left: -70%; }
    100%{ left: 150%; }
}


/* =========================
   VIP RED DIAMOND ANIMATION
========================= */

.vip-gradient{
    background: linear-gradient(
        135deg,
        #4d0000,
        #a80000,
        #ff1f1f,
        #ff6b6b,
        #7a0000
    );

    background-size: 400% 400%;
    animation: vipShine 4s ease infinite;
    position: relative;
    overflow: hidden;
}

.vip-gradient:hover::before{
    content: "";
    position: absolute;
    top: -50%;
    left: -70%;
    width: 28%;
    height: 220%;
    background: rgba(255,255,255,0.35);
    transform: rotate(25deg);
    animation: vipLight 2.5s linear infinite;
}

@keyframes vipShine{
    0%{ background-position: 0% 50%; }
    50%{ background-position: 100% 50%; }
    100%{ background-position: 0% 50%; }
}

@keyframes vipLight{
    0%{ left: -70%; }
    100%{ left: 150%; }
}
/* =========================
   BUTTON BASE
========================= */

.plan-btn{
    position: relative;
    overflow: hidden;
    border: none;
    outline: none;
    cursor: pointer;

    padding: 16px 32px;
    border-radius: 16px;

    font-size: 18px;
    font-weight: 700;
    color: #fff;

    transition: 0.4s ease;

    background: linear-gradient(
        135deg,
        #0f5eff,
        #2f80ff,
        #56b2ff,
        #0066ff
    );

    background-size: 300% 300%;

    box-shadow:
        0 10px 25px rgba(0,102,255,0.25),
        inset 0 1px 1px rgba(255,255,255,0.15);
}

/* =========================
   SHINE EFFECT
========================= */

.plan-btn::before{
    content: "";

    position: absolute;
    top: -50%;
    left: -80%;

    width: 35%;
    height: 220%;

    background: rgba(255,255,255,0.35);

    transform: rotate(25deg);

    opacity: 0;
}

/* =========================
   HOVER EFFECT
========================= */

.plan-btn:hover{

    animation: blueGradientMove 2.5s ease infinite;

    transform: translateY(-4px) scale(1.02);

    box-shadow:
        0 18px 40px rgba(0,102,255,0.35),
        0 0 25px rgba(86,178,255,0.35);
}

.plan-btn:hover::before{
    opacity: 1;
    animation: blueShine 1.5s linear infinite;
}

/* =========================
   ACTIVE CLICK
========================= */

.plan-btn:active{
    transform: scale(0.98);
}

/* =========================
   KEYFRAMES
========================= */

@keyframes blueGradientMove{

    0%{
        background-position: 0% 50%;
    }

    50%{
        background-position: 100% 50%;
    }

    100%{
        background-position: 0% 50%;
    }
}

@keyframes blueShine{

    0%{
        left: -80%;
    }

    100%{
        left: 180%;
    }
}
	.silver{
		background: linear-gradient(135deg, #a7a7a7, #dcdcdc, #ffffff, #c0c0c0);box-shadow: 0 10px 25px rgba(0,0,0,0.15);
	}
	.silver:hover{
		border: 3px solid var(--blue);
		background: linear-gradient(135deg, #a7a7a7, #dcdcdc, #ffffff, #c0c0c0);box-shadow: 0 10px 25px rgba(0,0,0,0.15);
	}
	.gold{
		background: linear-gradient(135deg, #b8962e, #ffd700, #ffec8b, #e6c200);box-shadow: 0 10px 25px rgba(0,0,0,0.15);
	}
	.dimond{
		background: linear-gradient(135deg, #dfe9f3, #ffffff, #cfd9df);box-shadow: 0 10px 25px rgba(0,0,0,0.15);
	}
	.vip{
		background: linear-gradient(135deg, #5a0000, #a80000, #ff1a1a, #ff6666);box-shadow: 0 10px 25px rgba(0,0,0,0.15);
	}
	.plan-box-2 img.plan-icon{
		width: 60%;
		
	}
	.plan-text-header{
		font-size: 20px;
		font-weight: 600;
		padding: 0px 0px;
		border-radius: 8px;
		color: var(--blue);
		text-align: center;
	}
	.plan-text-header-shoar{
		text-align: center;
		font-size: 15px;
		font-weight: 400;
		padding: 0px 0px;
		border-radius: 0px;
		color: var(--black);
	}
	.plan-text-header-tozih{
		font-size: 14px;
		font-weight: 400;
		padding: 0px 0px;
		border-radius: 0px;
		color: var(--black);
		text-align: center;
	}
	.plan-text-header-price{
		font-size: 28px;
		font-weight: 700;
		padding: 0px 0px;
		border-radius: 0px;
		color: var(--blue);
		text-align: center;
	}
	.plan-text-header-price-unit{
		font-size: 17px;
		font-weight: 400;
		padding: 0px 0px;
		border-radius: 0px;
		color: var(--black);
		text-align: center;
		margin-top: -7px;
	}
	.plan-box-option-text{
		width:100%;
		padding: 0 20%;
		display: flex;
		align-items: center;
		justify-content: flex-start;
		gap: 15px;
	}
	.plan-box-option-text p{
		font-size: 14px;
	}
	.plan-btn{
		width: 90%;
		display: flex;
		align-items: center;
		justify-content: center;
		gap: 10px;
		padding: 5px 0px;
		border-radius: 10px;
		color: var(--white);
		
		font-size: 17px;
	}
	.plan-detil{
		font-size: 15px;
		color: var(--black);
	}
	.plan-btn img{width: 30px;}

	
 .products-continer{
	display: flex;
	align-items: flex-start;
	justify-content: flex-start;
	flex-wrap: wrap;
	gap: 20px;
	width: 80%;
	padding: 10px;
 }
 .product-sort-continer{
	width: 90%;
	display: flex;
	align-items: center;
	justify-content: flex-start;
	gap: 5px;
 }
 .product-filter-btn{
	width: calc(10% - 20px);
	display: flex;
	align-items: center;
	justify-content: flex-end;
	gap: 5px;
 }
 .product-cunter{
	color: var(--gray);
	padding: 0 10px;
	border-left: 2px solid var(--backgrund);
	 white-space: nowrap;
    flex-shrink: 0;
 }
 .item-sort{
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--black);border-radius: 8px;
	padding: 5px 10px;
	border: 2px solid var(--backgrund);
	transition: all .3s ease-in-out;
	 white-space: nowrap;
    flex-shrink: 0;
 }
 .item-sort.activ-sort{
	
	background-color: var(--blue);
	color: var(--white);
	
 }
 .item-sort:hover{
	
	background-color: var(--blue);
	color: var(--white);
	
 }
 .product-filter-continer{
	gap: 20px;
	width: calc(21.5% - 20px);
	border-radius: 10px;
	padding: 0px;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	justify-content: flex-start;
 }
 .product-boxs{
	width: 78.5%;
	display: flex;
	gap: 10px;
	justify-content: flex-start;
	align-items: flex-start;flex-wrap: wrap;
 }
  .product-boxs > .product-card{
	border: 2px solid var(--backgrund);
	width: calc((100% - 40px) / 5);
	max-width: 1000px;
	min-width: auto;
	 overflow:hidden;
    border:1px solid #edf1f7;

    box-shadow:
    0 0 0 1px rgba(0,0,0,0.02),
    0 8px 24px rgba(0,0,0,0.06);

    transition:
    transform 0.25s ease,
    box-shadow 0.25s ease;
  } .product-boxs > .product-card:hover{
	
    transform:translateY(-5px);

    box-shadow:
    0 12px 30px rgba(0,0,0,0.08),
    0 4px 12px rgba(31,107,255,0.08);

  }

/* Filter Button */

.filter-toggle-btn{
    display:flex;
    align-items:center;
    gap:8px;
    background:var(--blue);
    color:#fff;
    border:none;
    padding:12px 20px;
    border-radius:14px;
    cursor:pointer;
    font-size:14px;
    font-weight:bold;
    transition:0.3s;
}

.filter-toggle-btn:hover{
    background:#1257dd;
}


/* Sidebar */

.filters-sidebar{
    width:100%;
    background:#fff;
    border-radius:24px;
    padding:24px;
    box-shadow:0 10px 40px rgba(0,0,0,0.08);
}

/* Header */

.filters-header{
    display:flex;
    align-items:center;
    justify-content:space-between;
    margin-bottom:24px;
}

.filters-header h3{
    font-size:22px;
    color:#111;
}

.close-filter{
    width:36px;
    height:36px;
    border:none;
    border-radius:12px;
    background:#f1f5ff;
    cursor:pointer;
    color:var(--blue);
    font-size:16px;
}

/* Filter Box */

.filter-box{
    margin-bottom:28px;
    border-bottom:1px solid #edf1f7;
    padding-bottom:22px;
    max-height: 300px;
    overflow-y: auto;
}

.filter-title{
    font-size:16px;
    font-weight:bold;
    margin-bottom:18px;
    color:#222;
}

/* Checkbox */

.checkbox-item{
    display:flex;
    align-items:center;
    gap:10px;
    margin-bottom:14px;
    cursor:pointer;
    color:#555;
    font-size:14px;
}

.checkbox-item input{
    width:18px;
    height:18px;
    accent-color:var(--blue);
}

/* Colors */

.color-list{
    display:flex;
    gap:12px;
    flex-wrap:wrap;
}

.color-item{
    width:34px;
    height:34px;
    border-radius:12px;
    border:2px solid #e4e9f2;
    cursor:pointer;
    position:relative;
    overflow:hidden;
}

.color-item input{
    opacity:0;
    position:absolute;
}

.beige{
    background:#d8c3a5;
}

.white{
    background:#fff;
}

.black{
    background:#222;
}

.gray{
    background:#999;
}

.cream{
    background:#f4e3c3;
}

/* Price */

.price-inputs{
    display:flex;
    gap:12px;
}

.price-inputs input{
    width:100%;
    height:48px;
    border:1px solid #dfe5ef;
    border-radius:14px;
    padding:0 14px;
    outline:none;
    transition:0.3s;
    background:#f9fbff;
}

.price-inputs input:focus{
    border-color:var(--blue);
}

/* Button */

.apply-filter-btn{
	display: flex;
	align-items: center;
	justify-content: center;
    width:100%;
    height:54px;
    border:none;
    border-radius:16px;
    background:var(--blue);
    color:#fff;
    font-size:15px;
    font-weight:bold;
    cursor:pointer;
    transition:0.3s;
}

.apply-filter-btn:hover{
    background:#1257dd;
}


/* Responsive */

@media(max-width:768px){

    .filters-sidebar{
        width:100%;
        border-radius:24px 24px 0 0;
    }

}
/* Pagination */

.pagination{
    width:100%;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:14px;
    margin-top:40px;
    flex-wrap:wrap;
}

/* Prev / Next */

.page-btn{
    min-width:95px;
    height:46px;
    padding:0 18px;

    display:flex;
    align-items:center;
    justify-content:center;

    background:#fff;
    border:1px solid #dfe6f3;
    border-radius:14px;

    color:var(--blue);
    text-decoration:none;
    font-size:14px;
    font-weight:bold;

    transition:0.3s;
}

.page-btn:hover{
    background:var(--blue);
    color:#fff;
    border-color:var(--blue);
}

/* Numbers */

.page-numbers{
    display:flex;
    align-items:center;
    gap:10px;
}

/* Single Page */

.page-number{
    width:46px;
    height:46px;

    display:flex;
    align-items:center;
    justify-content:center;

    background:#fff;
    border:1px solid #e4ebf5;
    border-radius:14px;

    color:#444;
    text-decoration:none;
    font-size:14px;
    font-weight:600;

    transition:0.25s;
}

/* Hover */

.page-number:hover{
    border-color:var(--blue);
    color:var(--blue);

    transform:translateY(-2px);
}

/* Active */

.page-number.active{
    background:var(--blue);
    color:#fff;
    border-color:var(--blue);

    box-shadow:
    0 8px 20px rgba(31,107,255,0.25);
}

/* Dots */

.dots{
    color:#888;
    font-size:18px;
    padding:0 4px;
}

/* Mobile */

@media(max-width:768px){

    .pagination{
        gap:10px;
    }

    .page-btn{
        min-width:75px;
        height:42px;
        font-size:13px;
    }

    .page-number{
        width:40px;
        height:40px;
        font-size:13px;
        border-radius:12px;
    }

}
.digi-ads-company{
	width:100%;
    background:#fff;
    border-radius:24px;
    padding:24px 10px; 
    box-shadow:0 10px 40px rgba(0,0,0,0.08);
	
	position: relative;
	overflow: hidden;
	display: flex;
	align-items: center;
	flex-direction: column;
	justify-content: flex-start;
	
}
.company-level-color{
	width: 600px;
	height: 300px;
	position: absolute;
	background-color: var(--blue);
	border-radius: 50%;
	top: -210px;
	left: -50%;
	z-index: 50;
}
.company-logo{
	width: 100px;
	position: absolute;
	z-index: 51;
	border-radius: 0px;
	background-color: var(--white);
	
	border-radius: 15px;
}
.company-logo img{
	width: 100%;
	border-radius: 15px;padding: 0px;
	border: 4px solid var(--blue);
}
.company-name{
	display: flex;
	align-items: center;
	gap: 10px;
	margin-top: 120px;
	white-space: wrap;
}
.company-name img{
	width: 30px;
}
.company-admin p{
	color: var(--gray);
	
white-space: wrap;
    overflow: auto;
    text-overflow: ellipsis;}
.company-phone a{
	color: var(--gray);
	text-decoration: underline;
}
.company-name p{
	font-size: 20px;
	font-weight: 500;
}
.company-sugest{
	position: absolute;
	z-index: 55;
	background-color: var(--dark-blue);
	color: var(--white);
	top: 10px;
	left: 10px;
	border-radius: 8px;
	padding: 2px 5px;
	font-size: 14px;
}
.company-sugest-2{
	position: absolute;
	z-index: 55;
	background-color: var(--dark-blue);
	color: var(--white);
	top: 10px;
	right:  10px;
	border-radius: 8px;
	padding: 2px 5px;
	font-size: 14px;
}
.company-product-img{
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	margin-top: 10px;
}
.company-product-img img{
	width: calc((90% - 20px) / 3);
	border-radius: 20px;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
}
.digi-ads-company-products{
	display: flex;
	justify-content: flex-start;
	align-items: flex-start;
	flex-direction: column;
	width: 80%;
	background-color: var(--blue-30);
	border-radius: 12px;
	padding: 20px;
	gap: 10px;
}
.digi-ads-header{
	display: flex;
	justify-content: flex-start;
	align-items: center;
	width: 100%;
	gap: 10px;
}
.digi-ads-header p{
	padding: 1px 8px;
	border-radius: 5px;
	background-color: var(--blue);
	color: var(--white);
}.digi-ads-header h2{
	padding: 1px 8px;
	border-radius: 5px;
	color: var(--blue);
}
.digi-ads-text p{
	color: var(--gray);
}
.digi-ads-btn {
	width: 17%;
}
.digi-ads-company-continer{
	display: flex;
	flex-direction: row;
	align-items: flex-start;
	justify-content: flex-start;
	gap: 10px;
	width: 100%;
	overflow-x: auto;
}
.digi-ads-company-continer > .digi-ads-company{
	min-width: calc((100% - 40px) / 5);
}
.faq-hero{
    width: 80%;
    border-radius: 34px;
    background-color: var(--blue);

    display: flex;
    justify-content: space-around;
    align-items: center;

    padding: 25px 10%;

    background-image:
        linear-gradient(
            rgba(0, 85, 255, 0.85),
            rgba(0, 85, 255, 0.85)
        ),
        url("../image/ChatGPT Image Jun 1, 2026, 09_40_38 AM.png");

    background-repeat: repeat;
    background-size: 570px;
    background-position: center;
}
.faq-header-text{
	width: 50%;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	justify-content: flex-start;
	gap: 15px;
	color: var(--white);
}
.serch-input{
	width: 100%;
	display: flex;
	align-items: center;
}
.serch-input input{
	width: calc(100% - 45px);
	height: 45px;
	border: none;
	font-size: 17px;
	padding: 0 10px;
	border-radius: 0 20px 20px 0;
	background-color: var(--white);
}
.serch-input> img{
	width: 45px;
	height: 45px;
	background-color: var(--white);
	border: none;padding: 7px;
	border-radius: 20px 0px 0px 20px;
}
.faq-hero> img{
	width: 50%; 
	max-width: 320px;
}
.faq-continer{
	width: 80%;
	display: flex;
	align-items: flex-start;
	justify-content: flex-start;
	gap: 20px;
	padding-top: 15px;
}
.faqs{
	width: calc(75% - 10px);
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	justify-content: flex-start;
	padding: 18px;
	background-color: var(--white);
	border-radius: 12px;
	box-shadow: 0 10px 40px rgba(0, 0, 0, 0.08);
	gap: 10px;
}
.faq-sopurt{
	width: 25%;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: flex-start;
	padding: 18px;
	background-color: var(--white);
	border-radius: 12px;
	box-shadow: 0 10px 40px rgba(0, 0, 0, 0.08);
	gap: 10px;
}
.faq-sopurt > img { 
width: 100%;
}
.faq-item{
	width: 100%;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	border-radius: 14px;
	border: 2px solid var(--backgrund);
	padding: 15px;
	gap: 10px;
}
.faq-q{
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: space-between;
}
.faq-text{
	display: flex;
	justify-content: flex-start;
	align-items: center;
	gap: 15px;
}
.faq-q > img{
	
	width: 35px;
	padding: 5px;
	border-radius: 8px;
	background-color: var(--blue-30);
}
.faq-text p.soal{
	font-size: 17px;
	font-weight: bold;
	color: var(--black);
}
.faq-text p.pasokh{
	font-size: 15px;
	font-weight: 400;
	color: var(--gray);
}
.faq-text > img.soal{
	width: 35px;
	padding: 5px;
	border-radius: 8px;
	background-color: var(--blue-30);
}
.faq-text > img.pasokh{
	opacity: 0;
	width: 35px;
	padding: 5px;
	border-radius: 8px;
	background-color: var(--backgrund);
}
.bottom-nav{
	width: 100%;
    position: fixed;
    bottom: 0px;
    

    height: 78px;

    background: var(--white);

    border-radius: 28px 28px 0 0;

    display: none;
    align-items: center;
    justify-content: space-around;

    box-shadow:
    0 8px 30px rgba(0,0,0,.08);

    z-index: 9999;
}

.nav-item{
    position: relative;

    width: 70px;

    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;

    gap: 6px;

    color: var(--gray);
    text-decoration: none;

    transition: .3s;
}

.nav-item span{
    font-size: 12px;
    font-family: homa;
}

.nav-icon{
    width: 26px;
    height: 26px;

    display: flex;
    align-items: center;
    justify-content: center;
}

.nav-icon img{
    width: 100%;
}

.nav-item.active{
    color: var(--blue);
}

.nav-item.active .nav-icon{

    position: absolute;

    bottom: 28px;

    width: 68px;
    height: 68px;

    border-radius: 50%;

    background: #fff;

    box-shadow:
    0 10px 25px rgba(0,102,255,.15);

    display: flex;
    align-items: center;
    justify-content: center;
}

.nav-item.active .nav-icon img{
    width: 30px;
}

.nav-item.active span{
    margin-top: 42px;
    font-weight: bold;
}

.nav-item.active::after{
    content: '';

    position: absolute;

    bottom: -10px;

    width: 28px;
    height: 4px;

    border-radius: 20px;

    background: var(--blue);
}
.contact-box{
    position: fixed;
    bottom: 110px;
    left: 20px;
    z-index:200;
}

.contact-btn{
    width: 65px;
    height: 65px;

    border: none;
    border-radius: 50%;

    background: var(--blue);

    display: flex;
    align-items: center;
    justify-content: center;

    cursor: pointer;

    box-shadow: 0 10px 30px rgba(0,102,255,.25);

    transition: .3s;
}

.contact-btn img{
    width: 28px;
}

.contact-menu{

    position: absolute;

    left: 0;
    bottom: 80px;

    width: 220px;

    background: #fff;

    border-radius: 24px;

    overflow: hidden;

    box-shadow: 0 10px 40px rgba(0,0,0,.12);

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

    transition: .3s;
}

.contact-menu.active{
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.contact-item{

    height: 65px;

    display: flex;
    align-items: center;
    justify-content: space-between;

    padding: 0 20px;

    color: #222;
    text-decoration: none;

    border-bottom: 1px solid #f0f0f0;
}

.contact-item:last-child{
    border-bottom: none;
}

.contact-item img{
    width: 30px;
}

.contact-item:hover{
    background: #f8f8f8;
}
.category-hero{
	width: 80%;
    display:flex;
    align-items:center;
    justify-content:space-between;

    gap:50px;

    padding:50px 20px;

    border-radius:30px;

    background:
    linear-gradient(
    135deg,
    #ffffff 0%,
    #dae4f8 100%);

    overflow:hidden;

    margin-bottom:50px;
}


.category-content{

    flex:1;
}

.category-badge{

    display:inline-flex;

    background:#eef5ff;

    color:var(--blue);

    padding:8px 18px;

    border-radius:50px;

    margin-bottom:20px;
}

.category-content h1{

    font-size:58px;

    margin-bottom:20px;

    color:var(--black);
}

.category-content p{

    max-width:700px;

    line-height:2.2;

    color:var(--gray);

    margin-bottom:30px;
}

.hero-features{

    display:flex;

    gap:25px;

    flex-wrap:wrap;

    margin-bottom:30px;
}

.hero-feature{

    display:flex;

    align-items:center;

    gap:10px;
}

.hero-feature img{

    width:26px;
}

.hero-stats{

    display:flex;

    gap:40px;

    margin-bottom:30px;
}

.hero-stat strong{

    display:block;

    color:var(--blue);

    font-size:28px;
}

.hero-buttons{

    display:flex;

    gap:15px;
}

.category-image{

    width:450px;
}

.category-image img{
	border-radius: 25px;
    width:100%;
}
.hero-buttons{

    display:flex;
    gap:15px;
    flex-wrap:wrap;
}

/* دکمه اصلی */

.btn-primary{


    padding:0 28px;

    display:flex;
    align-items:center;
    justify-content:center;

    background:var(--blue);

    color:#fff;

    text-decoration:none;

    border-radius:14px;

    font-size:15px;
    font-weight:600;

    border:2px solid var(--blue);

    transition:.3s;
}

.btn-primary:hover{

    background:#1558eb;

    border-color:#1558eb;

    transform:translateY(-2px);

    box-shadow:
    0 10px 25px rgba(31,107,255,.25);
}


/* دکمه ثانویه */

.btn-outline{

    height:52px;

    padding:0 28px;

    display:flex;
    align-items:center;
    justify-content:center;

    background:#fff;

    color:var(--blue);

    text-decoration:none;

    border-radius:14px;

    font-size:15px;
    font-weight:600;

    border:2px solid #dbe7ff;

    transition:.3s;
}

.btn-outline:hover{

    background:#f5f9ff;

    border-color:var(--blue);

    transform:translateY(-2px);
}
@media(max-width:992px){

    .category-hero{
		width: 96%;

        flex-direction:column-reverse;

        text-align:center;

        padding:20px;
    }

    .hero-features{

        justify-content:center;
    }

    .hero-stats{

        justify-content:center;
    }

    .hero-buttons{

        justify-content:center;
    }

    .category-image{

        width:320px;
    }

    .category-content h1{

        font-size:42px;
    }

}
.category-seo{
	width: 80%;

    background:#fff;

    border:1px solid #edf1f7;

    border-radius:24px;

    padding:35px;

    margin:50px 0;

    box-shadow:
    0 5px 20px rgba(0,0,0,.04);
}

.seo-header{

    margin-bottom:20px;
}

.seo-badge{

    display:inline-flex;

    background:#eef5ff;

    color:var(--blue);

    padding:8px 15px;

    border-radius:50px;

    font-size:13px;

    margin-bottom:12px;
}

.seo-header h2{

    font-size:30px;

    color:var(--black);
}

.seo-content{

    color:var(--gray);

    line-height:2.4;

    font-size:15px;
}

.seo-content p{

    margin-bottom:15px;
}

.seo-more-btn{

    margin-top:15px;

    background:none;

    border:none;

    color:var(--blue);

    font-size:14px;

    cursor:pointer;

    font-weight:600;
}
.seo-content{

    max-height:150px;

    overflow:hidden;

    transition:.4s;
}

.seo-content.active{

    max-height:100000px;
}
@media(max-width:768px){

    .category-seo{
		width: 96%;

        padding:25px;
        border-radius:18px;
    }

    .seo-header h2{

        font-size:24px;
    }

    .seo-content{

        font-size:14px;
        line-height:2.2;
    }

}

@media(max-width:480px){

    .category-seo{

        padding:20px;
    }

    .seo-header h2{

        font-size:20px;
    }

}
.stone-projects{
	width: 80%;
    margin:10px 0;
}

.section-title-box{

    display:flex;
    justify-content:space-between;
    align-items:center;

    margin-bottom:25px;
}

.section-title-box h2{

    font-size:32px;
    margin-bottom:8px;
}

.section-title-box p{

    color:var(--gray);
}

.view-all-projects{

    text-decoration:none;

    color:var(--blue);

    font-weight:600;
}

.projects-grid{

    display:grid;

    grid-template-columns:
    repeat(5,1fr);

    gap:25px;
}

.project-card{

    background:#fff;

    border-radius:22px;

    overflow:hidden;

    border:1px solid #edf1f7;

    transition:.3s;

    box-shadow:
    0 8px 20px rgba(0,0,0,.04);
}

.project-card:hover{

    transform:translateY(-5px);

    box-shadow:
    0 15px 40px rgba(0,0,0,.08);
}
.project-image{

    position:relative;

    height:260px;

    overflow:hidden;
}

.project-image img{

    width:100%;
    height:100%;

    object-fit:cover;

    transition:.4s;
}

.project-card:hover img{

    transform:scale(1.05);
}

.project-tag{

    position:absolute;

    top:15px;
    right:15px;

    background:rgba(255,255,255,.95);

    color:var(--blue);

    padding:8px 14px;

    border-radius:30px;

    font-size:13px;

    font-weight:600;
}
.project-content{

    padding:20px;
}

.project-content h3{

    margin-bottom:10px;

    font-size:20px;
}

.project-location{

    color:var(--blue);

    margin-bottom:12px;

    font-size:14px;
}

.project-content p{

    color:var(--gray);

    line-height:2;

    margin-bottom:15px;
}

.project-content a{

    color:var(--blue);

    text-decoration:none;

    font-weight:600;
}
.project-meta{
	

    display:flex;
    gap:10px;

    flex-wrap:wrap;

    margin-bottom:15px;
}

.project-meta span{

    background:#f6f9ff;

    color:var(--blue);

    padding:6px 12px;

    border-radius:20px;

    font-size:12px;
}
@media(max-width:992px){
	.stone-projects{
		width: 96%;
	}

    .projects-grid{

        grid-template-columns:
        repeat(2,1fr);
    }

}
@media(max-width:768px){

    .section-title-box{

        flex-direction:column;
        align-items:flex-start;

        gap:10px;
    }

    .projects-grid{

        grid-template-columns:1fr;
    }

    .project-image{

        height:220px;
    }

}
 .factory-hero{
	padding: 30px 0;
        width: 80%;
    position:relative;
    min-height:500px;
    border-radius:30px;
    overflow:hidden;

    display:flex;
    align-items:center;

    margin-bottom:40px;
}

.hero-bg{

    position:absolute;
    inset:0;

    width:100%;
    height:100%;

    object-fit:cover;
}

.hero-overlay{

    position:absolute;
    inset:0;

    background:
    linear-gradient(
        270deg,
        rgba(27,103,255,.95) 0%,
        rgba(27,103,255,.85) 35%,
        rgba(27,103,255,.45) 60%,
        rgba(27,103,255,0) 100%
    );

    z-index:1;
}

.hero-content{
	max-width: 55%;

    position:relative;
    z-index:2;
	padding: 50px 00;


    margin-right:80px;

    color:#fff;
}

.factory-status{

    display:inline-flex;

    padding:10px 18px;

    background:rgba(255,255,255,.2);

    backdrop-filter:blur(10px);

    border-radius:50px;

    margin-bottom:20px;
}

.hero-content h1{

    font-size:58px;
    font-weight:800;

    margin-bottom:15px;
}

.hero-content p{

    font-size:18px;
    line-height:2;
    margin-bottom:25px;
}

.hero-rating{

    margin-bottom:30px;
    font-size:18px;
}

.hero-buttons{

    display:flex;
    gap:15px;
}

.btn-primary{

    background:#fff;
    color:#1f6bff;

    padding:15px 30px;

    border-radius:14px;

    text-decoration:none;

    font-weight:700;
}

.btn-secondary{

    border:2px solid #fff;

    color:#fff;

    padding:15px 30px;

    border-radius:14px;

    text-decoration:none;
}

.factory-stats{
    position: relative;
    z-index: 3;
    align-items: center;
    justify-content: space-around;
    width: 70%;
    background: var(--white);
    padding: 25px 0;
    border-radius: 25px;
    display: flex;
    margin-top: -100px;
    
	box-shadow: 0 10px 40px rgba(0, 0, 0, 0.08);
}
.stat-box{
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 10px;
}
.stat-text h3{
    font-size: 18px;
    font-weight: bold;
    color: var(--blue);
}
.stat-box img{
    width: 55px;
    border-radius: 12px;
    background-color: var(--blue-30);
    padding: 8px;
}
.stat-box{
    padding:10px;
    border-radius:15px;
    transition:.3s;
}

.stat-box:hover{
    background:#f8fbff;
}
.stat-text span{
    white-space: nowrap;
}
.stat-text span{
    line-height:1.8;
}
@media(max-width:1200px){

    .hero-content{
        margin-right:50px;
    }

    .hero-content h1{
        font-size:48px;
    }

}


@media(max-width:992px){

    .factory-hero{
        height:420px;
    }

    .hero-content{
        margin-right:35px;
        max-width:500px;
    }

    .hero-content h1{
        font-size:40px;
    }

    .hero-content p{
        font-size:16px;
    }

}


@media(max-width:768px){

    .factory-hero{
        width: 95%;
        height:auto;
        min-height:420px;

        align-items:flex-end;
    }

    .hero-overlay{

        background:
        linear-gradient(
            180deg,
            rgba(27,103,255,.15) 0%,
            rgba(27,103,255,.70) 45%,
            rgba(27,103,255,.95) 100%
        );

    }

    .hero-content{

        margin:0;
        padding:30px;

        width:100%;
        max-width:none;
    }

    .hero-content h1{
        font-size:34px;
    }

    .hero-content p{
        font-size:15px;
        line-height:2;
    }

    .hero-buttons{
        flex-wrap:wrap;
    }

    .btn-primary,
    .btn-secondary{
        flex:1;
        min-width:180px;

        justify-content:center;
        text-align:center;
    }

}


@media(max-width:576px){

    .factory-hero{

        min-height:360px;
        border-radius:20px;
    }

    .hero-content{
        padding:20px;
    }

    .factory-status{

        padding:8px 14px;
        font-size:13px;
    }

    .hero-content h1{

        font-size:28px;
        line-height:1.4;
    }

    .hero-content p{

        font-size:14px;
        margin-bottom:15px;
    }

    .hero-rating{

        font-size:14px;
        margin-bottom:20px;
    }

    .hero-buttons{

        flex-direction:column;
        gap:10px;
    }

    .btn-primary,
    .btn-secondary{

        width:100%;
        
        height: 60px;
        display:flex;
        align-items:center;
        justify-content:center;
    }

}/* Laptop */

@media(max-width:1200px){

    .factory-stats{
        width:85%;
    }

}


/* Tablet */

@media(max-width:992px){

    .factory-stats{

        width:95%;

        margin-top:-60px;

        display:grid;
        grid-template-columns:repeat(2,1fr);

        gap:20px;

        padding:25px;
    }

}


/* Mobile */

@media(max-width:768px){

    .factory-stats{

        width:95%;

        margin-top:-20px;

        border-radius:20px;

        grid-template-columns:1fr 1fr;
    }

    .stat-box{

        justify-content:flex-start;
    }

    .stat-box img{

        width:50px;
        min-width:50px;
    }

    .stat-text h3{

        font-size:16px;
    }

    .stat-text span{

        font-size:13px;
    }

}


/* Small Mobile */

@media(max-width:480px){

    .factory-stats{

        grid-template-columns:1fr;

        padding:20px;
    }

    .stat-box{

        padding-bottom:15px;
        border-bottom:1px solid #edf1f7;
    }

    .stat-box:last-child{
        border-bottom:none;
        padding-bottom:0;
    }

    .stat-box img{

        width:45px;
        min-width:45px;
    }

    .stat-text h3{

        font-size:15px;
    }

    .stat-text span{

        font-size:12px;
    }

}



.factory-info-section{
    width: 80%;
    display:grid;
    grid-template-columns: 1fr 320px ;
    gap:25px;
    margin:40px 0;
}

/* Box */

.contact-box2,
.about-box{
    background:#fff;
    border-radius:24px;
    padding:25px;
    border:1px solid #edf1f7;

    box-shadow:
    0 8px 25px rgba(0,0,0,.05);
}

.section-title{
    font-size:24px;
    font-weight:700;
    margin-bottom:25px;
    color:#222;
}

/* Contact */

.contact-list{
    list-style:none;
    padding:0;
    margin:0;
}

.contact-list li{
    display:flex;
    align-items:center;
    gap:12px;

    padding:14px 0;

    border-bottom:1px solid #f1f4f8;

    color:#555;
}

.contact-list a{
    color:#555;
    text-decoration:none;
}

.route-btn{
    display:flex;
    justify-content:center;
    align-items:center;

    height:52px;

    margin-top:25px;

    background:#1f6bff;
    color:#fff;

    text-decoration:none;

    border-radius:14px;

    font-weight:600;
}

/* About */

.about-content{
    display:grid;
    grid-template-columns:70% 30%;
    
}

.about-text p{
    line-height:2.2;
    color:#666;
    margin-bottom:15px;
}

.about-image img{
    width:100%;
    height:220px;

    object-fit:contain;

    border-radius:18px;
}

/* Features */

.factory-features{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:15px;

    margin-top:25px;
}

.feature-item{
    text-align:center;

    padding:20px;

    border-radius:18px;

    background:#f8fbff;

    border:1px solid #edf3ff;
}

.feature-icon{
    font-size:28px;
    margin-bottom:10px;
}

/* Tablet */

@media(max-width:992px){

    .factory-info-section{
        width: 92%;
        grid-template-columns:1fr;
    }

    .about-content{
        grid-template-columns:1fr;
    }

    .about-image{
        order:-1;
    }

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

}

/* Mobile */

@media(max-width:576px){
.factory-info-section{
        width: 96%;
        grid-template-columns:1fr;
    }
    .contact-box,
    .about-box{
        padding:20px;
        border-radius:18px;
    }

    .section-title{
        font-size:20px;
    }

    .factory-features{
        grid-template-columns:1fr;
    }

    .about-image img{
        height:180px;
    }

    
}
.factory-stones{
    width: 80%;
}

.section-header{

    margin-bottom:25px;
}

.section-header h2{

    font-size:28px;
    color:var(--black);
    margin-bottom:10px;
}

.section-header p{

    color:var(--gray);
}

.stone-grid{

    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:20px;
}

.stone-card{

    background:#fff;

    border-radius:24px;

    padding:10px;

    border:1px solid #edf1f7;

    box-shadow:
    0 8px 25px rgba(0,0,0,.05);

    transition:.3s;
}

.stone-card:hover{

    transform:translateY(-5px);
}

.stone-icon{

    width:100%;

    border-radius:18px;


    display:flex;
    align-items:center;
    justify-content:center;

    margin-bottom:15px;
}

.stone-icon img{
    object-fit:contain; 
    width: 100%;
    border-radius: 16px;
}

.stone-content h3{

    margin-bottom:10px;
    color:var(--black);
}

.stone-content p{

    color:var(--gray);

    line-height:1.8;

    margin-bottom:20px;
}

.stone-btn{

    width:100%;

    display:flex;
    align-items:center;
    justify-content:center;

    height:50px;

    border-radius:14px;

    background:var(--blue);

    color:#fff;

    text-decoration:none;
}   
@media(max-width:992px){
    .custom-video-player{
    width: 100%;}
    .factory-stones{
    width: 92%;
}

    .stone-grid{

        grid-template-columns:repeat(2,1fr);
    }

}

@media(max-width:576px){
    .factory-stones{
    width: 98%;
}

    .stone-grid{

        grid-template-columns:1fr;
    }

}
.factory-video-section{
width: 80%;
    margin:0 0;
}

.custom-video-player{
    width: 45%;

    position:relative;

    overflow:hidden;

    border-radius:25px;

    background:#000;

    box-shadow:
    0 10px 40px rgba(0,0,0,.08);
}

.custom-video-player video{

    width:100%;
    display:block;
}

.play-btn{

    position:absolute;

    top:50%;
    left:50%;

    transform:translate(-50%,-50%);

    width:90px;
    height:90px;

    border:none;

    border-radius:50%;

    background:rgba(255,255,255,.9);

    font-size:30px;

    cursor:pointer;

    transition:.3s;

    z-index:2;
}

.play-btn:hover{

    transform:
    translate(-50%,-50%)
    scale(1.08);
}

.video-controls{

    position:absolute;

    bottom:0;

    width:100%;

    background:
    linear-gradient(
    transparent,
    rgba(0,0,0,.8));

    padding:20px;

    display:flex;

    align-items:center;

    gap:15px;

    color:#fff;
}

.video-controls input{

    flex:1;
}

#muteBtn{

    border:none;

    background:none;

    color:#fff;

    font-size:20px;

    cursor:pointer;
}
@media(max-width:992px){
    .custom-video-player{
    width: 100%;
    margin-bottom: 20px;}}
    .factory-gallery{

    margin:60px 0;
}

.gallery-grid{

    display:grid;

    grid-template-columns:
    repeat(3,1fr);

    gap:15px;
}

.gallery-img{

    width:100%;
    height:250px;

    object-fit:cover;

    border-radius:20px;

    cursor:pointer;

    transition:.3s;
}

.gallery-img:hover{

    transform:scale(1.03);
}

.gallery-modal{

    position:fixed;

    inset:0;

    background:
    rgba(0,0,0,.9);

    display:none;

    align-items:center;
    justify-content:center;

    z-index:9999;
}

.gallery-modal.active{

    display:flex;
}

.gallery-modal img{

    max-width:90%;
    max-height:90%;

    border-radius:15px;
}

.close-gallery{

    position:absolute;

    top:30px;
    right:30px;

    color:#fff;

    font-size:35px;

    cursor:pointer;
}
@media(max-width:768px){

    .gallery-grid{

        grid-template-columns:
        repeat(2,1fr);
    }

}

@media(max-width:576px){

    .gallery-grid{

        grid-template-columns:1fr;
    }

    .gallery-img{

        height:220px;
    }

}
.services-section{
	width: 80%;
    padding:20px 0;
}

.section-header{
    text-align:center;
    margin-bottom:40px;
}

.section-header h2{
    font-size:34px;
    font-weight:700;
    color:#1e293b;
    margin-bottom:10px;
}

.section-header p{
    color:#64748b;
    font-size:15px;
}

.services-wrapper{
    display:grid;
    grid-template-columns:repeat(6,1fr);
    gap:20px;
}

.service-card{
    background:#fff;
    border:1px solid #e2e8f0;
    border-radius:20px;
    padding:28px 20px;
    text-align:center;
    transition:.3s;
}

.service-card:hover{
    transform:translateY(-5px);
    box-shadow:0 15px 30px rgba(0,0,0,.08);
}

.icon-box{
    
    margin:auto;
    margin-bottom:20px;
    border-radius:18px;
    background:#eff6ff;
    display:flex;
    align-items:center;
    justify-content:center;
}

.icon-box img{
    width:130px;
    height:130px;
}

.service-card h3{
    font-size:18px;
    color:#1e293b;
    margin-bottom:12px;
}

.service-card p{
    color:#64748b;
    font-size:14px;
    line-height:28px;
    min-height:84px;
}

.service-card a{
    color:#2563eb;
    text-decoration:none;
    font-weight:600;
    display:inline-block;
    margin-top:15px;
}

.service-card a:hover{
    color:#1d4ed8;
}

/* Tablet */

@media(max-width:1400px){
	.services-section{
	width: 92%;
    padding:40px 0;
}

    .services-wrapper{
        display:flex;
        overflow-x:auto;
        gap:16px;
        padding-bottom:10px;
        scroll-snap-type:x mandatory;
    }

    .service-card{
		width: calc((100% - 16px) / 3.6);
        min-width:200px;
        flex-shrink:0;
        scroll-snap-align:start;
    }

    .services-wrapper::-webkit-scrollbar{
        height:6px;
    }

    .services-wrapper::-webkit-scrollbar-thumb{
        background:#cbd5e1;
        border-radius:20px;
    }

}


/* Mobile */

@media(max-width:768px){
	.services-section{
	width: 96%;
    padding:40px 0;
}

   

    .section-header h2{
        font-size:26px;
    }

    .service-card{
		width: calc((100% - 16px) / 1.6);
        min-width:200px;
		
    }

}
.team-section {
	width: 80%;
    padding: 10px 0;
    background: #fff;
}

.container {
    width: 100%;
    margin: auto;
}

.section-header {
    text-align: center;
    margin-bottom: 40px;
}

.section-header h2 {
    font-size: 32px;
    font-weight: 800;
    color: #1e293b;
    margin-bottom: 10px;
}

.section-header p {
    color: #94a3b8;
    font-size: 15px;
}

/* دسکتاپ */
.team-slider {
	overflow-x: auto;
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: 10px;
}

.team-card {
    background: #fff;
    border: 1px solid #edf2f7;
    border-radius: 22px;
    padding: 22px;
    text-align: center;
    transition: .3s;
    box-shadow: 0 5px 20px rgba(15,23,42,.04);
}

.team-card:hover {
    transform: translateY(-6px);
    box-shadow: 0 15px 35px rgba(15,23,42,.08);
}

.team-image {
    width: 200px;
    height: 200px;
    margin: auto auto 18px;
    overflow: hidden;
    border-radius: 18px;
	
}

.team-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.team-card h3 {
    font-size: 17px;
    font-weight: 700;
    color: #0f172a;
    margin-bottom: 6px;
}

.team-card span {
    display: block;
    font-size: 14px;
    color: #64748b;
    margin-bottom: 15px;
}

.linkedin-btn {
    width: 32px;
    height: 32px;
    background: #2563eb;
    color: #fff;
    border-radius: 8px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
}



/* موبایل */
@media (max-width:1400px) {
	.team-section {
	width: 92%;
    padding: 10px 0;
    background: #fff;
}

    .team-slider {
        display: flex;
        gap: 16px;
        overflow-x: auto;
        overflow-y: hidden;
        padding-bottom: 10px;
        scroll-snap-type: x mandatory;
        -webkit-overflow-scrolling: touch;
    }

    .team-slider::-webkit-scrollbar {
        height: 5px;
    }

    .team-slider::-webkit-scrollbar-thumb {
        background: #cbd5e1;
        border-radius: 20px;
    }

    .team-card {
        flex: 0 0 240px;
        scroll-snap-align: start;
    }

}


.about-section{
	direction: rtl;
	width: 80%;
}

.about-container{
    margin:auto;
    background:#fff;
    border-radius:30px;
    overflow:hidden;
    display:flex;
    align-items:center;
	justify-content: flex-start;
    gap:50px;
    padding:50px;
    box-shadow:0 15px 40px rgba(0,0,0,.08);
}

.about-content{
    flex: 1;
	display: flex;
	flex-direction: column;
	align-items: center;
}	

.section-title{
    color:#0d6efd;
    font-size:18px;
    font-weight:bold;
    position:relative;
    display:flex;
	align-items: center;
	justify-content: center;
    margin-bottom:20px;
}


.section-title::before{
    right: 120%;
}

.section-title::after{
    left:120%;
}

.about-content h2{
    font-size:42px;
    color:#1e293b;
    margin-bottom:25px;
    line-height:1.6;
}

.about-content p{
    color:#64748b;
    font-size:17px;
    line-height:2.2;
    margin-bottom:15px;
}

.about-features{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:20px;
    margin-top:40px;
}

.feature-box{
    background:#f8fbff;
    border:1px solid #e2e8f0;
    border-radius:20px;
    padding:25px 15px;
    text-align:center;
    transition:.3s;
}

.feature-box:hover{
    transform:translateY(-5px);
    border-color:#0d6efd;
    box-shadow:0 10px 25px rgba(13,110,253,.15);
}

.feature-box i{
    font-size:40px;
    display:block;
    margin-bottom:15px;
}

.feature-box h4{
    color:#0d6efd;
    margin-bottom:10px;
    font-size:18px;
}

.feature-box p{
    font-size:14px;
    margin:0;
    line-height:1.8;
}

.about-image{
    flex:.5;
}

.about-image img{
    width:100%;
    height:650px;
    object-fit:cover;
    border-radius:25px;
    display:block;
}

/* Tablet */

@media(max-width:992px){
	
	.about-section{
	direction: rtl;
	width: 96%;
}

    .about-container{
        flex-direction:column-reverse;
        padding:35px;
    }

    .about-content h2{
        font-size:34px;
    }

    .about-image img{
        height:500px;
    }

    .about-features{
		width: 100%;
        grid-template-columns:repeat(3,fr);
    }

}

/* Mobile */

@media(max-width:576px){

    .about-section{
        padding:30px 10px;
    }

    .about-container{
        padding:20px;
        border-radius:20px;
    }

    .about-content h2{
        font-size:28px;
    }

    .about-content p{
        font-size:15px;
    }

    .about-features{
        grid-template-columns:1fr;
    }

    .about-image img{
        height:300px;
    }

}

.contact-section {
	width: 80%;
    padding: 80px 0;
}

.contact-section > .container {
width: 100%;}
.section-title {
	display: flex;
	flex-direction: column;
	align-items: center;
    text-align: center;
    margin-bottom: 50px;
}

.section-title h2 {
    font-size: 42px;
    font-weight: 800;
    color: #0f172a;
    margin-bottom: 15px;
}

.section-title p {
    color: #64748b;
    font-size: 16px;
    max-width: 700px;
    margin: auto;
}

.contact-wrapper {
	width: 100%;
    display: flex;
    gap: 24px;
    margin-bottom: 30px;
}

.contact-map {
	width: 50%;
    overflow: hidden;
    border-radius: 28px;
    border: 1px solid #e2e8f0;
    background: #fff;
    min-height: 350px;
}

.contact-map iframe {
    width: 100%;
    height: 100%;
    border: 0;
}

.contact-info {
	width: calc(50% - 24px);
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.info-card {
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 24px;
    padding: 10px;
    display: flex;
    align-items: flex-start;
	flex-direction: row;
    gap: 20px;
    transition: .3s;
}

.info-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 15px 40px rgba(15,23,42,.08);
}

.info-card > .icon-box > img{
	width: 100%;
}
.info-card > .icon-box {
	margin: 0;
    width: 72px;
    height: 72px;
    min-width: 72px;
    border-radius: 20px;
    background: #eff6ff;
    display: flex;
    align-items: center;
    justify-content: center;
}

.content  {width: calc(100% - 100px);
}

.content h3 {
    font-size: 22px;
    color: #2563eb;
    margin-bottom: 8px;
    font-weight: 700;
}

.content p,
.content a {
    color: #64748b;
    text-decoration: none;
    line-height: 1.8;
}

.contact-features {
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 28px;
    padding: 35px;
    display: grid;
    grid-template-columns: repeat(4,1fr);
    gap: 30px;
}

.feature-box {
    text-align: center;
}

.feature-box i {
    font-size: 40px;
    color: #2563eb;
    margin-bottom: 15px;
}

.feature-box h4 {
    margin-bottom: 10px;
    color: #0f172a;
}

.feature-box p {
    color: #64748b;
    font-size: 14px;
}

/* Tablet */

@media (max-width: 992px) {
	.contact-section {
	width: 96%;
}

    .contact-wrapper {
		display: grid;
        grid-template-columns: 1fr;
    }
	.contact-info{
		width: 100%;
	}

    .contact-map {
		width: 100%;
        min-height: 400px;
    }

    .contact-features {
		width: 100%;
        grid-template-columns: repeat(2,1fr);
    }

}

/* Mobile */

@media (max-width: 576px) {

    .section-title h2 {
        font-size: 30px;
    }

    .info-card {
        padding: 20px;
        gap: 15px;
    }

    .icon-box {
        width: 60px;
        height: 60px;
        min-width: 60px;
    }

    .icon-box i {
        font-size: 24px;
    }

    .content h3 {
        font-size: 18px;
    }

    .contact-features {
        grid-template-columns: 1fr;
        padding: 25px;
    }

}
.product-hero{

	width: 80%;
    margin:auto;

    display:flex;
    gap:30px;

    align-items:flex-start;

}
.gallery-wrapper{
	position: relative;
}
.product-hero>.product-info{
	border: 1px solid var(--backgrund);

    width:calc(65% - 30px);

    background:#fff;

    border-radius:20px;

    padding:30px;

    box-shadow:
    0 5px 20px rgba(0,0,0,.04);
}
.product-code{

    display:inline-block;

    padding:8px 14px;

    background:#f2f4f8;

    border-radius:10px;

    font-size:14px;
}
.product-title{

    margin-top:20px;

    font-size:38px;

    font-weight:700;

    color:#222;
}
.product-company{

    margin-top:10px;

    color:#666;

    font-size:15px;
}
.product-description{

    margin-top:20px;

    line-height:2;

    color:#666;
}
.product-rating{

    margin-top:20px;

    color:#f6b100;
}
.product-price{

    margin-top:30px;

    font-size:42px;

    font-weight:700;

    color:#0a61ff;
}
.product-actions{

    display:flex;

    flex-direction:column;

    gap:15px;

    margin-top:30px;
}
.btn-outline{

    height:58px;

    border:2px solid #0a61ff;

    background:#fff;

    color:#0a61ff;

    border-radius:14px;

    cursor:pointer;
}
.btn-primary{


    border:none;

    background:#0a61ff;

    color:#fff;

    border-radius:14px;

    cursor:pointer;
}
.product-gallery{
	width: 35%;
}
.gallery-wrapper>.gallery-wrapper{

    position:relative;

    background:#fff;

    border-radius:20px;

    overflow:hidden;

    box-shadow:
    0 5px 25px rgba(0,0,0,.05);
}
.productSwiper{

    width:100%;
}
.productSwiper{
	padding: 0;
}
a.swiper-slide.swiper-pad{
	padding: 0;
	margin: 0;
}
.productSwiper img{

    width:100%;
    height:100%;

    object-fit:cover;

}
.gallery-actions{

    position:absolute;

    top:20px;
    left:20px;

    z-index:50;

    display:flex;

    flex-direction:column;

    gap:10px;
}
.action-btn{

    width:48px;
    height:48px;

    border:none;

    background:#fff;

    border-radius:12px;

    cursor:pointer;

    box-shadow:
    0 5px 20px rgba(0,0,0,.15);

    font-size:18px;
}
.swiper-button-next,
.swiper-button-prev{

    width:50px !important;
    height:50px !important;

    background:#fff;

    border-radius:50%;

    box-shadow:
    0 5px 15px rgba(0,0,0,.15);
}
.swiper-button-next::after,
.swiper-button-prev::after{

    font-size:18px !important;
    color:#333;
}
.thumbSwiper{
	gap: 10px;
    margin-top:15px;
}
.thumbSwiper .swiper-slide{
	min-width: calc((100% - 30px) / 4);
   

    border-radius:12px;

    overflow:hidden;

    opacity:.5;

    cursor:pointer;

    border:2px solid transparent;
}
.thumbSwiper .swiper-slide-thumb-active{

    opacity:1;

    border-color:#0a61ff;
}
.thumbSwiper img{

    width:100%;
    height:100%;

    object-fit:cover;
}
.wishlist-btn.active{

    background:#0a61ff;

    color:#fff;
}
a.swiper-slide.swiper-pad{
	padding: 0;
	margin: 0;
}

@media(max-width:1400px){

    .product-hero{
		width: 92%;
    }

    
}@media(max-width:1050px){
	.product-hero>.product-info{
	border: 1px solid var(--backgrund);

    width:100%;

    background:#fff;

    border-radius:20px;

    padding:30px;

    box-shadow:
    0 5px 20px rgba(0,0,0,.04);
}
.product-gallery{
	width: 100%;
}

    .product-hero{
		width: 96%;
        flex-direction:column;
    }

    
}
@media(max-width:768px){
	.product-actions > .btn-primary{
		padding: 15px 30px;
	}

    .productSwiper{

        height:380px;
    }

    .gallery-actions{

        top:10px;
        left:10px;
    }

    .action-btn{

        width:42px;
        height:42px;
    }

    .thumbSwiper .swiper-slide{

        height:80px;
    }

}
/* ===========================
   Product Details Section
=========================== */

.product-details-section{

    direction: rtl;

    display:flex;

    gap:24px;

    margin-top:30px;

    align-items:flex-start;
}

/* کارت ها */

.product-specs-card,
.product-about-card{

    background:#fff;

    border-radius:20px;

    padding:30px;

    box-shadow:0 5px 25px rgba(0,0,0,.04);
}

/* عرض ستون ها */

.product-specs-card{

    width:38%;
}

.product-about-card{

    width:62%;
}

/* تیتر */

.section-title{

    font-size:28px;

    font-weight:700;

    margin-bottom:25px;

    color:#222;
}

/* ===========================
   جدول مشخصات
=========================== */

.specs-table{

    border:1px solid #edf1f7;

    border-radius:14px;

    overflow:hidden;
}

.spec-row{

    display:flex;

    justify-content:space-between;

    align-items:center;

    padding:16px 20px;

    border-bottom:1px solid #edf1f7;
}

.spec-row:last-child{

    border-bottom:none;
}

.spec-row span:first-child{

    color:#666;

    font-weight:500;
}

.spec-row span:last-child{

    color:#222;

    font-weight:600;
}

/* ===========================
   باکس مزایا
=========================== */

.spec-features{

    display:flex;

    justify-content:space-between;

    gap:15px;

    margin-top:30px;
}

.feature-item{

    flex:1;

    text-align:center;

    border:1px solid #edf1f7;

    border-radius:14px;

    padding:20px 10px;
}

.feature-icon{

    font-size:28px;

    margin-bottom:10px;
}

.feature-item strong{

    display:block;

    margin-bottom:6px;

    font-size:15px;
}

.feature-item p{

    font-size:13px;

    color:#777;
}

/* ===========================
   درباره محصول
=========================== */

.product-about-text{

    line-height:2.2;

    color:#555;

    margin-bottom:30px;
}

.about-box{

    margin-top:30px;
}

.about-box h3{

    font-size:22px;

    margin-bottom:20px;

    color:#222;
}

/* ویژگی ها */

.feature-list{

    list-style:none;

    padding:0;

    margin:0;
}

.feature-list li{

    position:relative;

    padding-right:24px;

    margin-bottom:14px;

    color:#444;
}

.feature-list li::before{

    content:"✓";

    position:absolute;

    right:0;

    color:#0a61ff;

    font-weight:bold;
}

/* کاربردها */

.applications{

    display:flex;

    flex-wrap:wrap;

    gap:15px;
}

.app-item{

    min-width:130px;

    text-align:center;

    padding:15px;

    border:1px solid #e7edf7;

    border-radius:14px;

    background:#fafcff;

    transition:.3s;
}

.app-item:hover{

    border-color:#0a61ff;

    transform:translateY(-3px);
}

/* ===========================
   Tablet
=========================== */

@media(max-width:992px){

    .product-details-section{

        flex-direction:column;
    }

    .product-specs-card,
    .product-about-card{

        width:100%;
    }

}
.factory-register{
    width:80%;
    background:#fff;
    border-radius:32px;
    padding:50px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:60px;

    border:1px solid #eef2ff;

    background:
    linear-gradient(
        135deg,
        #ffffff 0%,
        #f7faff 100%
    );

    box-shadow:
    0 10px 40px rgba(0,0,0,.04);
}

.factory-register__image{
    width:37%;
    display:flex;
    justify-content:center;
    align-items:center;
}

.factory-register__image img{
    width:100%;
    max-width:420px;
    object-fit:contain;
}

.factory-register__content{
    width:63%;
}

.section-badge{
    display:inline-flex;
    align-items:center;
    gap:8px;

    padding:8px 16px;

    border-radius:30px;

    background:#edf4ff;
    color:#246BFD;

    font-size:13px;
    font-weight:600;
}

.factory-register__content h2{
    margin:18px 0 16px;

    font-size:38px;
    font-weight:800;
    color:#111827;
}

.factory-register__content p{
    color:#6b7280;
    line-height:2.1;
    font-size:15px;
    margin-bottom:30px;
}

.factory-features{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:16px;

    list-style:none;
    padding:0;
    margin:0 0 35px;
}

.factory-features li{
    display:flex;
    align-items:center;
    gap:10px;

    color:#374151;
    font-weight:500;
}

.factory-features i{
    color:#246BFD;
    font-size:18px;
}

.factory-register__actions{
    display:flex;
    gap:15px;
    flex-wrap:wrap;
}



.btn-outline:hover{
    background:#246BFD;
    color:#fff;
}@media(max-width:992px){

    .factory-register{
        padding:35px;
        gap:40px;
    }

    .factory-register__content h2{
        font-size:30px;
    }
}

@media(max-width:768px){

    .factory-register{
        flex-direction:column;
        text-align:center;
        padding:30px 20px;
    }

    .factory-register__image,
    .factory-register__content{
        width:100%;
    }

    .factory-register__image img{
        max-width:280px;
    }

    .factory-register__content h2{
        font-size:28px;
    }

    .factory-features{
        grid-template-columns:1fr;
        text-align:right;
    }

    .factory-register__actions{
        flex-direction:column;
    }

    
}
.story-viewer{
    position:fixed;
    inset:0;
    background:#000;
    z-index:9999;
    display:none;
    overflow:hidden;
}

.story-content{
    width:100%;
    height:100%;
    display:flex;
    align-items:center;
    justify-content:center;
}

.story-content img,
.story-content video{
    width:100%;
    height:100%;
    object-fit:contain;
}

.story-header{
    position:absolute;
    top:10px;
    left:0;
    width:100%;
    z-index:5;
    display:flex;
    align-items:center;
    gap:10px;
    padding:0 15px;
    color:#fff;
}

.story-header img{
    width:40px;
    height:40px;
    border-radius:50%;
}

.story-progress{
    position:absolute;
    top:0;
    left:0;
    height:4px;
    background:#fff;
    width:0%;
    z-index:10;
}

#closeStory{
    margin-right:auto;
    background:none;
    border:none;
    color:#fff;
    font-size:24px;
    cursor:pointer;
}
.dg-marketplace-features-section{
    width:90%;
    max-width:1400px;
    margin:30px auto;
}

.dg-marketplace-features-header{
    text-align:center;
    max-width:850px;
    margin:auto;
}

.dg-marketplace-features-badge{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    padding:10px 22px;
    border-radius:50px;
    background:#eef4ff;
    color:var(--blue);
    font-size:14px;
    font-weight:700;
}

.dg-marketplace-features-title{
    font-size:42px;
    font-weight:800;
    color:#111827;
    margin-top:20px;
    line-height:1.5;
}

.dg-marketplace-features-description{
    margin-top:15px;
    color:#6b7280;
    font-size:17px;
    line-height:2;
}

.dg-marketplace-features-grid{
    margin-top:15px;

    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:10px;
}

.dg-marketplace-feature-card{
    background:#fff;
    border:1px solid #edf0f6;
    border-radius:28px;
    padding:35px;

    transition:.35s;
    position:relative;
    overflow:hidden;
}

.dg-marketplace-feature-card::before{
    content:"";

    position:absolute;
    top:0;
    right:0;

    width:100%;
    height:5px;

    background:linear-gradient(
        90deg,
        var(--blue),
        #72a7ff
    );

    transform:scaleX(0);
    transition:.35s;
}

.dg-marketplace-feature-card:hover{
    transform:translateY(-8px);

    box-shadow:
    0 15px 45px rgba(0,0,0,.08);
}

.dg-marketplace-feature-card:hover::before{
    transform:scaleX(1);
}

.dg-marketplace-feature-icon{

    width:80px;
    height:80px;

    border-radius:24px;

    display:flex;
    align-items:center;
    justify-content:center;

    background:#eef4ff;

    margin-bottom:22px;
}

.dg-marketplace-feature-icon img{
    width:78px;
    height:78px;
}

.dg-marketplace-feature-card h3{
    font-size:24px;
    font-weight:700;
    color:#111827;
    margin-bottom:15px;
}

.dg-marketplace-feature-card p{
    color:#6b7280;
    line-height:2;
    font-size:15px;
}
@media(max-width:1100px){

    .dg-marketplace-features-grid{
        grid-template-columns:repeat(2,1fr);
    }

    .dg-marketplace-features-title{
        font-size:34px;
    }

}

@media(max-width:768px){

    .dg-marketplace-features-section{
        width:95%;
        margin:25px auto;
    }

    .dg-marketplace-features-grid{
        grid-template-columns:1fr;
        gap:18px;
    }

    .dg-marketplace-feature-card{
        padding:2	5px;
    }

    .dg-marketplace-feature-icon{
        width:65px;
        height:65px;
        border-radius:18px;
    }

    .dg-marketplace-feature-icon img{
        width:65px;
        height:65px;
    }

    .dg-marketplace-features-title{
        font-size:28px;
    }

    .dg-marketplace-features-description{
        font-size:15px;
    }

}
.dgs-marketplace-plans{
    width:95%;
    max-width:1500px;
    margin:20px auto;
}

.dgs-plan-header{
    text-align:center;
    margin-bottom:60px;
}

.dgs-plan-header span{
    color:var(--blue);
    font-weight:700;
}

.dgs-plan-header h2{
    font-size:40px;
    margin:15px 0;
}

.dgs-plan-header p{
    color:#666;
    max-width:700px;
    margin:auto;
}

.dgs-plan-grid{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:25px;
}

.dgs-plan-card{
    background:#fff;
    border-radius:30px;
    padding:15px 25px;
    position:relative;
    transition:.35s;
    border:1px solid #eee;
}

.dgs-plan-card:hover{
    transform:translateY(-8px);
}

.plan-top h3{
    font-size:25px;
    margin-bottom:10px;
}

.plan-top p{
    color:#666;
    line-height:1.8;
}

.plan-price{
    margin:10px 0;
}

.plan-price strong{
    font-size:42px;
    display:block;
    font-weight:800;
}

.plan-price span{
    color:#777;
}

.dgs-plan-card ul{
    list-style:none;
    padding:0;
    margin:0;
}

.dgs-plan-card li{
    padding:8px 0;
    border-bottom:1px solid #f1f1f1;
    font-size:15px;
}

.dgs-plan-card li:last-child{
    border:none;
}

.dgs-plan-card a{
    display:flex;
    justify-content:center;
    align-items:center;
    text-decoration:none;
    height:45px;
    border-radius:16px;
    margin-top:10px;
    font-weight:700;
}

/* SILVER */

.silver-plan{
    border-top:5px solid #bfc5d2;
}

.silver-plan a{
    background:#eef1f6;
    color:#333;
}

/* GOLD */

.gold-plan{
    background:
    linear-gradient(180deg,#fff8e6 0%,#fff 100%);
    border:4px solid #f6c64d;
    transform:scale(1.08);
    box-shadow:
    0 25px 60px rgba(246,198,77,.25);
}

.gold-plan:hover{
    transform:scale(1.08) translateY(-10px);
}

.gold-plan .plan-price strong{
    color:#c79000;
}

.gold-plan a{
    background:#f6c64d;
    color:#000;
}

.best-badge{
    position:absolute;
    top:-15px;
    right:50%;
    transform:translateX(50%);
    background:#f6c64d;
    color:#000;
    padding:8px 22px;
    border-radius:50px;
    font-size:14px;
    font-weight:800;
}

/* DIAMOND */

.diamond-plan{
    border-top:5px solid #62d6ff;
}

.diamond-plan a{
    background:#62d6ff;
    color:#fff;
}

/* VIP */

.vip-plan{
	border:5px solid #f6c64d;
    background:var(--black);
    color:#fff;
}

.vip-plan p,
.vip-plan span{
    color:#d0d0d0;
}

.vip-plan a{
    background:#fff;
    color:#111;
}
@media(max-width:1200px){

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

    .gold-plan{
        transform:none;
    }

    .gold-plan:hover{
        transform:translateY(-10px);
    }
}

@media(max-width:768px){

    .dgs-plan-grid{
        grid-template-columns:1fr;
    }

    .dgs-plan-header h2{
        font-size:30px;
    }

    .plan-price strong{
        font-size:42px;
    }

    .dgs-plan-card{
        padding:25px;
    }
}
.dgs-plans-comparison-section{
    width:95%;
    max-width:1500px;
    margin:20px auto;
}

.dgs-plans-comparison-header{
    text-align:center;
    margin-bottom:50px;
}

.dgs-plans-comparison-header span{
    color:var(--blue);
    font-weight:700;
}

.dgs-plans-comparison-header h2{
    font-size:38px;
    margin:15px 0;
}

.dgs-plans-comparison-header p{
    color:#6b7280;
}

.dgs-comparison-table-wrapper{
    overflow-x:auto;
    border-radius:24px;
}

.dgs-comparison-table{
    width:100%;
    border-collapse:collapse;
    background:#fff;
    min-width:900px;
}

.dgs-comparison-table thead th{
    padding:19px;
    font-size:17px;
    font-weight:700;
    border-bottom:1px solid #e5e7eb;
}

.dgs-comparison-table tbody td{
    padding:12px;
    text-align:center;
    border-bottom:1px solid #f3f4f6;
}

.dgs-comparison-table tbody td:first-child{
    text-align:right;
    font-weight:600;
    color:#111827;
}

.dgs-comparison-table tbody tr:hover{
    background:#f9fafb;
}

.silver-col{
    background:#f3f4f6;
}

.gold-col{
    background:#fff8df;
    color:#b8860b;
    position:relative;
}

.gold-col span{
    display:block;
    font-size:12px;
    margin-top:6px;
    background:#f6c64d;
    color:#111;
    padding:4px 10px;
    border-radius:30px;
    width:max-content;
    margin-inline:auto;
}
.vip-col span{
    display:block;
    font-size:12px;
    margin-top:6px;
    background:#f6c64d;
    color:#111;
    padding:4px 10px;
    border-radius:30px;
    width:max-content;
    margin-inline:auto;
}

.diamond-col{
    background:#ecfeff;
    color:#0891b2;
}

.vip-col{
    background:#111827;
    color:#fff;
}
.dgs-comparison-table td:nth-child(3),
.dgs-comparison-table th:nth-child(3){
    background:#fff8df;
}
.dgs-comparison-table th:nth-child(3){
    box-shadow:
    inset 0 4px 0 #f6c64d;
}
.ds-marketplace-stores{
    width:100%;
    padding:10px 10%;
    background:#f8fbff;
}

.ds-marketplace-header{
    text-align:center;
    max-width:800px;
    margin:auto;
}

.ds-marketplace-badge{
    display:inline-flex;
    background:#dbeafe;
    color:#2563eb;
    padding:8px 16px;
    border-radius:100px;
    font-size:13px;
    font-weight:700;
}

.ds-marketplace-header h2{
    margin-top:18px;
    font-size:30px;
    color:#0f172a;
}

.ds-marketplace-header p{
    margin-top:15px;
    color:#64748b;
    line-height:2;
}

.ds-marketplace-slider{
    margin-top:10px;
    display:grid;
    grid-template-columns:repeat(5,1fr);
    gap:15px;
}

.ds-store-card{
    background:#fff;
    border-radius:18px;
    overflow:hidden;
    position:relative;
    border:1px solid #e5e7eb;
    transition:.35s;
}

.ds-store-card:hover{
    transform:translateY(-8px);
    box-shadow:0 20px 50px rgba(0,0,0,.08);
}



.ds-store-cover img{
    width:100%;
    height:100%;
    object-fit:cover;
}

.ds-store-logo{
    width:65px;
    height:65px;
    background:#fff;
    border-radius:18px;
    position:absolute;
    border: 2px solid var(--backgrund);
    top:135px;
    right:25px;
    box-shadow:0 10px 30px rgba(0,0,0,.1);
}

.ds-store-logo img{
    width:100%;
    height:100%;
    object-fit:contain;
    border-radius:18px;
}

.ds-store-content{
    padding:30px 10px 10px;
}

.ds-store-content h3{
    font-size:22px;
    color:#0f172a;
}

.ds-store-location{
    display:block;
    margin-top:10px;
    color:#64748b;
}

.ds-store-stats{
    margin-top:25px;
    display:flex;
    justify-content:space-between;
}

.ds-store-stats div{
    text-align:center;
}

.ds-store-stats strong{
    display:block;
    color:#2563eb;
    font-size:22px;
}

.ds-store-stats span{
    color:#64748b;
    font-size:13px;
}

.ds-store-btn{
    margin-top:25px;
    display:flex;
    justify-content:center;
    align-items:center;
    height:52px;
    border-radius:14px;
    text-decoration:none;
    background:#2563eb;
    color:#fff;
    font-weight:700;
}

.featured{
    border:2px solid #2563eb;
}

@media(max-width:1300px){
	.ds-marketplace-stores{
    width:100%;
    padding:10px 2%;
    background:#f8fbff;
}

    .ds-marketplace-header h2{
        font-size:28px;
    }

    .ds-marketplace-slider{
        display:flex;
        overflow-x:auto;
        gap:15px;
        padding-bottom:0px;
        scroll-snap-type:x mandatory;
    }

    .ds-store-card{
        width: calc((100% - 30px ) / 3);
        flex-shrink:0;
        scroll-snap-align:start;
    }

    .ds-marketplace-slider::-webkit-scrollbar{
        height:5px;
    }

    .ds-marketplace-slider::-webkit-scrollbar-thumb{
        background:#2563eb;
        border-radius:20px;
    }

}
@media(max-width:850px){
    .ds-store-btn{
        font-size: 15px;
    margin-top:15px;
    display:flex;
    justify-content:center;
    align-items:center;
    height:38px;
    border-radius:10px;
    text-decoration:none;
    background:#2563eb;
    color:#fff;
    font-weight:700;
}
    .ds-store-stats strong{
    display:block;
    color:#2563eb;
    font-size:18px;
}

.ds-store-stats span{
    color:#64748b;
    font-size:10px;
}
    .ds-store-content h3{
    font-size:18px;
    color:#0f172a;
}
    .ds-store-logo{
        width:60px;
    height:60px;
    background:#fff;
    border-radius:18px;
    position:absolute;
    border: 2px solid var(--backgrund);
    top:95px;
    right:15px;
    box-shadow:0 10px 30px rgba(0,0,0,.1);
}
    .ds-store-stats{
    margin-top:15px;
    display:flex;
    justify-content:space-between;
}
	.ds-marketplace-stores{
    width:100%;
    padding:10px 2%;
    background:#f8fbff;
}

    .ds-marketplace-header h2{
        font-size:28px;
    }

    .ds-marketplace-slider{
        display:flex;
        overflow-x:auto;
        gap:15px;
        padding-bottom:0px;
        scroll-snap-type:x mandatory;
    }

    .ds-store-card{
        
        width: calc((100% - 30px ) / 1.6);
        flex-shrink:0;
        scroll-snap-align:start;
    }

    .ds-marketplace-slider::-webkit-scrollbar{
        height:5px;
    }

    .ds-marketplace-slider::-webkit-scrollbar-thumb{
        background:#2563eb;
        border-radius:20px;
    }

}
.dgs-marketplace-steps-section{
    width:90%;
    max-width:1400px;
    margin:10px auto;
}

.dgs-marketplace-steps-header{
    text-align:center;
    margin-bottom:30px;
}

.dgs-marketplace-steps-badge{
    display:inline-flex;
    padding:8px 18px;
    background:#eef4ff;
    color:var(--blue);
    border-radius:50px;
    font-size:14px;
    margin-bottom:10px;
}

.dgs-marketplace-steps-header h2{
    font-size:38px;
    margin-bottom:10px;
    color:#0f172a;
}

.dgs-marketplace-steps-header p{
    max-width:700px;
    margin:auto;
    color:#64748b;
    line-height:2;
}

.dgs-marketplace-steps-wrapper{
    display:flex;
    align-items:flex-start;
    justify-content:center;
}

.dgs-marketplace-step-line{
    flex:1;
    height:3px;
    margin-top:30px;
    background:linear-gradient(
        90deg,
        #2563eb,
        #93c5fd
    );
}

.dgs-marketplace-step-card{
    width:260px;
    text-align:center;
    position:relative;
}

.dgs-marketplace-step-number{
    position:absolute;
    top:-15px;
    left:50%;
    transform:translateX(-50%);
    font-size:55px;
    font-weight:800;
    color:#e2e8f0;
    z-index:1;
}

.dgs-marketplace-step-icon{
    width:90px;
    height:90px;
    margin:auto;
    background:white;
    border-radius:24px;
    display:flex;
    align-items:center;
    justify-content:center;
    box-shadow:0 10px 35px rgba(0,0,0,.08);
    position:relative;
    z-index:2;
}

.dgs-marketplace-step-icon img{
    width:88px;
}

.dgs-marketplace-step-card h3{
    margin-top:15px;
    margin-bottom:10px;
    font-size:22px;
    color:#0f172a;
}

.dgs-marketplace-step-card p{
    color:#64748b;
    line-height:2;
    font-size:14px;
}
.dgs-step-process-badge{
    position:absolute;
    top:-16px;
    left:50%;
    transform:translateX(-50%);

    padding:8px 18px;

    background:linear-gradient(
        135deg,
        rgba(37,99,235,.12),
        rgba(37,99,235,.05)
    );

    border:1px solid rgba(37,99,235,.15);

    color:var(--blue);

    font-size:13px;
    font-weight:700;

    border-radius:30px;

    backdrop-filter:blur(10px);

    white-space:nowrap;

    z-index:10;
}
@media(max-width:992px){

    .dgs-marketplace-steps-wrapper{
        flex-direction:column;
        gap:30px;
        align-items:center;
    }

    .dgs-marketplace-step-line{
        width:3px;
        height:50px;
        margin:0;
        flex:none;
        background:linear-gradient(
            180deg,
            #2563eb,
            #93c5fd
        );
    }

    .dgs-marketplace-step-card{
        width:100%;
        max-width:380px;
        background:#fff;
        border:1px solid #edf2f7;
        border-radius:24px;
        padding:30px;
        box-shadow:0 8px 30px rgba(0,0,0,.05);
    }

    .dgs-marketplace-step-number{
        left:auto;
        right:20px;
        top:10px;
        transform:none;
        font-size:38px;
    }

    .dgs-marketplace-steps-header h2{
        font-size:28px;
    }
}
.dgs-why-section{
    width:100%;
    max-width:1400px;
    margin:auto;
    padding:10px 20px;
}

.dgs-why-header{
    text-align:center;
    max-width:750px;
    margin:auto;
}

.dgs-why-badge{
    display:inline-block;
    padding:8px 18px;
    background:var(--blue-30);
    color:var(--blue);
    border-radius:50px;
    font-size:14px;
    margin-bottom:15px;
}

.dgs-why-header h2{
    font-size:30px;
    margin-bottom:15px;
}

.dgs-why-header p{
    color:var(--gray);
    line-height:2;
}

.dgs-why-grid{
    margin-top:00px;

    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:15px;
}

.dgs-why-card{
    background:#fff;
    border:1px solid #ececec;
    border-radius:24px;
    padding:10px;
    transition:.3s;
}

.dgs-why-card:hover{
    transform:translateY(-8px);
    box-shadow:0 15px 40px rgba(0,0,0,.08);
}

.dgs-why-card img{
    width:100px;
    height:100px;
}

.dgs-why-card h3{
    margin-bottom:12px;
    font-size:20px;
}

.dgs-why-card p{
    color:#666;
    line-height:2;
}

.dgs-why-card.featured{
    background:linear-gradient(
    135deg,
    var(--blue),
    var(--dark-blue)
    );

    color:white;
}

.dgs-why-card.featured p{
    color:white;
}

.dgs-why-stats{
    margin-top:20px;

    background:#111;
    color:white;

    border-radius:30px;

    padding:40px;

    display:grid;
    grid-template-columns:repeat(4,1fr);

    text-align:center;
}

.dgs-stat-item strong{
    display:block;
    font-size:38px;
    margin-bottom:10px;
}

.dgs-stat-item span{
    color:#ddd;
}

@media (max-width:768px){

    .dgs-why-grid{

        display:flex;
        overflow-x:auto;

        gap:15px;

        padding-bottom:10px;

        scroll-snap-type:x mandatory;

        -webkit-overflow-scrolling:touch;
    }

    .dgs-why-grid::-webkit-scrollbar{
        display:none;
    }

    .dgs-why-grid{
        scrollbar-width:none;
    }

    .dgs-why-card{

        min-width:280px;
        max-width:280px;

        flex-shrink:0;

        scroll-snap-align:start;
    }

}
.dgs-home-seo-section{
    width:100%;
    padding:80px 20px;
    background:#f8f8f8;
}

.dgs-home-seo-container{
    max-width:1100px;
    margin:auto;
}

.dgs-home-seo-header{
    text-align:center;
    margin-bottom:30px;
}

.dgs-home-seo-badge{
    display:inline-block;
    padding:6px 14px;
    background:#fff;
    border:1px solid #eee;
    border-radius:50px;
    font-size:13px;
    color:#777;
    margin-bottom:10px;
}

.dgs-home-seo-header h2{
    font-size:32px;
    margin:0;
}

.dgs-home-seo-content{
    background:#fff;
    border-radius:18px;
    padding:25px;
    line-height:2.2;
    color:#555;

    max-height:160px;
    overflow:hidden;
    position:relative;

    transition:.4s ease;
}

.dgs-home-seo-content p{
    margin-bottom:15px;
}

.dgs-home-seo-content.active{
    max-height:800px;
}

.dgs-home-seo-toggle{
    margin-top:15px;
    background:#111;
    color:#fff;
    border:none;
    padding:10px 18px;
    border-radius:10px;
    cursor:pointer;
    transition:.3s;
}

.dgs-home-seo-toggle:hover{
    background:#333;
}

@media(max-width:768px){
    .dgs-home-seo-section{
    width:100%;
    padding:20px 20px;
    background:#f8f8f8;
}

    .dgs-home-seo-header h2{
        font-size:24px;
    }

    .dgs-home-seo-content{
        font-size:14px;
    }

}
.dgs-testimonial-section{
    padding:20px 10px;
    max-width:1400px;
    margin:auto;
}

.dgs-testimonial-header{
    text-align:center;
    margin-bottom:40px;
}

.dgs-testimonial-header h2{
    font-size:36px;
    margin-bottom:10px;
}

.dgs-testimonial-header p{
    color:#777;
}

/* ===== GRID DESKTOP ===== */
.dgs-testimonial-wrapper{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:20px;
}

/* ===== CARD ===== */
.dgs-testimonial-card{
    background:#fff;
    border:1px solid #eee;
    border-radius:18px;
    padding:25px;
    transition:.3s;
}

.dgs-testimonial-card:hover{
    transform:translateY(-6px);
    box-shadow:0 15px 40px rgba(0,0,0,0.08);
}

.dgs-testimonial-top{
    display:flex;
    align-items:center;
    gap:12px;
    margin-bottom:15px;
}

.dgs-testimonial-top img{
    width:70px;
    height:70px;
    border-radius:50%;
    object-fit:cover;
}

.dgs-testimonial-top h4{
    margin:0;
    font-size:16px;
}

.dgs-testimonial-top span{
    font-size:13px;
    color:#888;
}

.dgs-testimonial-card p{
    color:#555;
    line-height:2;
    font-size:14px;
}

.dgs-rating{
    margin-top:15px;
    color:#f7b500;
    font-size:16px;
}
.img-fluid{
    margin: 15px  0;
    width: 50%;
    border-radius: 25px;
}
/* ===================== */
/* TABLET + MOBILE SCROLL */
/* ===================== */
@media (max-width:1024px){
    .img-fluid{
    width:60%;
    border-radius: 25px;
}
	.dgs-testimonial-section{
		width: 92%;
    padding:20px 10px;
    margin:auto;
}

    .dgs-testimonial-wrapper{
		width: 100%;
        display:flex;
        overflow-x:auto;
        gap:15px;
        scroll-snap-type:x mandatory;
        padding-bottom:10px;
    }

    .dgs-testimonial-wrapper::-webkit-scrollbar{
        display:none;
    }

    .dgs-testimonial-wrapper{
        scrollbar-width:none;
    }

    .dgs-testimonial-card{
        min-width:300px;
        flex-shrink:0;
        scroll-snap-align:start;
    }
}

/* MOBILE SMALL */
@media (max-width:600px){
    .img-fluid{
    width: 100%;
    border-radius: 20px;
}

    .dgs-testimonial-header h2{
        font-size:26px;
    }

    .dgs-testimonial-card{
      width:calc((100% - 20px) / 1.4 );
		
    }
}
.dgs-guide-section{
	width: 80%;
    padding:20px 10px;
    margin:auto;
}

.dgs-guide-header{
    display:flex;
    justify-content:space-between;
    align-items:flex-end;
    gap:20px;
    margin-bottom:40px;
}

.dgs-guide-badge{
    display:inline-block;
    padding:6px 14px;
    border-radius:30px;
    background:var(--blue-30);
    color:var(--blue);
    font-size:13px;
    margin-bottom:10px;
}

.dgs-guide-title-box h2{
    font-size:32px;
    margin-bottom:8px;
}

.dgs-guide-title-box p{
    color:#666;
    line-height:2;
}

.dgs-guide-viewall{
    padding:10px 18px;
    border-radius:12px;
    background:var(--blue);
    color:#fff;
    text-decoration:none;
    font-size:14px;
}

/* Slider */
.dgs-guide-slider{
    display:flex;
    gap:20px;
    overflow-x:auto;
    scroll-snap-type:x mandatory;
    padding-bottom:10px;
}

.dgs-guide-slider::-webkit-scrollbar{
    display:none;
}

/* Card */
.dgs-guide-card{
    min-width:300px;
    width: calc((100% - 60px) / 4);
    background:#fff;
    border-radius:18px;
    overflow:hidden;
    border:1px solid #eee;
    scroll-snap-align:start;
    transition:.3s;
    color: var(--black);
}

.dgs-guide-card:hover{
    transform:translateY(-6px);
    box-shadow:0 10px 30px rgba(0,0,0,.08);
}

.dgs-guide-image{
    position:relative;
    overflow:hidden;
}

.dgs-guide-image img{
    width:100%;
    height:100%;
    object-fit:cover;
}

.dgs-guide-tag{
    position:absolute;
    top:10px;
    right:10px;
    background:var(--blue);
    color:#fff;
    font-size:12px;
    padding:4px 10px;
    border-radius:20px;
}

.dgs-guide-content{
    padding:15px;
}

.dgs-guide-content h3{
    font-size:16px;
    margin-bottom:8px;
    line-height:1.8;
}

.dgs-guide-content p{
    color:#666;
    font-size:13px;
    line-height:1.8;
    margin-bottom:12px;
}

.dgs-guide-meta{
    display:flex;
    justify-content:space-between;
    font-size:12px;
    color:#999;
}

/* Responsive */
@media (max-width:768px){

	.dgs-guide-section{
	width: 94%;}
    .dgs-guide-header{
        flex-direction:column;
        align-items:flex-start;
    }

    .dgs-guide-slider{
        padding-right:10px;
    }

    .dgs-guide-card{
        min-width:260px;
    }
}

@media (max-width:480px){

    .dgs-guide-title-box h2{
        font-size:22px;
    }

    .dgs-guide-card{
        min-width:240px;
    }
}
.dgs-stone-finder-section{
    width:100%;
    padding:60px 20px;
    background:linear-gradient(135deg,#0a1a2f,#0f2f5f);
    color:#fff;
}

.dgs-stone-finder-container{
    max-width:1100px;
    margin:auto;
}

.dgs-stone-finder-header{
    text-align:center;
    margin-bottom:10px;
}

.dgs-stone-finder-badge{
    display:inline-block;
    padding:6px 14px;
    background:rgba(255,255,255,0.1);
    border:1px solid rgba(255,255,255,0.2);
    border-radius:50px;
    font-size:13px;
    margin-bottom:10px;
}

.dgs-stone-finder-header h2{
    font-size:36px;
    margin-bottom:10px;
}

.dgs-stone-finder-header p{
    opacity:0.8;
}

.dgs-stone-finder-box{
    background:rgba(255,255,255,0.06);
    border:1px solid rgba(255,255,255,0.15);
    border-radius:20px;
    padding:30px;
    backdrop-filter: blur(10px);
}

.dgs-stone-finder-grid{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:20px;
}

.dgs-stone-finder-item label{
    display:block;
    font-size:13px;
    margin-bottom:8px;
    opacity:0.8;
}

.dgs-stone-finder-item select{
    width:100%;
    padding:12px;
    border-radius:12px;
    border:1px solid rgba(255,255,255,0.2);
    background:#0b1f3a;
    color:#fff;
    outline:none;
}

.dgs-stone-finder-action{
    margin-top:25px;
    text-align:center;
}

.dgs-stone-finder-action button{
    background:linear-gradient(135deg,#2f80ed,#56ccf2);
    border:none;
    padding:14px 30px;
    border-radius:14px;
    color:#fff;
    font-size:15px;
    cursor:pointer;
    transition:0.3s;
    box-shadow:0 10px 30px rgba(47,128,237,0.3);
}

.dgs-stone-finder-action button:hover{
    transform:translateY(-3px);
}

/* TABLET */
@media(max-width:900px){
    .dgs-stone-finder-section{
    width:100%;
    padding:10px 20px;
    background:linear-gradient(135deg,#0a1a2f,#0f2f5f);
    color:#fff;
}
    .dgs-stone-finder-grid{
        grid-template-columns:repeat(2,1fr);
    }
}

/* MOBILE */
@media(max-width:600px){
    .dgs-stone-finder-grid{
        grid-template-columns:1fr;
    }

    .dgs-stone-finder-header h2{
        font-size:26px;
    }

    .dgs-stone-finder-box{
        padding:20px;
    }
}
.dgs-hero{
    position:relative;
    width:100%;
    overflow:hidden;
    padding:20px 20px;
    background:#fff;
}

.dgs-hero-bg{
    position:absolute;
    top:-50px;
    right:-200px;
    width:600px;
    height:600px;
    background:radial-gradient(circle, #2d8cff33, transparent 60%);
    filter:blur(40px);
}

.dgs-hero-container{
    max-width:1200px;
    margin:auto;
    display:grid;
    grid-template-columns:1.2fr 1fr;
    align-items:center;
}

.dgs-hero-badge{
    display:inline-block;
    padding:8px 14px;
    background:#eaf3ff;
    color:#1d6fd6;
    border-radius:50px;
    font-size:13px;
    margin-bottom:15px;
}

.dgs-hero-content h1{
    font-size:42px;
    line-height:1.7;
    margin-bottom:15px;
}

.dgs-hero-content h1 span{
    color:#1d6fd6;
}

.dgs-hero-content p{
    color:#666;
    line-height:2;
    margin-bottom:25px;
}

.dgs-hero-actions{
    display:flex;
    gap:15px;
    margin-bottom:30px;
    flex-wrap:wrap;
}

.dgs-btn-primary{
    background:#1d6fd6;
    color:#fff;
    padding:12px 22px;
    border-radius:12px;
    text-decoration:none;
    transition:.3s;
}

.dgs-btn-primary:hover{
    background:#155bb0;
}

.dgs-btn-outline{
    border:1px solid #1d6fd6;
    color:#1d6fd6;
    padding:12px 22px;
    border-radius:12px;
    text-decoration:none;
    transition:.3s;
}

.dgs-btn-outline:hover{
    background:#eaf3ff;
}

.dgs-hero-stats{
    display:flex;
    gap:25px;
}

.dgs-hero-stats div{
    text-align:center;
}

.dgs-hero-stats strong{
    font-size:22px;
    color:#1d6fd6;
}

.dgs-hero-stats span{
    display:block;
    font-size:13px;
    color:#777;
}

.dgs-hero-image img{
    width:100%;
    border-radius:20px;
}
/* =========================
   Animated Hero Title
========================= */

.dgs-main-hero-title span{
    display:inline-block;
    opacity:0;
    transform:translateY(40px);
    animation:dgsHeroText .8s forwards;
}

.dgs-main-hero-title span:nth-child(1){animation-delay:.1s;}
.dgs-main-hero-title span:nth-child(2){animation-delay:.3s;}
.dgs-main-hero-title span:nth-child(3){animation-delay:.5s;}

@keyframes dgsHeroText{
    to{
        opacity:1;
        transform:translateY(0);
    }
}
/* =========================
   Animated Waves
========================= */

.dgs-main-wave-bg{
    position:absolute;
    bottom:0;
    left:0;
    width:100%;
    overflow:hidden;
    line-height:0;
    z-index:1;
}

.dgs-main-wave-bg svg{
    display:block;
    width:200%;
    height:220px;
}

.wave1{
    fill:rgba(194, 246, 250, 0.541);
    animation:waveMove1 16s linear infinite;
}

.wave2{
    fill:rgba(182, 207, 236, 0.25);
    animation:waveMove2 10s linear infinite;
}

@keyframes waveMove1{
    0%{
        transform:translateX(0);
    }
    100%{
        transform:translateX(-200px);
    }
}

@keyframes waveMove2{
    0%{
        transform:translateX(-200px);
    }
    100%{
        transform:translateX(0);
    }
}
.dgs-main-hero-image img{
    animation:floatDevice 5s ease-in-out infinite;
}

@keyframes floatDevice{

    0%{
        transform:translateY(0);
    }

    50%{
        transform:translateY(-18px);
    }

    100%{
        transform:translateY(0);
    }
}

/* ===================== RESPONSIVE ===================== */

@media(max-width:992px){

    .dgs-hero-container{
        grid-template-columns:1fr;
        text-align:center;
    }

    .dgs-hero-actions{
        justify-content:center;
    }

    .dgs-hero-stats{
        justify-content:center;
    }

    .dgs-hero-content h1{
        font-size:32px;
    }

}

@media(max-width:600px){

    .dgs-hero{
        padding:10px 15px;
    }

    .dgs-hero-content h1{
        font-size:26px;
    }

    .dgs-hero-stats{
        flex-direction:column;
        gap:10px;
    }

}
.dgs-factory-showcase{
	width: 80%;
    padding:20px 20px;
}

.dgs-factory-header{
    display:flex;
    justify-content:space-between;
    align-items:flex-end;
    gap:20px;
    margin-bottom:35px;
}

.dgs-factory-badge{
    background:#e8f4ff;
    color:#0f5fff;
    padding:8px 18px;
    border-radius:50px;
    display:inline-block;
    margin-bottom:12px;
    font-size:14px;
    font-weight:700;
}

.dgs-factory-header h2{
    font-size:34px;
    margin-bottom:10px;
}

.dgs-factory-header p{
    color:#666;
}

.dgs-factory-more{
    color:#0f5fff;
    font-weight:700;
    text-decoration:none;
}

.dgs-factory-scroll{
	width: 100%;
    display:flex;
    gap:15px;
    overflow-x:auto;
    padding-bottom:15px;
    scroll-behavior:smooth;
}

.dgs-factory-scroll::-webkit-scrollbar{
    height:8px;
}

.dgs-factory-scroll::-webkit-scrollbar-thumb{
    background:#0f5fff;
    border-radius:50px;
}

.dgs-factory-card{
    width:calc((100% - 30px ) / 4);
    min-height: 285px;
    background:#fff;
    border-radius:28px;
    overflow:hidden;
    box-shadow:0 15px 40px rgba(0,0,0,.08);
    transition:.35s;
    flex-shrink:0;
}

.dgs-factory-card:hover{
    transform:translateY(-8px);
}



.dgs-factory-cover img{
    width:100%;
    height:100%;
    object-fit:cover;
}

.dgs-factory-content{
    padding:22px;
    text-align:center;
}

.dgs-factory-logo{
    width:85px;
    height:85px;
    background:#fff;
    border-radius:50%;
    margin:-65px auto 15px;
    box-shadow:0 10px 25px rgba(0,0,0,.08);
    overflow:hidden;
    border:4px solid #fff;
}

.dgs-factory-logo img{
    width:100%;
    height:100%;
    object-fit:cover;
}

.dgs-factory-content h3{
    font-size:22px;
    margin-bottom:8px;
}

.dgs-factory-location{
    color:#666;
}

.dgs-factory-stats{
    display:flex;
    justify-content:center;
    gap:40px;
    margin-bottom:20px;
}

.dgs-factory-stats div{
    display:flex;
    flex-direction:column;
}

.dgs-factory-stats strong{
    color:#0f5fff;
    font-size:22px;
}

.dgs-factory-btn{
    display:block;
    background:#0f5fff;
    color:#fff;
    text-decoration:none;
    padding:12px;
    border-radius:14px;
    font-weight:700;
}

.dgs-factory-btn:hover{
    opacity:.9;
}

@media(max-width:768px){

    .dgs-factory-showcase{
		width: 96%;
        padding:10px 15px;
    }

    .dgs-factory-header{
        flex-direction:column;
        align-items:flex-start;
    }

    .dgs-factory-header h2{
        font-size:26px;
    }

    .dgs-factory-card{
        width:calc((100% - 15px ) / 1.4);
    }

 
}
.dgs-shipping-nationwide{
	width: 100%;
    padding:10px 11%;
    display:flex;
    justify-content:space-between;
    gap:60px;
    background:linear-gradient(
    135deg,
    #f8fbff,
    #eef6ff);
    overflow:hidden;
}

.dgs-shipping-content{
    flex:1;
}

.dgs-shipping-badge{
    background:#dcebff;
    color:#0f5fff;
    padding:10px 18px;
    border-radius:50px;
    display:inline-block;
    font-size:14px;
    font-weight:700;
    margin-bottom:20px;
}

.dgs-shipping-content h2{
    font-size:42px;
    margin-bottom:20px;
    color:#0f172a;
}

.dgs-shipping-content p{
    line-height:2;
    color:#555;
    margin-bottom:30px;
}

.dgs-shipping-features{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:15px;
    margin-bottom:30px;
}

.dgs-shipping-feature{
    display:flex;
    align-items:center;
    gap:12px;
    background:#fff;
    padding:14px;
    border-radius:14px;
    box-shadow:0 5px 20px rgba(0,0,0,.05);
}

.dgs-shipping-feature img{
    width:24px;
}

.dgs-shipping-stats{
    display:flex;
    gap:15px;
    margin-bottom:30px;
}

.dgs-stat-box{
    background:#fff;
    border-radius:18px;
    padding:18px 25px;
    text-align:center;
    box-shadow:0 10px 30px rgba(15,95,255,.08);
}

.dgs-stat-box strong{
    display:block;
    font-size:28px;
    color:#0f5fff;
}

.dgs-stat-box span{
    color:#666;
    font-size:14px;
}

.dgs-shipping-btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    background:#0f5fff;
    color:#fff;
    text-decoration:none;
    padding:16px 28px;
    border-radius:16px;
    font-weight:700;
    transition:.3s;
}

.dgs-shipping-btn:hover{
    transform:translateY(-3px);
}

.dgs-shipping-visual{
    flex:1;
    position:relative;
    min-height:500px;
}

.dgs-map-circle{
    position:absolute;
    width:500px;
    height:500px;
    background:radial-gradient(
    circle,
    rgba(15,95,255,.15),
    transparent 70%);
    border-radius:50%;
    top:50%;
    left:50%;
    transform:translate(-50%,-50%);
}

.dgs-iran-map{
    width:100%;
    position:relative;
    z-index:2;
}

.dgs-truck{
    position:absolute;
    width:220px;
    bottom:30px;
    left:0;
    z-index:3;
    animation:dgsTruckMove 4s ease-in-out infinite;
}

@keyframes dgsTruckMove{

    0%{
        transform:translateX(0);
    }

    50%{
        transform:translateX(20px);
    }

    100%{
        transform:translateX(0);
    }

}

@media(max-width:992px){
	.dgs-shipping-nationwide{
		gap: 10px;
    padding:10px 6%;}

    .dgs-shipping-nationwide{
        flex-direction:column;
        text-align:center;
    }

    .dgs-shipping-features{
        grid-template-columns:1fr 1fr;
    }

    .dgs-shipping-stats{
        justify-content:center;
    }

}

@media(max-width:768px){

    .dgs-shipping-content h2{
        font-size:30px;
    }

    .dgs-shipping-features{
        grid-template-columns:1fr;
    }

    .dgs-shipping-stats{
        overflow-x:auto;
        justify-content:flex-start;
        padding-bottom:10px;
    }

    .dgs-stat-box{
        min-width:140px;
        flex-shrink:0;
    }

    .dgs-shipping-visual{
        min-height:300px;
    }

    .dgs-truck{
        width:140px;
    }

}
.dgs-comment-form-section{
    width: 100%;
    padding:20px 15px;
    direction:rtl;
    font-family: sans-serif;
}

.dgs-comment-form-container{
   width: 100%;
   max-width: 600px;
    margin:auto;
    background:#fff;
    padding:30px;
    border-radius:12px;
    box-shadow:0 10px 30px rgba(0,0,0,0.08);
}

.dgs-comment-form-container h2{
    margin-bottom:5px;
    font-size:22px;
}

.dgs-comment-form-container p{
    color:#777;
    margin-bottom:25px;
    font-size:14px;
}

.dgs-form-group{
    margin-bottom:15px;
}

.dgs-form-group label{
    display:block;
    margin-bottom:6px;
    font-size:13px;
    color:#444;
}

.dgs-form-group input,
.dgs-form-group textarea{
    width:100%;
    padding:12px;
    border:1px solid var(--blue-30);
    border-radius:8px;
    outline:none;
    transition:0.2s;
    font-size:14px;
}

.dgs-form-group input:focus,
.dgs-form-group textarea:focus{
    border-color:var(--blue-30);
    box-shadow:0 0 0 2px rgba(184,134,11,0.15);
}

/* امتیاز ستاره‌ای */
.dgs-rating-input{
    display:flex;
    flex-direction: row-reverse;
    justify-content:flex-end;
    gap:5px;
}

.dgs-rating-input input{
    display:none;
}

.dgs-rating-input label{
    font-size:25px;
    color:#ccc;
    cursor:pointer;
    transition:0.2s;
}

.dgs-rating-input input:checked ~ label,
.dgs-rating-input label:hover,
.dgs-rating-input label:hover ~ label{
    color:var(--blue);
}

/* دکمه */
.dgs-comment-form button{
    width:100%;
    padding:12px;
    border:none;
    border-radius:8px;
    background:var(--blue);
    color:#fff;
    font-size:15px;
    cursor:pointer;
    transition:0.2s;
}

.dgs-comment-form button:hover{
    background:var(--dark-blue);
}

/* ریسپانسیو */
@media(max-width:600px){
    .dgs-comment-form-container{
        padding:20px;
    }

    .dgs-rating-input label{
        font-size:22px;
    }
}
.dgs-reaction-box{
    display:flex;
    gap:10px;
    margin-top:10px;
    font-size:14px;
}

.dgs-reaction-box button{
    border:none;
    background:#f5f5f5;
    padding:6px 10px;
    border-radius:6px;
    cursor:pointer;
    transition:0.2s;
}

.dgs-reaction-box button:hover{
    background:#e0e0e0;
}
.dgs-replies{
    margin-right:20px;
    margin-top:10px;
    border-right:2px solid #ddd;
    padding-right:10px;
}

.dgs-reply{
    background:#f9f9f9;
    padding:8px;
    margin-top:8px;
    border-radius:6px;
    font-size:13px;
}
.factory-logo-box {
    width: 100%;
    aspect-ratio: 1 / 1;   /* مربع واقعی */
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #f5f5f5; /* برای زیبایی */
    border-radius: 12px; /* اختیاری */
}

.factory-logo-box img {
    width: 100%;
    height: 100%;
    object-fit: cover;   /* مهم: تصویر کراپ می‌شود ولی کش نمی‌آید */
    object-position: center; /* وسط تصویر */
    display: block;
}






























.desktop{
		display: flex;
	}
	.tablet{
		display: none;
	}

 @media (max-width: 1400px) {
	.faq-continer{
	width: 92%;
	display: flex;
	align-items: flex-start;
	justify-content: flex-start;
	gap: 20px;
	padding-top: 15px;
}
.faqs{
	width: calc(75% - 10px);
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	justify-content: flex-start;
	padding: 18px;
	background-color: var(--white);
	border-radius: 12px;
	box-shadow: 0 10px 40px rgba(0, 0, 0, 0.08);
	gap: 10px;
}
.faq-sopurt{
	width: 25%;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: flex-start;
	padding: 18px;
	background-color: var(--white);
	border-radius: 12px;
	box-shadow: 0 10px 40px rgba(0, 0, 0, 0.08);
	gap: 10px;
}
	.faq-hero{
    width: 92%;
    border-radius: 34px;
    background-color: var(--blue);

    display: flex;
    justify-content: space-around;
    align-items: center;

    padding: 25px 10%;

    background-image:
        linear-gradient(
            rgba(0, 85, 255, 0.85),
            rgba(0, 85, 255, 0.85)
        ),
        url("../image/ChatGPT Image Jun 1, 2026, 09_40_38 AM.png");

    background-repeat: repeat;
    background-size: auto;
    background-position: center;
}
.faq-header-text{
	width: 50%;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	justify-content: flex-start;
	gap: 15px;
	color: var(--white);
}
.serch-input{
	width: 100%;
	display: flex;
	align-items: center;
}
.serch-input input{
	width: calc(100% - 45px);
	height: 45px;
	border: none;
	font-size: 17px;
	padding: 0 10px;
	border-radius: 0 20px 20px 0;
	background-color: var(--white);
}
.serch-input> img{
	width: 45px;
	height: 45px;
	background-color: var(--white);
	border: none;padding: 7px;
	border-radius: 20px 0px 0px 20px;
}
.faq-hero> img{
	width: 50%; 
	max-width: 320px;
}
	.product-boxs > .market-box{
		width: calc((100% - 40px) / 5);
		max-width: 350px;
	}
	.company-level-color{
	width:470px;
	height: 300px;
	position: absolute;
	background-color: var(--blue);
	border-radius: 50%;
	top: -210px;
	left: -50%;
	z-index: 50;
}
	.digi-ads-company-products{
	display: flex;
	justify-content: flex-start;
	align-items: flex-start;
	flex-direction: column;
	width: 92%;
	background-color: var(--blue-30);
	border-radius: 12px;
	padding: 20px;
	gap: 10px;
}
.digi-ads-header{
	display: flex;
	justify-content: flex-start;
	align-items: center;
	width: 100%;
	gap: 10px;
}
.digi-ads-header p{
	padding: 1px 8px;
	border-radius: 5px;
	background-color: var(--blue);
	color: var(--white);
}.digi-ads-header h2{
	padding: 1px 8px;
	border-radius: 5px;
	color: var(--blue);
}
.digi-ads-text p{
	color: var(--gray);
}
.digi-ads-btn {
	width: 17%;
}
.digi-ads-company-continer{
	display: flex;
	flex-direction: row;
	align-items: flex-start;
	justify-content: flex-start;
	gap: 10px;
	width: 100%;
	overflow-x: auto;
}
.digi-ads-company-continer > .digi-ads-company{
	min-width: calc((100% - 40px) / 5);
}
	.products-continer{
	display: flex;
	align-items: flex-start;
	justify-content: flex-start;
	flex-wrap: wrap;
	gap: 20px;
	width: 92%;
	padding: 10px;
 }
	.plan-btn{
		width: 90%;
		display: flex;
		align-items: center;
		justify-content: center;
		gap: 10px;
		padding: 5px 0px;
		border-radius: 10px;
		color: var(--white);
		
		font-size: 15px;
	}
	.comment-continer{
		width: 90%;
		background-color: var(--white);
		border-radius: 10px;
		display: flex;
		align-items: flex-start;
		justify-content: flex-start;
		padding: 10px;
		overflow-x: auto;
		gap: 20px;
	}
	.comment-card{
		display: flex;
		flex-wrap: wrap;
		align-items: flex-start;
		justify-content: flex-start;
		min-width: 450px;
		width: calc((100% - 40px) / 3);
		
		overflow: hidden;
		background-color: var(--backgrund);
		border-radius: 30px 30px 30px 5px;
		padding: 5px;
		gap: 5px;
		border: 1px solid var(--gray);
	}
	.weblog-continer{
		width: 90%;
		margin-bottom: 20px;
		background-color: var(--green
		);
		margin-top: 20px;
		border-radius: 10px;
		display: flex;
		align-items: flex-start;
		justify-content: flex-start;
		padding: 10px;
		overflow-x: auto;
		gap: 10px;
	}
	.weblog-card{
		display: flex;
		flex-direction: column;
		align-items: flex-start;
		justify-content: flex-start;
		max-width: 350px;
		width: calc((100% - 10px) / 2);
		min-width: 350px;
		
		background-color: var(--white);
		border-radius: 10px;
		
		padding: 5px;
	}
	.why-digi{
		display: flex;
		align-items: flex-start;
		justify-content: flex-start;
		width: 90%;
		border-radius: 20px;
		padding: 15px;
		margin-top: 20px;
		margin-bottom: 100px;
		gap: 20px;
	}
	.why-digi .why-text{
		width: 50%;
		display: flex;
		flex-direction: column;
		align-items: flex-start;
		justify-content: flex-start;
		text-align: justify;

	}
	.why-digi .why-items{
		width: 50%;
		display: flex;
		align-items: flex-start;
		justify-content: flex-start;
		text-align: justify;
		flex-wrap: wrap;
		gap: 20px;
	}
	.why-digi .why-items .why-item {
		width: calc((100% - 20px) / 2);
		display: flex;
		flex-direction: column;
		align-items: flex-start;
		justify-items: flex-start;
		gap: 5px;
		background-color: var(--backgrund);
		border: 1px solid var(--gray);
		padding: 15px;
		border-radius: 10px;
		transition: all .3s ease-in-out;
	}
	.product-continer{
		width: 92%;
		
		background-color: var(--blue);
		margin-top: 20px;
		border-radius: 10px;
		margin-bottom: 5px;
		display: flex;
		align-items: flex-start;
		justify-content: flex-start;
		padding: 10px;
		overflow-x: auto;
	}
.swiper {
      width: 92%;
      height: 100%;
		display: flex;
		align-items: center;
		justify-content: center;
    }
header{
	display: flex;
	align-items: center;
	justify-content: flex-start;
	width: 100%;
	padding: 0px 4%;
	background-color: var(--white);
	flex-wrap: wrap;
	position: sticky;
	top: 0;
}
.digi-story{
		display: flex;
		align-items: center;
		justify-content: flex-start;
		gap: 30px;
		width: 92%;
		padding: 10px 0%;
		overflow-x: auto;
	}
	.market-continer{
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: flex-start;
		width: 92%;
		border-radius: 10px;
		
		
	}
.header-ful{
	display: flex;
	align-items: center;
	justify-content: space-between;
	width: 100%;
	height: 62px;
	padding: 0;
	background-color: var(--white);
	gap: 5px;
	z-index: 1000;
}
.header-btn{
	display: flex;
	align-items: center;
	justify-content: space-between;
	width: 100%;
	height: 62px;
	padding: 0;
	background-color: var(--white);
	gap: 5px;
	z-index: 900;

}
.menu-btns{
	gap: 5px;
}
.header-fasele{
	width: calc(30% - 260px);
}
.serch-box{
	width: calc(65% - 195px);}
	.tablet{
	display: none;
	
	
}
.digi-club{
		width: 70%;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: flex-start;
	}
	.digi-club-info{
		width: calc(100% - 20px);
		display: flex;
		flex-direction: column;
		align-items: flex-start;
		justify-content: flex-start;
		padding: 10px;
	}
	.market-plans{
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: flex-start;
		width: 90%;
		padding: 10px ;
		border-radius: 10px;
		background-color: var(--blue);
	}
	.market-plans .market-plans-text{
		display: flex;
		align-items: center;
		justify-content: flex-start;
		width: 90%;
		color: var(--white);
		text-align: justify;
	}
	.market-plans .market-plans-text img{
		width: 30%;

	}
	.plan-continer{
		display: flex;
		align-items: center;
		justify-content: flex-start;
		gap: 10px;
		flex-direction: column;
		width: 90%;
		padding-top: 45px;
	}
	.plan-box-continer{
		display: flex;
		align-items: flex-start;
		justify-content: center;
		flex-direction: row;
		gap: 20px;width: 100%;
	}
	.plan-box-2{
		width: calc((100% - 60px) / 4);
		display: flex;
		align-items: center;
		justify-content: flex-start;
		flex-direction: column;
		border: 2px solid var(--backgrund);
		border-radius: 15px;
		padding: 0 0%;
		gap: 5px;
		padding-bottom: 20px;
		transition: all .3s ease-in-out;
	}
	.tablet{
		display: none;
	}
 }
 @media (max-width: 1150px) {
	.header-ful {
        display: flex;
        align-items: center;
        justify-content: space-between;
        width: 100%;
        height: 62px;
        padding: 0 2%;
        background-color: var(--white);
        gap: 5px;
        z-index: 1000;
    }
	.bottom-nav{
		display: flex;
	}
	header{
		padding: 0;
		max-height: 62px;
	}
	.header-btn{
	position: relative;
	
	left: 105%;
	top: 0;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	justify-content: flex-start;
	width: calc(100vw + 8%);
	height: 100vh;
	background-color: var(--white);
	gap: 5px;
	z-index: 4500;
	margin-top: -112px;
}
.menu-btns{
	width: 100%;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	justify-content: flex-start;
	border-bottom: 1px solid var(--backgrund);
	padding: 10px;
}
.menu-btn{
	width: 100%;
}
	.product-boxs > .market-box{
		width: calc((100% - 30px) / 4);
		max-width: 350px;
	}
	.cunter-item{
			width: calc((100% - 10px ) / 2);
			display: flex;
			align-items: center;
			justify-content: center;
			gap: 10px;
    		box-shadow: 0 10px 40px rgba(0, 0, 0, 0.08);
			border-radius: 14px;
			background-color: var(--white);
			padding: 5px 12px;
		}
		.cunter-item p span{
			color: var(--blue);
			font-size: 18px;
			font-weight: 700;
		}
		.cunter-item > img{
			width: 50px;
			display: flex;
			padding: 0;
		}
	.city-box{
		min-width: calc((100% - 60px) / 4);
		display: flex;
		align-items: center;
		justify-content: flex-start;
		flex-direction: column;
		gap: 8px;
		border-radius: 12px;
		background-color: var(--white);
		padding: 10px;	
		box-shadow: 0 10px 40px rgba(0, 0, 0, 0.08);
	}
	
	.company-level-color{
	width:470px;
	height: 300px;
	position: absolute;
	background-color: var(--blue);
	border-radius: 50%;
	top: -210px;
	left: -50%;
	z-index: 50;
}
	.digi-ads-company-products{
	display: flex;
	justify-content: flex-start;
	align-items: flex-start;
	flex-direction: column;
	width: 92%;
	background-color: var(--blue-30);
	border-radius: 12px;
	padding: 20px;
	gap: 10px;
}
.digi-ads-header{
	display: flex;
	justify-content: flex-start;
	align-items: center;
	width: 100%;
	gap: 10px;
}
.digi-ads-header p{
	padding: 1px 8px;
	border-radius: 5px;
	background-color: var(--blue);
	color: var(--white);
}.digi-ads-header h2{
	padding: 1px 8px;
	border-radius: 5px;
	color: var(--blue);
}
.digi-ads-text p{
	color: var(--gray);
}
.digi-ads-btn {
	width: 25%;
}
.digi-ads-company-continer{
	display: flex;
	flex-direction: row;
	align-items: flex-start;
	justify-content: flex-start;
	gap: 10px;
	width: 100%;
	overflow-x: auto;
}
.digi-ads-company-continer > .digi-ads-company{
	min-width: calc((100% - 30px) / 4);
}
	.products-continer{
	display: flex;
	align-items: flex-start;
	justify-content: flex-start;
	flex-wrap: wrap;
	gap: 20px;
	width: 100%;
	padding: 10px;
 }
 .product-filter-continer{
	gap: 20px;
	width: 100%;
	border-radius: 10px;
	padding: 0px;
	display: none;
	flex-direction: column;
	align-items: flex-start;
	justify-content: flex-start;
 }
 .product-boxs{
	width: 100%;
	display: flex;
	gap: 10px;
	justify-content: flex-start;
	align-items: flex-start;flex-wrap: wrap;
 }
  .product-boxs > .product-card{
	border: 2px solid var(--backgrund);
	width: calc((100% - 30px) / 4);
	max-width: 1000px;
	min-width: auto;
	 overflow:hidden;
    border:1px solid #edf1f7;

    box-shadow:
    0 0 0 1px rgba(0,0,0,0.02),
    0 8px 24px rgba(0,0,0,0.06);

    transition:
    transform 0.25s ease,
    box-shadow 0.25s ease;
  }
   .product-sort-continer{
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: flex-start;
	gap: 5px;
	overflow-x: auto;
	padding: 10px 0;
 }
 .product-filter-btn{
	width: 130px;
	margin-right: 10px;
	display: flex;
	align-items: center;
	justify-content: flex-end;
	gap: 5px;
 }
 .product-cunter{
	color: var(--gray);
	padding: 0 10px;
	border-left: 2px solid var(--backgrund);
	min-width: auto;
	 white-space: nowrap;
    flex-shrink: 0;
 }
 .item-sort{
	min-width: auto;
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--black);
	border-radius: 8px;
	padding: 5px 10px;
	border: 2px solid var(--backgrund);
	transition: all .3s ease-in-out;
	 white-space: nowrap;
    flex-shrink: 0;
 }

 .filters-sidebar{
    width:100%;
    background:#fff;
    border-radius:24px;
    padding:24px;
    box-shadow:0 10px 40px rgba(0,0,0,0.08);
}

	.plan-continer{
		display: flex;
		align-items: center;
		justify-content: flex-start;
		gap: 10px;
		flex-direction: column;
		width: 98%;
		padding-top: 45px;
	}
	.plan-box-continer{
		display: flex;
		align-items: flex-start;
		justify-content: center;
		flex-direction: row;
		gap: 20px;width: 100%;
	}
	.plan-box-2{
		width: calc((100% - 60px) / 4);
		display: flex;
		align-items: center;
		justify-content: flex-start;
		flex-direction: column;
		border: 2px solid var(--backgrund);
		border-radius: 15px;
		padding: 0 0%;
		gap: 5px;
		padding-bottom: 20px;
		transition: all .3s ease-in-out;
	}
	.revers{
		flex-direction: row-reverse;
	}
	.plan-box{
		display: flex;
		flex-direction: column ;
		padding: 0 0%;
	}
	.market-plan-card{
		width: 100% ;
		display: flex;
		flex-direction: column;
		align-items: flex-start;
		justify-content: flex-start;
		gap: 15px;
		padding: 10px;
	}
	.footer{
		width: 100%;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: flex-start;
		margin-top: 30px;
		padding: 20px;
		border-top: 2px solid var(--backgrund);
		gap: 30px;
	}
	.comment-continer{
		width: 100%;
		background-color: var(--white);
		border-radius: 10px;
		display: flex;
		align-items: flex-start;
		justify-content: flex-start;
		padding: 10px;
		overflow-x: auto;
		gap: 20px;
	}
	.comment-card{
		display: flex;
		flex-wrap: wrap;
		align-items: flex-start;
		justify-content: flex-start;
		min-width: 400px;
		width: calc((100% - 40px) / 3);
		overflow: hidden;
		background-color: var(--backgrund);
		border-radius: 30px 30px 30px 5px;
		padding: 5px;
		gap: 5px;
		border: 1px solid var(--gray);
	}
	.catgoory-continer .catgoory-item a.catgoory{
		width: calc((100% - 20px) / 3  );
		max-width: 150px;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: flex-start;
		gap: 5px;
		padding: 5px;
	 }
	.catgoory-continer{
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: flex-start;
		width: 100%;

	}
	.digi-club{
		width: 80%;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: flex-start;
	}
	.product-card{
		display: flex;
		flex-direction: column;
		align-items: flex-start;
		justify-content: flex-start;
		max-width: 240px;
		width: calc((100% - 10px) / 2);
		min-width: calc((100% - 10px) / 4);
		
		background-color: var(--white);
		border-radius: 10px;
		
	}
	.market-continer{
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: flex-start;
		width: 100%;
		border-radius: 10px;
		
		
	}
	.weblog-continer{
		width: 100%;
		margin-bottom: 20px;
		background-color: var(--green
		);
		margin-top: 20px;
		border-radius: 0px;
		display: flex;
		align-items: flex-start;
		justify-content: flex-start;
		padding: 10px;
		overflow-x: auto;
		gap: 10px;
	}
	.weblog-card{
		display: flex;
		flex-direction: column;
		align-items: flex-start;
		justify-content: flex-start;
		max-width: 310px;
		width: calc((100% - 10px) / 2);
		min-width: 310px;
		
		background-color: var(--white);
		border-radius: 10px;
		
		padding: 5px;
	}
	.product-continer{
		width: 100%;
		
		background-color: var(--red);
		margin-top: 20px;
		border-radius: 0px;
		margin-bottom: 5px;
		display: flex;
		align-items: flex-start;
		justify-content: flex-start;
		padding: 10px;
		overflow-x: auto;
	}
	.header-bottom{
		display: flex;
		align-items: center;
		justify-content: space-around;
		width: 100%;
		padding: 5px  10px 0 10px;
		height: 70px;
		position:fixed;
		bottom: 0;
		left: 0;
		background-color: var(--backgrund);
		z-index: 2000;
	}
	.header-bottom-item{
		display: flex;
		flex-direction: column;
		gap: 0px;
		align-items: center;
		justify-content: flex-start;padding: 5px 5px 0px 5px;
		color: var(--black);border-radius: 10px 10px 0 0;
	}
	.active-header-bottom-item{
		background-color: var(--white);
		padding: 5px 15px 0px 15px;
	}
	.header-bottom-item img{
		width: 28px;
	}
	.swiper {
      width: 95%;
      height: 100%;
		display: flex;
		align-items: center;
		justify-content: center;
    }


.header-tablet{
	display: flex;
	align-items: center;
	padding: 5px 10px;
	justify-content: flex-start;
	row-gap: 5px;
	column-gap: 10px;
	flex-wrap: wrap;
	color: var(--gray);
}
.digi-story{
		display: flex;
		align-items: center;
		justify-content: flex-start;
		gap: 10px;
		width: 95%;
		
		padding: 10px 0%;
		overflow-x: auto;
	}
.digi-story .story-item{
		min-width: 80px;
		width: 80px;}
.search-box{
	height: 45px;
	width: calc(100% - 58px);
	background-color: var(--backgrund);	
	border-radius: 7px;
	padding: 3px 10px;
	display: flex;
	align-items: center;
	justify-content: flex-start;
	gap: 5px;
	font-size: 13px;
	font-weight: 500;
	color: var(--gray);
}
.search-box img.logo{
	width: 120px;
}
.header-tablet-menu{
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 20px;
	width: 100%;
	padding: 5px 00px;
}
.header-tablet-menu:last-child{
	display: flex;
	align-items: center;
	justify-content: flex-start;
	gap: 5px;
	width: 100%;
	padding: 0px 5px;
}
.header-tablet-menu:last-child p{
	font-weight: 400;
}
.tablet-menu-item{
	width: calc((100% - 28px) / 5);
	max-width: 70px;
	padding: 10px 20px;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: flex-start;
	border-radius: 7px;
	background-color: var(--backgrund);
}
.tablet-menu-item p{
	font-size: 13px;
	color: var(--black);
}
.tablet-menu-item img{
	width: 100%;
	
}
.active-item , .active-item p{
	background-color: var(--blue);
	color: var(--white);
}
body{
	padding-bottom: 70px;
}
.market-plans .market-plans-text{
		display: flex;
		align-items: center;
		justify-content: flex-start;
		width: 100%;
		color: var(--white);
		text-align: justify;
	}
	.market-plans .market-plans-text img{
		width: 30%;

	}
	.digi-club >  img{
		padding: 30px;
		max-width: 700px;
		width: 92%;
	}
	.tablet{
		display: flex;
	}
	.desktop{
		display: none;
	}
 }
  @media (max-width: 900px) {
	.faq-continer{
	width: 100%;
	display: flex;
	align-items: flex-start;
	justify-content: flex-start;
	flex-wrap: wrap;
	gap: 20px;
	padding-top: 15px;
}
.faqs{
	width: 100%;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	justify-content: flex-start;
	padding: 12px;
	background-color: var(--white);
	border-radius: 12px;
	box-shadow: 0 10px 40px rgba(0, 0, 0, 0.08);
	gap: 10px;
}
.faq-sopurt{
	width: 100%;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: flex-start;
	padding: 12px;
	background-color: var(--white);
	border-radius: 12px;
	box-shadow: 0 10px 40px rgba(0, 0, 0, 0.08);
	gap: 10px;
}
.faq-text > img.pasokh{
	display: none;
}
	.faq-hero{
    width: 95%;
    border-radius: 34px;
    background-color: var(--blue);

    display: flex;
	flex-direction: column-reverse;
    justify-content: space-around;
    align-items: center;

    padding: 25px 10%;

    background-image:
        linear-gradient(
            rgba(0, 85, 255, 0.85),
            rgba(0, 85, 255, 0.85)
        ),
        url("../image/ChatGPT Image Jun 1, 2026, 09_40_38 AM.png");

    background-repeat: repeat;
    background-size: auto;
    background-position: center;
}
.faq-header-text{
	width: 100%;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: flex-start;
	gap: 15px;
	color: var(--white);
}
.serch-input{
	width: 100%;
	display: flex;
	align-items: center;
}
.serch-input input{
	width: calc(100% - 45px);
	height: 45px;
	border: none;
	font-size: 17px;
	padding: 0 10px;
	border-radius: 0 20px 20px 0;
	background-color: var(--white);
}
.serch-input> img{
	width: 45px;
	height: 45px;
	background-color: var(--white);
	border: none;padding: 7px;
	border-radius: 20px 0px 0px 20px;
}
.faq-hero> img{
	width: 50%; 
	max-width: 320px;
}
	.product-boxs > .market-box{
		width: calc((100% - 20px) / 3);
		max-width: 350px;
	}
	.city-box{
		min-width: calc((100% - 40px) / 3);
		display: flex;
		align-items: center;
		justify-content: flex-start;
		flex-direction: column;
		gap: 8px;
		border-radius: 12px;
		background-color: var(--white);
		padding: 10px;	
		box-shadow: 0 10px 40px rgba(0, 0, 0, 0.08);
	}
	.company-level-color{
	width:550px;
	height: 300px;
	position: absolute;
	background-color: var(--blue);
	border-radius: 50%;
	top: -210px;
	left: -50%;
	z-index: 50;
}
	.digi-ads-company-products{
	display: flex;
	justify-content: flex-start;
	align-items: flex-start;
	flex-direction: column;
	width: 100%;
	background-color: var(--blue-30);
	border-radius: 0px;
	padding: 20px;
	gap: 10px;
}
.digi-ads-header{
	display: flex;
	justify-content: flex-start;
	align-items: center;
	width: 100%;
	gap: 10px;
}
.digi-ads-header p{
	padding: 1px 8px;
	border-radius: 5px;
	background-color: var(--blue);
	color: var(--white);
}.digi-ads-header h2{
	padding: 1px 8px;
	border-radius: 5px;
	color: var(--blue);
}
.digi-ads-text p{
	color: var(--gray);
}
.digi-ads-btn {
	width: 27%;
}
.digi-ads-company-continer{
	display: flex;
	flex-direction: row;
	align-items: flex-start;
	justify-content: flex-start;
	gap: 10px;
	width: 100%;
	overflow-x: auto;
}
.digi-ads-company-continer > .digi-ads-company{
	min-width: calc((100% - 20px) / 3);
}
		.products-continer{
	display: flex;
	align-items: flex-start;
	justify-content: flex-start;
	flex-wrap: wrap;
	gap: 20px;
	width: 100%;
	padding: 10px;
 }
 .product-filter-continer{
	gap: 20px;
	width: 100%;
	border-radius: 10px;
	padding: 0px;
	display: none;
	flex-direction: column;
	align-items: flex-start;
	justify-content: flex-start;
 }
 .product-boxs{
	width: 100%;
	display: flex;
	gap: 10px;
	justify-content: flex-start;
	align-items: flex-start;flex-wrap: wrap;
 }
  .product-boxs > .product-card{
	border: 2px solid var(--backgrund);
	width: calc((100% - 20px) / 3);
	max-width: 1000px;
	min-width: auto;
	 overflow:hidden;
    border:1px solid #edf1f7;

    box-shadow:
    0 0 0 1px rgba(0,0,0,0.02),
    0 8px 24px rgba(0,0,0,0.06);

    transition:
    transform 0.25s ease,
    box-shadow 0.25s ease;
  }
   .product-sort-continer{
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: flex-start;
	gap: 5px;
	overflow-x: auto;
	padding: 10px 0;
 }
 .product-filter-btn{
	width: 130px;
	margin-right: 10px;
	display: flex;
	align-items: center;
	justify-content: flex-end;
	gap: 5px;
 }
 .product-cunter{
	color: var(--gray);
	padding: 0 10px;
	border-left: 2px solid var(--backgrund);
	min-width: auto;
	 white-space: nowrap;
    flex-shrink: 0;
 }
 .item-sort{
	min-width: auto;
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--black);
	border-radius: 8px;
	padding: 5px 10px;
	border: 2px solid var(--backgrund);
	transition: all .3s ease-in-out;
	 white-space: nowrap;
    flex-shrink: 0;
 }
	.plan-continer{
		display: flex;
		align-items: center;
		justify-content: flex-start;
		gap: 10px;
		flex-direction: column;
		width: 98%;
		padding-top: 5px;
	}
	.plan-box-continer{
		display: flex;
		align-items: flex-start;
		justify-content: center;
		flex-direction: column;
		gap: 20px;width: 100%;
	}
	.plan-box-2{
		width: calc(100%);
		display: flex;
		align-items: center;
		justify-content: flex-start;
		flex-direction: row;
		flex-wrap: wrap;
		border: 2px solid var(--backgrund);
		border-radius: 15px;
		padding: 10px;
		gap: 5px;
		padding-bottom: 20px;
		transition: all .3s ease-in-out;
	}
	.plan-box-2 img.plan-icon{
		width: 30%;
		
	}
	.name-plan{
		width: calc(70% - 5px);
		display: flex;
		flex-direction: column;
		gap: 8px;
		border-right: 1px solid var(--backgrund);
		padding: 0 15px;
	}
	.plan-text-header{
		width: calc(100%);
		font-size: 20px;
		font-weight: 600;
		padding: 0px 0px;
		border-radius: 8px;
		color: var(--blue);
		
		text-align: right;
	}
	.plan-text-header-shoar{
		width: calc(100%);
		font-size: 15px;
		font-weight: 400;
		padding: 0px 0px;
		border-radius: 0px;
		color: var(--black);
		text-align: right;
	}
	.plan-text-header-tozih{
		width: calc(100%);
		font-size: 14px;
		font-weight: 400;
		padding: 0px 0px;
		border-radius: 0px;
		color: var(--black);
		text-align: right;
		
	}
	.plan-text-header-price{
		font-size: 28px;
		width: calc(100%);
		font-weight: 700;
		padding: 0px 0px;
		border-radius: 0px;
		color: var(--blue);
		text-align: right;
	}
	.plan-text-header-price-unit{
		font-size: 17px;
		width: calc(100%);
		font-weight: 400;
		padding: 0px 0px;
		border-radius: 0px;
		color: var(--black);
		text-align: right;
		margin-top: 0px;
	}
	.plan-box-option-text{
		width:calc(50% - 5px);
		padding: 0 0;
		display: flex;
		align-items: center;
		justify-content: flex-start;
		gap: 15px;
	}
	.plan-box-option-text p{
		font-size: 14px;
	}
	.plan-btn{
		margin: auto;
		width: 90%;
		display: flex;
		align-items: center;
		justify-content: center;
		gap: 10px;
		padding: 5px 0px;
		border-radius: 10px;
		color: var(--white);
		
		font-size: 17px;
	}
	.plan-detil{
		font-size: 15px;
		color: var(--black);margin: auto;
	}
	.plan-btn img{width: 30px;}
	.plan-option-continer{
		display: flex;
		align-items: center;
		justify-content: space-around;
		flex-wrap: wrap;
		width: 100%;
		gap: 10px;
	}
	.plan-option-box{
		width: 80%;
		margin: auto;
		display: flex;
		align-items: center;
		justify-content: flex-start;
		flex-direction: row;
		gap: 10px;
		border-radius: 10px;
		padding: 5px 10px;
	}
	.option-header{
		text-align: right;
		font-size: 14px;
		font-weight: 400;
		color: var(--blue);
	}
	.option-text{
		text-align: right;
		font-size: 12px;
		font-weight: 400;
		color: var(--gray);
	}
	.footer{
		width: 100%;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: flex-start;
		margin-top: 30px;
		padding: 10px;
		border-top: 2px solid var(--backgrund);
		gap: 30px;
	}
	.footer-continer{
		display: flex;
		flex-direction: column;
		align-items: flex-start;
		justify-content: space-between;
		width: 100%;
	}
	.footer-continer:nth-child(2){
		display: flex;
		flex-direction: row;
		align-items: flex-start;
		justify-content: space-between;
		overflow-x: auto;
		width: 100%;
		gap: 20px;
	}
	.footer-continer:nth-child(3){
		display: flex;
		flex-direction: column;
		align-items: flex-start;
		justify-content: space-between;
		overflow-x: auto;
		width: 100%;
		gap: 20px;
	}
	.digi-logo{
		display: flex;
		align-items: flex-start;
		justify-content: flex-start;
		flex-direction: column;
		gap: 10px;
	}
	.digi-logo > div{
		display: none;

		align-items: flex-start;
		justify-content: flex-start;
		gap: 5px;
		padding: 0 10px;

	}
	.digi-logo > div p ,.digi-logo > div p a{
		display: flex;
		align-items: center;
		justify-content: flex-start;
		line-height: 15px;
		gap: 5px;
		color: var(--gray);
		font-size: 13px;
	}
	.go-top{
		display: none;
		align-items: center;
		justify-content: center;
		padding: 5px 35px;
		border-radius: 10px;
		border: 2px solid var(--backgrund);
		color: var(--gray);
	}
	.trust-item{
		width: 60px;
		min-width: 60px;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: flex-start;
		gap: 10px;
		padding: 10px;
	}
	.trust-item img{
		width: 100%;
	}
	.trust-item p{
		font-size: 11px;
		font-weight: 200	;
	}
	.link-grup{
		width: 100%;
		display: flex;
		flex-direction: row;
		flex-wrap: wrap;
		align-items: flex-start;
		justify-content: flex-start;
		overflow-x: auto;
		gap: 10px;
	}
	.link-grup h3{
		width: 100%;
		font-size: 18px;
		font-weight: 400;
		color: var(--black);
	}
	.link-grup a{
		width: calc((100% - 20px) / 2);
		font-size: 15px;
		font-weight: 300;
		color: var(--gray);
	}
	.social{
		width: 100%;
		display: flex;
		align-items: center;
		justify-content: space-around;
		padding-top: 10px;
		padding-bottom: 15px;
	}
	.social a{
		width: 20%;
		max-width: 40px;
		display: flex;
		align-items: center;
		justify-content: center;
		padding: 0;
	}
	.social form{
		width: 100%;
		display: flex;
		align-items: center;
		justify-content: center;
		padding: 0;
		gap: 5px;
	}
	.social form input{
		border: none;
		width: 80%;
		padding: 15px 10px;
		font-family: "homa";
		background-color: var(--backgrund);
		border-radius: 5px;

	}
	.social a img{
		width: 100%;
	}
	p.copy{
		font-size: 15px;
		font-weight: 300;
		color: var(--gray);
	}
	.market-plans{
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: flex-start;
		width: 100%;
		padding: 10px ;
		padding-bottom: 30px;
		border-radius: 0px;
		background-color: var(--blue);
	}
	.market-plans .market-plans-text{
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: flex-start;
		width: 90%;
		color: var(--white);
		text-align: justify;
	}
	.market-plans .market-plans-text img{
		width: 90%;

	}
	.why-digi{
		display: flex;
		align-items: flex-start;
		justify-content: flex-start;
		width: 100%;
		border-radius: 20px;
		padding: 15px;
		margin-top: 20px;
		margin-bottom: 0px;
		gap: 20px;
		flex-wrap: wrap;
	}
	.why-digi .why-text{
		width: 100%;
		display: flex;
		flex-direction: column-reverse;
		align-items: center;
		justify-content: flex-start;
		text-align: justify;

	}
	.why-digi .why-items{
		width: 100%;
		display: flex;
		align-items: flex-start;
		justify-content: flex-start;
		text-align: justify;
		flex-wrap: wrap;
		gap: 10px;
	}
	.why-digi .why-items .why-item {
		width: calc(100% );
		display: flex;
		flex-direction: row;
		flex-wrap: wrap;
		align-items: center;
		justify-items: flex-start;
		gap: 10px;
		background-color: var(--backgrund);
		border: 1px solid var(--gray);
		padding: 15px;
		border-radius: 10px;
		transition: all .3s ease-in-out;
	}
	.catgoory-continer{
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: flex-start;
		width: 100%;

	}
	 .catgoory-continer .catgoory-item{
		width: 100%;
		display: flex;
		flex-wrap: wrap;
		align-items: flex-start;
		justify-content: center;
		gap: 10px;
		padding: 10px;
	 }
	.digi-club{
		width: 100%;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: flex-start;
	}
	.revers{
		flex-direction: column-reverse;
	}
	.product-card{
		display: flex;
		flex-direction: column;
		align-items: flex-start;
		justify-content: flex-start;
		max-width: 240px;
		width: calc((100% - 10px) / 2);
		min-width: calc((100% - 10px) / 3);
		
		background-color: var(--white);
		border-radius: 10px;
		
	}
	header{
		padding: 0;
	}
	.header-btn{
	position: relative;
	
	left:100%;
	top: 0;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	justify-content: flex-start;
	width: 100vw;
	height: 100vh;
	background-color: var(--white);
	gap: 5px;
	z-index: 4500;
	margin-top: -112px;
}
.menu-btns{
	width: 100%;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	justify-content: flex-start;
	border-bottom: 1px solid var(--backgrund);
	padding: 10px;
}
.menu-btn{
	width: 100%;
}
.tablet{
		display: flex;
	}
	.desktop{
		display: none;
	}
}
  @media (max-width: 700px) {
	.product-boxs > .market-box{
		width: calc((100% - 10px) / 2);
		max-width: 350px;
	}
	.city-box{
		min-width: calc((100% - 20px) / 1.7);
		display: flex;
		align-items: center;
		justify-content: flex-start;
		flex-direction: column;
		gap: 8px;
		border-radius: 12px;
		background-color: var(--white);
		padding: 10px;	
		box-shadow: 0 10px 40px rgba(0, 0, 0, 0.08);
	}
	
	.company-level-color{
	width:645px;
	height: 300px;
	position: absolute;
	background-color: var(--blue);
	border-radius: 50%;
	top: -210px;
	left: -50%;
	z-index: 50;
}
	.digi-ads-company-products{
	display: flex;
	justify-content: flex-start;
	align-items: flex-start;
	flex-direction: column;
	width: 100%;
	background-color: var(--blue-30);
	border-radius: 0px;
	padding: 20px;
	gap: 10px;
}
.digi-ads-header{
	display: flex;
	justify-content: flex-start;
	align-items: center;
	width: 100%;
	gap: 10px;
}
.digi-ads-header p{
	padding: 1px 8px;
	border-radius: 5px;
	background-color: var(--blue);
	color: var(--white);
}.digi-ads-header h2{
	padding: 1px 8px;
	border-radius: 5px;
	color: var(--blue);
}
.digi-ads-text p{
	color: var(--gray);
}
.digi-ads-btn {
	width: 35%;
}
.digi-ads-company-continer{
	display: flex;
	flex-direction: row;
	align-items: flex-start;
	justify-content: flex-start;
	gap: 10px;
	width: 100%;
	overflow-x: auto;
}
.digi-ads-company-continer > .digi-ads-company{
	min-width: calc((100% - 10px) / 2);
}
		.products-continer{
	display: flex;
	align-items: flex-start;
	justify-content: flex-start;
	flex-wrap: wrap;
	gap: 20px;
	width: 100%;
	padding: 10px;
 }
 .product-filter-continer{
	gap: 20px;
	width: 100%;
	border-radius: 10px;
	padding: 0px;
	display: none;
	flex-direction: column;
	align-items: flex-start;
	justify-content: flex-start;
 }
 .product-boxs{
	width: 100%;
	display: flex;
	gap: 10px;
	justify-content: flex-start;
	align-items: flex-start;flex-wrap: wrap;
 }
  .product-boxs > .product-card{
	border: 2px solid var(--backgrund);
	width: calc((100% - 10px) / 2);
	max-width: 1000px;
	min-width: auto;
	 overflow:hidden;
    border:1px solid #edf1f7;

    box-shadow:
    0 0 0 1px rgba(0,0,0,0.02),
    0 8px 24px rgba(0,0,0,0.06);

    transition:
    transform 0.25s ease,
    box-shadow 0.25s ease;
  }
   .product-sort-continer{
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: flex-start;
	gap: 5px;
	overflow-x: auto;
	padding: 10px 0;
 }
 .product-filter-btn{
	width: 130px;
	margin-right: 10px;
	display: flex;
	align-items: center;
	justify-content: flex-end;
	gap: 5px;
 }
 .product-cunter{
	color: var(--gray);
	padding: 0 10px;
	border-left: 2px solid var(--backgrund);
	min-width: auto;
	 white-space: nowrap;
    flex-shrink: 0;
 }
 .item-sort{
	min-width: auto;
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--black);
	border-radius: 8px;
	padding: 5px 10px;
	border: 2px solid var(--backgrund);
	transition: all .3s ease-in-out;
	 white-space: nowrap;
    flex-shrink: 0;
 }
.product-label a img{
		max-width: 100px;
		width: 100%;
		border-radius: 10px;
	}
	.product-card{
		display: flex;
		flex-direction: column;
		align-items: flex-start;
		justify-content: flex-start;
		max-width: 240px;
		width: calc((100% - 10px) / 2);
		min-width: calc((100% - 10px) / 2);
		background-color: var(--white);
		border-radius: 10px;
		
	}

.header-tablet-menu{
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 0px;
	width: 100%;
	padding: 5px 00px;
}
 }
  @media (max-width: 450px) {
	.faq-hero{
    width: 96%;
    border-radius: 34px;
    background-color: var(--blue);

    display: flex;
    justify-content: space-around;
    align-items: center;

    padding: 25px 0%;

    background-image:
        linear-gradient(
            rgba(0, 85, 255, 0.85),
            rgba(0, 85, 255, 0.85)
        ),
        url("../image/ChatGPT Image Jun 1, 2026, 09_40_38 AM.png");

    background-repeat: repeat;
    background-size: auto;
    background-position: center;
}
.faq-header-text{
	width: 95%;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: flex-start;
	gap: 15px;
	color: var(--white);
}
.serch-input{
	width: 100%;
	display: flex;
	align-items: center;
}
.serch-input input{
	width: calc(100% - 45px);
	height: 45px;
	border: none;
	font-size: 17px;
	padding: 0 10px;
	border-radius: 0 20px 20px 0;
	background-color: var(--white);
}
.serch-input> img{
	width: 45px;
	height: 45px;
	background-color: var(--white);
	border: none;padding: 7px;
	border-radius: 20px 0px 0px 20px;
}
.faq-hero> img{
	width: 50%; 
	max-width: 320px;
}
	
	.company-level-color{
	width:645px;
	height: 300px;
	position: absolute;
	background-color: var(--blue);
	border-radius: 50%;
	top: -210px;
	left: -50%;
	z-index: 50;
}
	.digi-ads-company-products{
	display: flex;
	justify-content: flex-start;
	align-items: flex-start;
	flex-direction: column;
	width: 100%;
	background-color: var(--blue-30);
	border-radius: 0px;
	padding: 10px;
	gap: 10px;
}
.digi-ads-header{
	display: flex;
	justify-content: flex-start;
	align-items: center;
	width: 100%;
	gap: 10px;
}
.digi-ads-header p{
	padding: 1px 8px;
	border-radius: 5px;
	background-color: var(--blue);
	color: var(--white);
}.digi-ads-header h2{
	padding: 1px 8px;
	border-radius: 5px;
	color: var(--blue);
}
.digi-ads-text p{
	color: var(--gray);
}
.digi-ads-btn {
	width: 55%;
}
.digi-ads-company-continer{
	display: flex;
	flex-direction: row;
	align-items: flex-start;
	justify-content: flex-start;
	gap: 10px;
	width: 100%;
	overflow-x: auto;
}
.digi-ads-company-continer > .digi-ads-company{
	min-width: calc((100% - 10px) / 1.15);
}}