.blog-card{--text-main:var(--color-text);--text-muted:var(--color-text-dim);--text-desc:color-mix(in srgb, var(--color-text) 72%, var(--color-text-dim));--accent-border:var(--color-border);--card-fallback-start:color-mix(in srgb, var(--color-card-bg) 96%, var(--color-text) 4%);--card-fallback-mid:color-mix(in srgb, var(--color-card-bg) 90%, var(--color-text) 10%);--card-fallback-end:color-mix(in srgb, var(--color-card-bg) 92%, var(--color-border) 8%);--avatar-border:color-mix(in srgb, var(--color-border) 45%, transparent);--avatar-bg:color-mix(in srgb, var(--color-card-bg) 86%, var(--color-text) 14%);--avatar-fallback-color:var(--color-text);cursor:pointer;background-color:#0000;border:none;flex-direction:column;width:100%;text-decoration:none;transition:transform .4s cubic-bezier(.16,1,.3,1);display:flex;position:relative;overflow:hidden}.blog-card:hover{transform:translateY(-6px)}.blog-card-image-container{aspect-ratio:16/10;border-radius:12px;width:100%;position:relative;overflow:hidden}.blog-card-badge{-webkit-backdrop-filter:blur(12px);color:#fff;text-transform:uppercase;letter-spacing:.08em;z-index:2;pointer-events:none;background:#0000008c;border:1px solid #ffffff26;border-radius:9999px;padding:.35rem .8rem;font-size:.65rem;font-weight:700;transition:all .3s cubic-bezier(.16,1,.3,1);position:absolute;top:1rem;left:1rem;box-shadow:0 4px 12px #00000040}[data-theme=light] .blog-card-badge{color:#000;background:#ffffffb3;border-color:#0000001f;box-shadow:0 4px 12px #0000000f}.blog-card-bg-image{object-fit:cover;width:100%;height:100%;transition:transform .8s cubic-bezier(.16,1,.3,1)}.blog-card:hover .blog-card-bg-image{transform:scale(1.04)}.blog-card-image-fallback{background:linear-gradient(135deg, var(--card-fallback-start) 0%, var(--card-fallback-mid) 40%, var(--card-fallback-end) 100%);width:100%;height:100%}.blog-card-content{flex-direction:column;flex-grow:1;gap:.65rem;padding:1.25rem 0 0;display:flex}.blog-card-meta{align-items:center;gap:.5rem;display:flex}.blog-card-category{color:var(--primary-color);text-transform:uppercase;letter-spacing:.08em;font-size:.68rem;font-weight:700}.blog-card-date-meta{text-transform:uppercase;letter-spacing:.05em;color:var(--color-text);opacity:.65;font-size:.68rem;font-weight:500}.blog-card-dot{color:var(--color-text);opacity:.65;font-size:.68rem}.blog-card-read-time{text-transform:uppercase;letter-spacing:.05em;color:var(--color-text);opacity:.65;font-size:.68rem;font-weight:500}.blog-card-title{font-family:var(--font-heading), sans-serif;color:var(--color-text);-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical;margin:0;font-size:1.3rem;font-weight:700;line-height:1.3;transition:color .3s;display:-webkit-box;overflow:hidden}.blog-card:hover .blog-card-title{color:#fff}[data-theme=light] .blog-card:hover .blog-card-title{color:#000}.blog-card-desc{font-family:var(--font-body), sans-serif;color:var(--color-text);-webkit-line-clamp:2;line-clamp:2;opacity:.7;-webkit-box-orient:vertical;margin:0;font-size:.85rem;font-weight:600;line-height:1.55;transition:opacity .3s;display:-webkit-box;overflow:hidden}.blog-card:hover .blog-card-desc{opacity:.95}.blog-card-footer{justify-content:space-between;align-items:center;margin-top:auto;padding-top:1rem;display:flex}.blog-card-author{align-items:center;gap:.75rem;display:flex}.avatar{border:1px solid var(--avatar-border);background:var(--avatar-bg);border-radius:50%;justify-content:center;align-items:center;width:2rem;height:2rem;display:flex;overflow:hidden}.blog-card-avatar{object-fit:cover;width:100%;height:100%}.blog-card-avatar-fallback{color:var(--avatar-fallback-color);text-transform:uppercase;font-size:10px;font-weight:700}.blog-card-author-info{flex-direction:column;gap:.15rem;display:flex}.blog-card-author-name{color:var(--color-text);font-size:.85rem;font-weight:600}.blog-card-date{color:var(--color-text-dim);font-size:.7rem}.blog-card-arrow-wrap{background:color-mix(in srgb, var(--color-text) 5%, transparent);border:1px solid var(--color-border);width:2rem;height:2rem;color:var(--color-text);border-radius:50%;justify-content:center;align-items:center;transition:all .3s cubic-bezier(.16,1,.3,1);display:flex}.blog-card:hover .blog-card-arrow-wrap{color:#000;background:#fff;border-color:#fff}[data-theme=light] .blog-card:hover .blog-card-arrow-wrap{color:#fff;background:#000;border-color:#000}.blog-card-arrow{transition:transform .3s}.blog-card:hover .blog-card-arrow{transform:translate(1px,-1px)}
