/*
 * CFH Blog Index — bold, editorial, scannable.
 * Used by templates/index.html (the /blog/ landing).
 * Consumed by .cfh-blog-index wrapper class.
 */

.cfh-blog-index { font-family: var(--cfh-font-body); color: var(--cfh-ink); background: var(--cfh-cream); }
.cfh-blog-index *, .cfh-blog-index *::before, .cfh-blog-index *::after { box-sizing: border-box; }
.cfh-blog-index a { color: var(--cfh-ink); text-decoration: none; }
.cfh-blog-index a:hover { color: var(--cfh-magenta); }
.cfh-blog-index :focus-visible { outline: 3px solid var(--cfh-magenta); outline-offset: 3px; }

/* HERO */
.cfh-blog-hero { padding: var(--cfh-space-9) 0 var(--cfh-space-8); border-bottom: 3px solid var(--cfh-ink); }
.cfh-blog-hero h1 { font-family: var(--cfh-font-display); font-weight: 900; line-height: 0.92; letter-spacing: -0.035em; margin: 0; max-width: 14ch; text-wrap: balance; }
.cfh-blog-hero .cfh-prose { font-size: var(--cfh-fs-body-xl); margin-top: var(--cfh-space-5); }

/* POSTS GRID */
.cfh-posts-query { padding: var(--cfh-space-8) 0; }
.cfh-posts-grid { display: grid !important; grid-template-columns: repeat(3, 1fr) !important; gap: var(--cfh-space-6) !important; }
@media (max-width: 1000px) { .cfh-posts-grid { grid-template-columns: repeat(2, 1fr) !important; } }
@media (max-width: 640px)  { .cfh-posts-grid { grid-template-columns: 1fr !important; } }

/* POST CARD */
.cfh-post-card { background: var(--cfh-paper); border: 2px solid var(--cfh-ink); padding: 0 0 var(--cfh-space-5) 0; transition: transform var(--cfh-dur-fast) var(--cfh-ease), box-shadow var(--cfh-dur-fast) var(--cfh-ease); display: flex; flex-direction: column; }
.cfh-post-card:hover { transform: translate(-3px, -3px); box-shadow: 6px 6px 0 var(--cfh-magenta); }
.cfh-post-card-image { width: 100%; height: auto; display: block; border-bottom: 2px solid var(--cfh-ink); margin: 0 !important; }
.cfh-post-card-image img { width: 100%; height: auto; aspect-ratio: 4/3; object-fit: cover; display: block; }

.cfh-post-card-cat { font-family: var(--cfh-font-mono); font-size: var(--cfh-fs-mono-s); letter-spacing: .14em; text-transform: uppercase; color: var(--cfh-magenta); font-weight: 800; padding: var(--cfh-space-4) var(--cfh-space-5) 0; margin: 0; }
.cfh-post-card-cat a { color: var(--cfh-magenta); text-decoration: none; }

.cfh-post-card-title { font-family: var(--cfh-font-display); font-size: clamp(20px, 1.6vw, 26px); line-height: 1.2; letter-spacing: -0.015em; font-weight: 800; padding: var(--cfh-space-3) var(--cfh-space-5) 0; margin: 0 0 var(--cfh-space-3); flex-grow: 0; }
.cfh-post-card-title a { color: var(--cfh-ink); text-decoration: none; }
.cfh-post-card-title a:hover { color: var(--cfh-magenta); }

.cfh-post-card-excerpt { font-size: var(--cfh-fs-body-m); line-height: 1.55; padding: 0 var(--cfh-space-5); margin: 0 0 auto !important; color: var(--cfh-ink); opacity: 0.85; flex-grow: 1; }

.cfh-post-card-meta { padding: var(--cfh-space-4) var(--cfh-space-5) 0; font-family: var(--cfh-font-mono); font-size: var(--cfh-fs-mono-s); letter-spacing: .1em; text-transform: uppercase; color: var(--cfh-dim); }

/* PAGINATION */
.wp-block-query-pagination { margin: var(--cfh-space-7) 0 var(--cfh-space-5); display: flex; gap: var(--cfh-space-3); justify-content: center; flex-wrap: wrap; font-family: var(--cfh-font-mono); }
.wp-block-query-pagination a, .wp-block-query-pagination .page-numbers { color: var(--cfh-ink); text-decoration: none; padding: 8px 14px; border: 1px solid var(--cfh-ink-25); font-weight: 700; letter-spacing: .08em; text-transform: uppercase; font-size: var(--cfh-fs-mono-s); }
.wp-block-query-pagination a:hover, .wp-block-query-pagination .current { background: var(--cfh-magenta); color: var(--cfh-cream); border-color: var(--cfh-magenta); }
.wp-block-query-pagination .current { font-weight: 800; }