/* Blog previews and articles share the site's typography and yellow accents. */
.blog-feature { max-width: 960px; margin: 0 auto; }
.blog-card { display: flex; background: #f7f7f7; border-bottom: 3px solid #ffd200; }
.blog-card-image { display: block; flex: 0 0 42%; overflow: hidden; }
.blog-card-image img { width: 100%; height: 100%; min-height: 280px; object-fit: cover; }
.blog-card-content { padding: 32px; }
.blog-card-content h3 { font-size: 25px; line-height: 1.35; margin-bottom: 16px; }
.blog-card-content h3 a { color: #262626; }
.blog-card-content h3 a:hover, .blog-card-content h3 a:focus { color: #795f00; }
.blog-meta { color: #666; font-size: 13px; letter-spacing: .3px; }
.blog-all { margin: 28px 0 0; }
.blog-all a { color: #333; text-decoration: underline; }
.blog-article { max-width: 780px; margin: 0 auto; }
.blog-article h2 { font-size: 36px; line-height: 1.25; margin-bottom: 24px; }
.blog-article h3 { font-size: 24px; line-height: 1.4; margin-top: 32px; }
.blog-article p { font-size: 16px; line-height: 1.8; }
.blog-article .blog-meta, .blog-article .blog-sample-note { font-size: 13px; }
.blog-article .blog-lead { font-size: 20px; }
.blog-article figure { margin: 28px 0; }
.blog-article figure img { width: 100%; }
.blog-article figcaption { color: #666; font-size: 13px; margin-top: 8px; }
.blog-article p a { color: #705800; text-decoration: underline; }
.blog-sample-note { padding: 16px; background: #f7f7f7; border-left: 3px solid #ffd200; margin-top: 32px; }
.blog-article-links { display: flex; flex-wrap: wrap; gap: 16px; margin-top: 28px; }
@media (max-width: 767px) {
    .blog-card { flex-direction: column; }
    .blog-card-image { flex-basis: auto; }
    .blog-card-image img { height: 220px; min-height: 0; }
    .blog-card-content { padding: 24px; }
    .blog-article h2 { font-size: 28px; }
    .blog-article .blog-lead { font-size: 18px; }
}

.blog-feature > .blog-card + .blog-card { margin-top: 32px; }
.blog-card-content { min-width: 0; }
.blog-image-placeholder {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 14px;
    min-height: 300px;
    padding: 32px;
    border: 2px dashed #aaa;
    background: #f3f3f3;
    color: #555;
    text-align: center;
    line-height: 1.6;
}
.blog-placeholder-label { color: #333; font-size: 13px; font-weight: 700; text-transform: uppercase; letter-spacing: 1px; }
.blog-placeholder-preview { height: 100%; min-height: 280px; font-size: 14px; }
.blog-steps { padding-left: 24px; font-size: 16px; line-height: 1.8; }
.blog-steps li { margin-bottom: 16px; padding-left: 6px; }
.blog-contact-box { padding: 28px; margin-top: 36px; background: #f7f7f7; border-left: 4px solid #ffd200; }
.blog-contact-box h3 { margin-top: 0; }
@media (max-width: 767px) {
    .blog-image-placeholder { min-height: 220px; padding: 24px; }
    .blog-contact-box { padding: 20px; }
}