.blog{

    padding:100px 0;

    background:white;

}

.blog-grid{

    display:grid;

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

    gap:35px;

}

.blog-card{

    background:#fff;

    border-radius:20px;

    overflow:hidden;

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

    transition:.45s;

}

.blog-card:hover{

    transform:translateY(-12px);

    box-shadow:0 25px 50px rgba(30,136,229,.25);

}

.blog-image{
    
    position: relative;
    height: 450px;
    overflow: hidden;

}

.blog-image img{
    width:100%;
    height:100%;
    object-fit:cover;
    transition:.6s;
}
.blog-card:hover img{

    transform:scale(1.1);

}

.date{
    position: absolute;
    top: 20px;
    left: 20px;
    z-index: 2;

    background: #e51e1e;
    color: #fff;
    width: 65px;
    height: 65px;
    border-radius: 15px;

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

    font-size: 24px;
    font-weight: bold;
}

.date span{

    font-size:13px;

    font-weight:400;

}

.blog-content{

    padding:30px;

}

.category{

    color:#e51e1e;

    font-size:14px;

    font-weight:600;

}

.category i{

    margin-right:8px;

}

.blog-content h3{

    margin:18px 0;

    color:#222;

    font-size:24px;

    line-height:1.5;

    transition:.3s;

}

.blog-card:hover h3{

    color:#e51e1e;

}

.blog-content p{
    color:#666;
    line-height:1.8;
    margin-bottom:25px;

    display:-webkit-box;
    -webkit-line-clamp:3;   /* 3 satır göster */
    -webkit-box-orient:vertical;
    overflow:hidden;
    text-overflow:ellipsis;
}

.blog-content a{

    color:#e51e1e;

    font-weight:600;

}

.blog-content a i{

    margin-left:8px;

    transition:.3s;

}

.blog-content a:hover i{

    margin-left:15px;

}

@media(max-width:992px){

.blog-grid{

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

}

}

@media(max-width:768px){

.blog-grid{

grid-template-columns:1fr;

}

}