.blog-latest {
    padding: clamp(44px, 6vw, 76px) 0;
    background: var(--surface, #f7faf8);
}

.blog-latest[hidden] { display: none; }
.blog-latest-heading { margin: 0 0 10px; color: var(--dark); }
.blog-latest-intro { margin: 0 0 24px; color: var(--text-muted, #666); }
.blog-latest-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 22px;
}
.blog-latest-card {
    min-width: 0;
    overflow: hidden;
    border: 1px solid var(--border-color, #dce6e1);
    border-radius: var(--border-radius-lg, 14px);
    background: var(--surface-raised, #fff);
    color: var(--text, #26332d);
    box-shadow: var(--shadow-sm, 0 3px 14px #153b2710);
    text-decoration: none;
    transition: transform .18s ease, box-shadow .18s ease;
}
.blog-latest-card:hover { transform: translateY(-3px); box-shadow: var(--shadow-md, 0 10px 26px #153b271a); }
.blog-latest-cover { display: block; width: 100%; aspect-ratio: 16 / 9; object-fit: cover; }
.blog-latest-card-content { padding: 20px; }
.blog-latest-date { color: var(--text-muted, #666); font-size: .82rem; }
.blog-latest-card h3 { margin: 8px 0; color: var(--dark); font-size: 1.12rem; line-height: 1.4; }
.blog-latest-card p { margin: 0; color: var(--text-muted, #666); font-size: .92rem; line-height: 1.6; }
.blog-latest-status { color: var(--text-muted, #666); }
.blog-latest-more { display: inline-flex; margin-top: 24px; color: var(--primary); font-weight: 700; }
.blog-latest-card:focus-visible, .blog-latest-more:focus-visible { outline: 3px solid var(--orange-light, #ef9b44); outline-offset: 3px; }

@media (max-width: 800px) {
    .blog-latest-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 560px) {
    .blog-latest-grid { grid-template-columns: 1fr; }
    .blog-latest-card-content { padding: 17px; }
}