/** blog Cart **/
.post-item {
    padding: clamp(24px, 3vw, 32px);
    border-radius: 32px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    background: #F7F6F2;
    .post-item-title a {
        font-size: clamp(16px, 2vw, 18px);
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
        overflow: hidden;
        transition: 0.4s;
        font-family: var(--Regular);
        line-height: 30px;
        min-height: 60px;
        margin-block: 24px;
    }
    .btn-cart {
        border: 1px solid #E9E9E9;
        border-radius: 16px;
        padding: 18px 12px;
        display: flex;
        align-items: center;
        justify-content: center;
        margin: 24px auto;
        width: fit-content;
        gap: 6px;
        font-size: 12px;
        font-family: var(--SemiBold);
        transition: 0.4s;
        i {
            font-size: 8px;
        }
        &:hover {
            background: var(--color1);
            color: white;
            border-color: var(--color1);
        }
    }
    & .post-item-image {
        position: relative;
        display: block;
        width: 100%;
        img {
            width: 100%;
            border-radius: 32px;
            filter: grayscale(1);
            transition: 0.4s;
        }
    }
    & .post-date {
        background: white;
        border-radius: 8px;
        display: flex;
        align-items: center;
        justify-content: center;
        width: fit-content;
        margin-inline: auto;
        gap: 4px;
        padding: 2px 5px;
        span {
            font-size: 12px;
            font-family: var(--En);
            width: min-content;
        }
        small {
            width: 38px;
            height: 44px;
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 24px;
            font-family: var(--En);
        }
    }
    &:hover {
        .post-item-image img {
            filter: grayscale(0);
        }
    }
}