/*new blog page css*/
 
.blog-hero{
	display:flex;
	flex-direction;column;
	justify-content:center;
	align-items:center;
	text-align: center;
	margin: 0 auto;
	padding:100px 0px;
}
.blog-hero p{
	font-size:18px;
	max-width:650px;
}
 
.blog-filter a {
    border: 1px solid #02fd;
    padding: 5px 20px;
    border-radius: 20px;
}
.blog-filter {
    display: flex;
    gap: 10px;
    align-items: center;
    justify-content: center;
	margin-bottom:30px;
}
.posts-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:30px;
}
.blog-card:nth-child(4) {
    border-radius: 18px;
    overflow: hidden;
    background: #fffeee;
    grid-column: span 3;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
	gap:50px;
}
 
.blog-card{
    border-radius:18px;
    overflow:hidden;
    background:#fff;
}
 
.blog-card img {
    width: 100%;
    display: block;
    aspect-ratio: 2 / 1;
    height: auto;
    object-fit: cover;
    object-position: top;
}
span.post-category {
    padding: 10px 20px;
    border: 1px solid #1deded;
	background:#fff;
	font-size:14px;
    border-radius: 50px;
}
 
img.avatar.avatar-35.photo {
    aspect-ratio: 1 / 1;
    max-width: 45px;
    border-radius: 50%;
}
.blog-post-content .post-content {
    padding-left: 0px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
}
 .blog-card:nth-child(4).blog-card:nth-child(4) {
    padding: 50px 50px;
}
.blog-card:first-child.blog-card img {
    width: 100%;
    display: block;
	aspect-ratio: 1 / 1;
}
 
.meta-container {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-top: 1px solid #0e4b771a;
    padding-top: 20px;
} 
.post-meta {
    display: flex;
    justify-content: flex-start;
    gap: 10px;
    width: 100%;
    max-width: 250px;
}
 
.featured-post{
	padding:0 20px;
}
.featured-post .container{
    display:grid;
    grid-template-columns:1fr 1fr;
    margin-bottom:60px;
	padding:0;
	border-radius:16px;
	background:#FCEDF2;
	overflow:hidden;
}
.featured-image {
    overflow: hidden;
}
 
.featured-image img {
    width: 100%;
    object-fit: cover;
    object-position: left;
}
.featured-post.container:hover.featured-image>img: {
    transform:scale(1.1);
	transition:all 0.3s ease;
}
 
.featured-content{
    padding:40px;
}