/* SAMIES Universal Blog Grid 0.1.0 — sits inside the Pattern888 content row.
   Hero / B&W / welcome band / 30x140 all come from the Pattern888 runtime, not from here. */

/* section wrapper: fully transparent so the hero and B&W layers show through */
.samies-blog-grid-section {
    background: transparent !important;
    margin: 0 0 28px !important;
    padding: 0 !important;
}
.samies-blog-grid-section > .kt-row-column-wrap {
    max-width: 100% !important;
    padding: 0 !important;
}

/* grid: 80% of the page width, centred; 3 / 2 / 1 columns */
.samies-blog-grid {
    width: min(var(--samies-blog-width, 80vw), 100%);
    margin: 0 auto;
}
.samies-blog-grid .wp-block-post-template {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: clamp(16px, 2vw, 28px);
    margin: 0;
    padding: 0;
    list-style: none;
}
@media (max-width: 1024px) {
    .samies-blog-grid .wp-block-post-template { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
}
@media (max-width: 767px) {
    .samies-blog-grid { width: 100%; }
    .samies-blog-grid .wp-block-post-template { grid-template-columns: minmax(0, 1fr) !important; }
}

/* card: translucent — background on ::before at the profile panel opacity (same rule as the
   Pattern888 sections), so text stays 100% and the hero/B&W stay visible */
.samies-blog-grid .wp-block-post {
    position: relative;
    isolation: isolate;
    display: flex;
    flex-direction: column;
    margin: 0;
    overflow: hidden;
    border-top: 4px solid var(--samies-accent, #b10000);
    box-shadow: 0 6px 18px rgba(0, 0, 0, .35);
}
.samies-blog-grid .wp-block-post::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    pointer-events: none;
    background-color: rgba(0, 0, 0, .55);
    background-image: var(--samies-texture, none);
    background-repeat: repeat;
    opacity: var(--samies-panel-opacity, .5);
}
.samies-blog-grid .wp-block-post-featured-image { margin: 0; }
.samies-blog-grid .wp-block-post-featured-image img {
    display: block;
    width: 100%;
    height: auto;
    aspect-ratio: 4 / 3;
    object-fit: cover;
}
.samies-blog-grid .wp-block-post-title {
    margin: 16px 18px 8px;
    font-size: clamp(18px, 1.5vw, 22px);
    line-height: 1.25;
    color: var(--samies-heading, #fff);
}
.samies-blog-grid .wp-block-post-excerpt {
    display: flex;
    flex-direction: column;
    flex: 1;
    margin: 0 18px 18px;
}
.samies-blog-grid .wp-block-post-excerpt__excerpt {
    margin: 0 0 12px;
    color: var(--samies-text, #f2f2f2);
    font-size: 15px;
    line-height: 1.55;
}
.samies-blog-grid .wp-block-post-excerpt__more-text { margin: auto 0 0; }
.samies-blog-grid .wp-block-post-excerpt__more-link {
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .04em;
    text-decoration: none;
    border-bottom: 2px solid var(--samies-accent, #b10000);
}
.samies-blog-grid :is(.wp-block-post-title, .wp-block-post-excerpt, .wp-block-query-no-results) {
    text-shadow: 0 1px 3px rgba(0, 0, 0, .85), 0 0 12px rgba(0, 0, 0, .55);
}

/* link colours — scoped to the grid only (header/footer nav untouched) */
body .samies-blog-grid a,
body .samies-blog-grid a:visited { color: var(--samies-blog-link, #fff) !important; }
body .samies-blog-grid a:hover,
body .samies-blog-grid a:focus-visible { color: var(--samies-blog-link-hover, #b10000) !important; }
body .samies-blog-grid [aria-current="page"] { color: var(--samies-blog-link-current, #168a3a) !important; }
body .samies-blog-grid a:focus-visible { outline: 2px solid #fff; outline-offset: 2px; }

/* pagination (only appears past one page of posts) */
.samies-blog-grid .wp-block-query-pagination { margin-top: 28px; gap: 10px; font-weight: 700; }
