.ii-from-blog{
    width:100%;
    padding:3.5rem 0;
    background:#fafaf9;
    border-bottom:1px solid #e7e5e4;
    color:#1c1917;
}
.ii-from-blog-inner{
    width:min(calc(100% - 2rem),80rem);
    margin:0 auto;
}
.ii-from-blog-header{
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    gap:1rem;
    margin-bottom:2rem;
}
.ii-from-blog-badge{
    display:inline-flex;
    align-items:center;
    gap:.5rem;
    padding:.3rem .7rem;
    margin-bottom:.5rem;
    border:1px solid #d6d3d1;
    border-radius:999px;
    background:#e7e5e4;
    color:#1c1917;
    font-size:.62rem;
    font-weight:900;
    letter-spacing:.12em;
    text-transform:uppercase;
}
.ii-from-blog-badge .dashicons{
    width:14px;
    height:14px;
    color:#44403c;
    font-size:14px;
}
.ii-from-blog-header h2{
    margin:0;
    color:#1c1917;
    font-size:clamp(1.8rem,4vw,2.7rem);
    line-height:1.05;
    font-weight:900;
    letter-spacing:-.04em;
    text-transform:uppercase;
}
.ii-from-blog-header p{
    max-width:38rem;
    margin:.35rem 0 0;
    color:#57534e;
    font-size:.78rem;
    line-height:1.55;
    font-weight:500;
}
.ii-from-blog-all{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:.45rem;
    flex:0 0 auto;
    padding:.65rem 1rem;
    border:1px solid #1c1917;
    border-radius:.75rem;
    background:#1c1917;
    color:#fff;
    text-decoration:none;
    font-size:.62rem;
    font-weight:900;
    letter-spacing:.08em;
    text-transform:uppercase;
    transition:background .2s ease,transform .2s ease;
}
.ii-from-blog-all:hover{
    background:#292524;
    color:#fff;
    transform:translateY(-1px);
}
.ii-from-blog-all .dashicons{
    width:15px;
    height:15px;
    font-size:15px;
}
.ii-from-blog-grid{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:1.5rem;
}
.ii-from-blog-card{
    display:flex;
    flex-direction:column;
    justify-content:space-between;
    overflow:hidden;
    border:1px solid #e7e5e4;
    border-radius:1rem;
    background:#fff;
    box-shadow:0 2px 7px rgba(0,0,0,.04);
    transition:box-shadow .3s ease,transform .3s ease;
}
.ii-from-blog-card:hover{
    box-shadow:0 15px 35px rgba(0,0,0,.12);
    transform:translateY(-2px);
}
.ii-from-blog-image{
    position:relative;
    height:12rem;
    overflow:hidden;
}
.ii-from-blog-image img{
    display:block;
    width:100%;
    height:100%;
    object-fit:cover;
    transition:transform .5s ease;
}
.ii-from-blog-card:hover .ii-from-blog-image img{
    transform:scale(1.05);
}
.ii-from-blog-category{
    position:absolute;
    top:.75rem;
    left:.75rem;
    padding:.35rem .6rem;
    border:1px solid #44403c;
    border-radius:.35rem;
    background:#1c1917;
    color:#fff;
    font-size:.55rem;
    font-weight:900;
    letter-spacing:.04em;
    text-transform:uppercase;
    box-shadow:0 3px 8px rgba(0,0,0,.2);
}
.ii-from-blog-content{
    padding:1.25rem;
}
.ii-from-blog-meta{
    display:flex;
    align-items:center;
    flex-wrap:wrap;
    gap:.55rem;
    margin-bottom:.55rem;
    color:#78716c;
    font-size:.63rem;
    font-weight:700;
}
.ii-from-blog-meta>span{
    display:inline-flex;
    align-items:center;
    gap:.25rem;
}
.ii-from-blog-meta .dashicons{
    width:13px;
    height:13px;
    color:#44403c;
    font-size:13px;
}
.ii-from-blog-content h3{
    margin:0;
    color:#1c1917;
    font-size:1rem;
    line-height:1.35;
    font-weight:900;
}
.ii-from-blog-content p{
    display:-webkit-box;
    overflow:hidden;
    margin:.55rem 0 0;
    color:#57534e;
    font-size:.7rem;
    line-height:1.65;
    font-weight:500;
    -webkit-box-orient:vertical;
    -webkit-line-clamp:3;
}
.ii-from-blog-footer{
    padding:0 1.25rem 1.25rem;
}
.ii-from-blog-footer>span{
    display:inline-flex;
    align-items:center;
    gap:.3rem;
    color:#1c1917;
    font-size:.65rem;
    font-weight:900;
}
.ii-from-blog-footer .dashicons{
    width:14px;
    height:14px;
    font-size:14px;
    transition:transform .2s ease;
}
.ii-from-blog-card:hover .ii-from-blog-footer .dashicons{
    transform:translateX(3px);
}
@media(max-width:900px){
    .ii-from-blog-grid{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}
@media(max-width:640px){
    .ii-from-blog{
        padding:3rem 0;
    }
    .ii-from-blog-inner{
        width:min(calc(100% - 1.25rem),80rem);
    }
    .ii-from-blog-header{
        align-items:flex-start;
        flex-direction:column;
    }
    .ii-from-blog-all{
        width:100%;
    }
    .ii-from-blog-grid{
        grid-template-columns:1fr;
    }
}