/* =========================================================================
   Blog listing (/blog/, page-id-32): equal-height, aligned 3-up grid.
   Replaces Salient "material" masonry (Isotope), which staggered card heights.
   Added 2026-06-15. To revert, empty this file.
   Card height is normalized by clamping title/excerpt lines (vars below) —
   the featured image keeps its natural size (no cropping).
   ========================================================================= */

:root {
    --blog-title-lines: 3;     /* max title lines before "…"  (raise to truncate less) */
    --blog-excerpt-lines: 3;   /* max excerpt lines before "…" */
}

/* Isotope container -> real CSS grid; kill its JS-set height */
.page-id-32 .post-area.masonry .posts-container {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
    height: auto !important;
    width: 100% !important;
}

/* Neutralize Isotope's per-card absolute positioning */
.page-id-32 .posts-container .masonry-blog-item {
    position: relative !important;
    left: auto !important; top: auto !important; right: auto !important;
    transform: none !important;
    width: auto !important;
    margin: 0 !important;
    float: none !important;
    display: flex !important;
    flex-direction: column;
}

/* Stretch inner wrappers so each card's white box fills its grid cell */
.page-id-32 .posts-container .masonry-blog-item .inner-wrap,
.page-id-32 .posts-container .masonry-blog-item .post-content,
.page-id-32 .posts-container .masonry-blog-item .content-inner,
.page-id-32 .posts-container .masonry-blog-item .article-content-wrap {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    height: 100%;
}

/* Keep the featured image at Salient's natural height — do NOT crop/squash */
.page-id-32 .posts-container .masonry-blog-item .post-featured-img {
    flex: 0 0 auto;
}

/* Normalize text height: clamp long titles & excerpts to a consistent depth */
.page-id-32 .posts-container .masonry-blog-item .post-header .title,
.page-id-32 .posts-container .masonry-blog-item h3.title {
    display: -webkit-box;
    -webkit-line-clamp: var(--blog-title-lines);
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.page-id-32 .posts-container .masonry-blog-item .excerpt {
    display: -webkit-box;
    -webkit-line-clamp: var(--blog-excerpt-lines);
    -webkit-box-orient: vertical;
    overflow: hidden;
    margin-bottom: 22px !important;   /* guaranteed breathing room above the author */
}

/* Author/date sits neatly at the bottom of every card */
.page-id-32 .posts-container .masonry-blog-item .article-content-wrap .grav-wrap {
    margin-top: auto;
}

/* Responsive: 2-up tablet, 1-up phone */
@media only screen and (max-width: 999px) {
    .page-id-32 .post-area.masonry .posts-container { grid-template-columns: repeat(2, 1fr); }
}
@media only screen and (max-width: 690px) {
    .page-id-32 .post-area.masonry .posts-container { grid-template-columns: 1fr; }
}
