.post-category{

display:inline-flex;

align-items:center;

padding:8px 16px;

border-radius:999px;

background:rgba(79,124,255,.12);

border:1px solid rgba(79,124,255,.2);

color:#4f7cff;

font-size:13px;

font-weight:600;

margin-bottom:20px;

}

/* Blog */
.featured-post{

display:grid;

grid-template-columns:1.3fr 1fr;

gap:40px;

padding:40px;

margin-top:40px;

border-radius:32px;

}

.featured-post-image{

overflow:hidden;

border-radius:24px;

}

.featured-post-image img{

width:100%;
height:100%;

object-fit:cover;

}

.featured-post-content{

display:flex;

flex-direction:column;

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

	&>a {width: 100% !important;margin-top: 20px}

}

.blog-grid{

display:grid;

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

gap:24px;

margin-top:40px;

}

.blog-card{

overflow:hidden;

border-radius:24px;

transition:.4s;

}

.blog-card:hover{

transform:
translateY(-8px);

}

.blog-image{

height:220px;

overflow:hidden;

}

.blog-image img{

width:100%;
height:100%;

object-fit:cover;

transition:.8s;

}

.blog-card:hover img{

transform:scale(1.08);

}

.blog-content{

padding:24px;

}

.blog-filter button{

padding:12px 22px;

border-radius:14px;

border:1px solid rgba(255,255,255,.08);

background:rgba(19,29,49,.6);

color:#cbd5e1;

font-size:14px;

font-family: Vazirmatn;

cursor:pointer;

transition:.3s ease;

backdrop-filter:blur(10px);

-webkit-backdrop-filter:blur(10px);

}

.blog-filter button:hover{

transform:translateY(-2px);

border-color:rgba(79,124,255,.5);

color:#fff;

background:rgba(79,124,255,.15);

}

.blog-filter button.active{

background:#4f7cff;

color:#fff;

border-color:#4f7cff;

box-shadow:0 10px 25px rgba(79,124,255,.25);

}

.blog-card{

transition:
opacity .35s ease,
transform .35s ease;
position: relative;


}

.blog-card.hide{

opacity:0;

transform:translateY(20px);

pointer-events:none;

}

.blog-card.hidden {

display: none;
}

.blog-link{

display:inline-flex;

align-items:center;

gap:8px;

margin-top:18px;

font-size:14px;

font-weight:600;

color:#4f7cff;

text-decoration:none;

transition:.3s ease;

}

.blog-link:hover, .blog-card:hover .blog-link{

gap:12px;

color:#fff;

}

.blog-link span{

transition:.3s ease;

}

.blog-link:hover span, .blog-card:hover .blog-link span{

transform:
translate(-3px,0px);

}

.card-overlay-link{

position:absolute;

height: 100%;

margin-right: 10px;

inset:0;

z-index:5;

}

.blog-card{

transition:
.35s ease;

}

.blog-card.hide{

display:none;

}

.blog-content span{

color:#7ea1ff;

font-size:14px;

}

.blog-content h4{

font-size:22px;

margin:10px 0;

}

.blog-content p{

color:var(--text-light);

}