/* Additive, C2-token-consistent prose styling for WordPress post content.
   This is new (the prototype never designed a blog page) — everything else
   on /blog/ and post pages reuses .p-hero/.sec/.idx/.faq/.close as-is from
   bold.css + pages.css. Uses only --tokens already defined in bold.css. */
.post-body{max-width:38em;font-size:18px;line-height:1.95}
.post-body>*+*{margin-top:1.1em}
.post-body h2{font-family:var(--serif);font-weight:900;font-size:clamp(26px,3vw,40px);line-height:1.3;margin-top:1.6em}
.post-body h3{font-family:var(--serif);font-weight:900;font-size:clamp(21px,2.2vw,28px);line-height:1.4;margin-top:1.4em}
.post-body ul,.post-body ol{padding-left:1.4em}
.post-body li+li{margin-top:.4em}
/* --ver (#EF4423) on --paper only reaches ~3.2:1 at body text size, short of
   WCAG AA's 4.5:1 — use --ink (near-black, ample contrast) for inline links
   and reserve --ver for hover, matching how the rest of the site only uses
   --ver on large/bold display text. */
.post-body a{color:var(--ink);text-decoration:underline;text-underline-offset:3px}
.post-body a:hover{color:var(--ver)}
.post-body strong{font-weight:700}
.post-body blockquote{border-left:3px solid var(--ver);padding-left:1.2em;color:var(--mute);font-style:normal}
.post-body figure{margin-top:1.4em}
.post-body figure img{width:100%;height:auto;border:1px solid var(--line)}
.post-body figcaption{font-size:14px;color:var(--mute);margin-top:8px}
.post-body hr{border:0;border-top:1px solid var(--line);margin:2em 0}
.post-body>p:first-of-type:first-letter{all:unset}

.post-hero-img{background:var(--ink)}
.post-hero-img img{width:100%;height:min(70svh,640px);object-fit:cover}

/* blog index: reuse .idx.is-grid (thumbnails always on), no list/grid toggle needed */
.idx.is-grid .cl{display:block;margin-top:2px}
/* post titles are long sentences: smaller display size, balanced lines (2026-10-01) */
.p-hero h1.post-title{font-size:clamp(32px,4.2vw,76px);line-height:1.22;text-wrap:balance;word-break:normal}
/* images keep their own proportions and are never upscaled (2026-10-01, KUMA) */
#blog-idx .th{aspect-ratio:1200/630}                         /* featured images are 1200×630 cards with type on them — never crop */
.post-hero-img{padding:0 var(--g) clamp(32px,4vw,56px);text-align:center}
.post-hero-img img{display:inline-block;width:100%;max-width:800px;height:auto;object-fit:contain}   /* 1200px source ÷ 1.5 */
.post-body img{max-width:100%;height:auto}

/* FAQ carried over from WordPress (Rank Math / Elementor) — native details, readable without JS */
.post-faq{max-width:684px;margin:clamp(40px,6vw,72px) auto 0;padding:0 var(--g)}
.post-faq h2{font-weight:700;font-size:clamp(22px,2.4vw,28px);margin:0 0 16px}
.post-faq details{border-top:1px solid currentColor;padding:14px 0}
.post-faq details:last-child{border-bottom:1px solid currentColor}
.post-faq summary{cursor:pointer;font-weight:700;line-height:1.6;text-wrap:pretty}
.post-faq summary:focus-visible{outline:2px solid var(--ver);outline-offset:4px}
.post-faq details p{margin:10px 0 0;line-height:1.85;text-wrap:pretty}
