/* ============================================================
   Tales of Silver — Blog Card Layout (Updated for SLV Theme)
   2‑Column Desktop • Image Right • Text Left • Dark Cards
============================================================ */

/* Hide theme's default blog layout */
.entry-header,
.entry-title,
.entry-content,
.post-thumbnail {
    display: none !important;
}

.lsm-blog-archive article {
    margin: 0 !important;
    padding: 0 !important;
}

.lsm-blog-archive {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 30px;
}

/* ============================================================
   BLOG GRID — Match WooCommerce Product Grid
============================================================ */

.lsm-blog-archive {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 30px;
    margin-top: 20px;
}

/* Each article becomes a grid item */
.lsm-blog-archive article {
    width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
    float: none !important;
}


/* ============================================================
   MOBILE — 1 Column Layout
============================================================ */

@media (max-width: 768px) {

    body.home article,
    body.archive article,
    body.category article,
    body.tag article {
        width: 100%;
        padding: 0;
        margin-bottom: 20px;
        float: none;
    }

    body.home article .post,
    body.archive article .post,
    body.category article .post,
    body.tag article .post {
        flex-direction: column; /* stack */
        min-height: auto;
    }

    .featured-thumbnail {
        width: 100%;
        height: 220px;
    }

    .main-content {
        width: 100%;
        padding: 16px;
    }

    .page-header {
        position: static;
        padding: 12px 16px 0;
    }
}