/* ==========================================================================
   Articles: the list and the single post.
   The template parts existed; nothing styled them.
   ========================================================================== */
.tcgsf-posts { display: grid; grid-template-columns: repeat( auto-fill, minmax( 280px, 1fr ) ); gap: var( --tcgsf-gap ); margin: 0 0 var( --tcgsf-gap-lg ); }
.tcgsf-post-card { display: flex; flex-direction: column; background: var( --tcgsf-surface ); border: 1px solid var( --tcgsf-border ); border-radius: var( --tcgsf-radius ); overflow: hidden; transition: transform .2s var( --tcgsf-ease ), box-shadow .2s var( --tcgsf-ease ); }
.tcgsf-post-card:hover { transform: translateY( -2px ); box-shadow: var( --tcgsf-shadow ); }
.tcgsf-post-card__media { display: block; aspect-ratio: 16 / 9; overflow: hidden; background: var( --tcgsf-surface-alt ); }
.tcgsf-post-card__media img { width: 100%; height: 100%; object-fit: cover; display: block; }
.tcgsf-post-card__body { display: flex; flex-direction: column; gap: 8px; padding: 18px 20px 20px; flex: 1 1 auto; }
.tcgsf-post-card__title { margin: 0; font-size: 1.15em; line-height: 1.3; }
.tcgsf-post-card__title a { color: var( --tcgsf-ink ); }
.tcgsf-post-card__meta { margin: 0; font-size: .82em; color: var( --tcgsf-muted ); }
.tcgsf-post-card__excerpt { color: var( --tcgsf-ink-soft ); font-size: .95em; }
.tcgsf-post-card__excerpt p { margin: 0; }
.tcgsf-more-link { margin-top: auto; font-weight: 600; color: var( --tcgsf-primary ); }
/* Single */
.tcgsf-entry__head { margin: 6px 0 22px; }
.tcgsf-entry__title { margin: 0 0 10px; font-size: clamp( 26px, 3.4vw, 38px ); line-height: 1.15; }
.tcgsf-entry__meta { margin: 0; color: var( --tcgsf-muted ); font-size: .9em; display: flex; flex-wrap: wrap; gap: 6px 14px; }
.tcgsf-entry__cats a { color: var( --tcgsf-primary ); font-weight: 600; }
.tcgsf-entry__media { margin: 0 0 26px; border-radius: var( --tcgsf-radius ); overflow: hidden; }
.tcgsf-entry__media img { width: 100%; height: auto; display: block; }
.tcgsf-entry__content { font-size: 17px; line-height: 1.7; }
.tcgsf-entry__content h2 { margin: 1.6em 0 .5em; font-size: 1.5em; }
.tcgsf-entry__content h3 { margin: 1.3em 0 .4em; font-size: 1.2em; }
.tcgsf-entry__content figure { margin: 1.4em 0; }
.tcgsf-entry__content figure img { border-radius: var( --tcgsf-radius-sm ); }
.tcgsf-entry__content figcaption { font-size: .85em; color: var( --tcgsf-muted ); margin-top: 6px; }
.tcgsf-entry__content table { width: 100%; border-collapse: collapse; margin: 1.2em 0; font-size: .95em; }
.tcgsf-entry__content th, .tcgsf-entry__content td { padding: 9px 12px; border: 1px solid var( --tcgsf-border ); text-align: left; vertical-align: top; }
.tcgsf-entry__content th { background: var( --tcgsf-surface-alt ); }
.tcgsf-entry__content blockquote { margin: 1.4em 0; padding: 14px 18px; border-left: 4px solid var( --tcgsf-primary ); background: var( --tcgsf-primary-soft ); border-radius: 0 8px 8px 0; }
.tcgsf-entry__content .tcgsf-callout { padding: 14px 18px; border-radius: var( --tcgsf-radius-sm ); background: var( --tcgsf-surface-alt ); border: 1px solid var( --tcgsf-border ); margin: 1.4em 0; }
.tcgsf-entry__footer { margin-top: 30px; padding-top: 16px; border-top: 1px solid var( --tcgsf-border ); font-size: .9em; color: var( --tcgsf-muted ); }
.tcgsf-entry__tags a { display: inline-block; margin: 0 6px 6px 0; padding: 3px 10px; border-radius: 999px; background: var( --tcgsf-surface-alt ); color: var( --tcgsf-ink-soft ); font-size: .85em; }
.tcgsf-entry__credit { margin-top: 14px; font-size: .8em; color: var( --tcgsf-muted ); }
/* Related articles strip on the homepage */
.tcgsf-home-articles .tcgsf-posts { grid-template-columns: repeat( auto-fill, minmax( 240px, 1fr ) ); margin: 0; }
@media ( max-width: 640px ) { .tcgsf-posts { grid-template-columns: 1fr; } }
