/* ============================================================
   Callstand — Blog
   Loaded after guides.css, which carries the base type, article
   and card styling. This file only adds what the blog needs on
   top of it: the index list, pagination, and code blocks.
   ============================================================ */

/* ---------- index ---------- */
.blist { display: grid; gap: 0; padding-bottom: 18px; border-top: 1px solid var(--line); }
.bcard { display: block; padding: 28px 4px; border-bottom: 1px solid var(--line); transition: background .15s; }
.bcard:hover { background: var(--paper); }
.bcard .tag { display: inline-block; font-size: 11px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--ink-soft); margin-bottom: 10px; }
.bcard h2 { font-size: 23px; letter-spacing: -.02em; line-height: 1.28; margin-bottom: 9px; }
.bcard:hover h2 { color: var(--blue); }
.bcard p { font-size: 15px; color: var(--ink-soft); max-width: 68ch; }
.bcard .meta { font-size: 12.5px; color: var(--ink-soft); margin-top: 14px; }
.bempty { padding: 40px 0 80px; color: var(--ink-soft); }

/* ---------- pagination ---------- */
.pager { display: flex; align-items: center; justify-content: center; gap: 8px; flex-wrap: wrap; padding: 34px 0 80px; }
.pager a, .pager span { display: inline-flex; align-items: center; justify-content: center; min-width: 38px; height: 38px; padding: 0 12px; font-size: 14px; border: 2px solid var(--line); border-radius: 3px; color: var(--ink-mid); }
.pager a:hover { border-color: var(--ink); color: var(--ink); }
.pager .is-current { border-color: var(--ink); color: var(--ink); font-weight: 650; }
.pager .is-off { opacity: .4; border-style: dashed; }
.pager .gap { border: none; min-width: 14px; padding: 0; }

/* ---------- code inside a post ---------- */
.article pre { background: var(--paper); border: 2px solid var(--line); border-radius: 3px; padding: 16px 18px; overflow-x: auto; margin: 0 0 22px; }
.article pre code { font-family: var(--mono); font-size: 13px; line-height: 1.6; color: var(--ink); background: none; padding: 0; }
.article code { font-family: var(--mono); font-size: 13.5px; background: var(--paper); border: 1px solid var(--line); border-radius: 3px; padding: 1px 5px; }
.article td code, .article th code { font-size: 12.5px; }