.blog-card{background-color:var(--color-secondary-100);border:1px solid var(--color-secondary-300);cursor:pointer;text-align:left;border-radius:12px;flex-direction:column;transition:transform .4s,border-color .2s;display:flex;overflow:hidden;box-shadow:0 10px 15px -3px #0000001a}.blog-card:hover{border-color:color-mix(in srgb, var(--color-primary-400) 60%, transparent);transform:translateY(-4px);box-shadow:0 18px 30px -12px #00000073}.blog-card-content{flex-direction:column;flex:1;justify-content:space-between;gap:20px;padding:24px;display:flex}.blog-card-body{flex:1}.blog-card-title{color:var(--color-neutral-100);margin:0;font-size:1.25rem;font-weight:600;line-height:1.35;transition:color .2s}.blog-card:hover .blog-card-title{color:var(--color-primary-300)}.blog-card-description{color:var(--color-neutral-400);margin-top:12px;font-size:.875rem;line-height:1.55}.blog-card-footer{justify-content:space-between;align-items:flex-end;gap:12px;display:flex}.blog-card-author-info{align-items:center;gap:12px;min-width:0;display:flex}.blog-card-author-avatar{object-fit:cover;border-radius:9999px;flex-shrink:0;width:40px;height:40px}.blog-card-author-details{flex-direction:column;gap:2px;min-width:0;display:flex}.blog-card-author-name{color:var(--color-neutral-100);white-space:nowrap;text-overflow:ellipsis;margin:0;font-size:.875rem;font-weight:500;overflow:hidden}.blog-card-author-link{color:inherit;text-decoration:none}.blog-card-author-link:hover{text-decoration:underline}.blog-card-meta{color:var(--color-neutral-400);gap:6px;font-size:.8125rem;display:flex}.blog-card-likes{color:var(--color-neutral-400);flex-shrink:0;align-items:center;gap:6px;font-size:.875rem;display:flex}.blog-card-footer-right{flex-shrink:0;align-items:center;gap:12px;display:flex}.blog-card-read{background-color:var(--color-secondary-300);width:34px;height:34px;color:var(--color-neutral-200);border-radius:9999px;flex-shrink:0;justify-content:center;align-items:center;transition:transform .2s,background-color .2s,color .2s;display:inline-flex}.blog-card:hover .blog-card-read{background-color:var(--color-primary-400);color:#fff;transform:translate(2px,-2px)}