.tl-blog-grid{

display:grid;

grid-template-columns:repeat(auto-fit,minmax(370px,1fr));

gap:40px;

margin-top:20px;

}

.tl-blog-card{

background:#fff;

border-radius:18px;

overflow:hidden;

box-shadow:0 12px 35px rgba(0,0,0,.08);

transition:.35s;

display:flex;

flex-direction:column;

height:100%;

}

.tl-blog-card:hover{

transform:translateY(-8px);

box-shadow:0 20px 45px rgba(0,0,0,.12);

}

.tl-blog-image{

display:block;

height:260px;

overflow:hidden;

}

.tl-blog-image img{

width:100%;

height:100%;

object-fit:cover;

display:block;

transition:.5s;

}

.tl-blog-card:hover img{

transform:scale(1.05);

}

.tl-blog-content{

padding:30px;

display:flex;

flex-direction:column;

flex:1;

}

.tl-blog-date{

display:flex;

align-items:center;

gap:10px;

font-size:15px;

color:#777;

margin-bottom:18px;

}

.tl-blog-date svg{

flex-shrink:0;

}

.tl-blog-content h3{

margin:0;

font-size:22px;

font-weight:700;

line-height:1.35;

margin-bottom:18px;

}

.tl-blog-content h3 a{

color:#222;

text-decoration:none;

display:-webkit-box;

-webkit-line-clamp:2;

-webkit-box-orient:vertical;

overflow:hidden;

}

.tl-blog-content h3 a:hover{

color:#00b050;

}

.tl-blog-content p{

font-size:17px;

color:#666;

line-height:1.8;

margin-bottom:35px;

display:-webkit-box;

-webkit-line-clamp:3;

-webkit-box-orient:vertical;

overflow:hidden;

flex:1;

}

.tl-read-more{

color:#00b050;

font-weight:700;

text-decoration:none;

font-size:17px;

}

.tl-read-more:hover{

text-decoration:underline;

}

@media(max-width:1024px){

.tl-blog-grid{

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

}

}

@media(max-width:768px){

.tl-blog-grid{

grid-template-columns:1fr;

}

}