/* The post page, under the scope "home and archive only".

   Two kinds of post come through here and both have to survive.

   A few are pushed by ghost_push_*.py as one self-contained `.lar` card
   carrying its own CSS. That card styles `.lar a` and `.lar p`, which beat
   this theme's bare `a` on specificity, so those are already safe. It does
   NOT style its headings, lists or bold, so they fall through to whatever
   the theme says.

   The rest are plain Ghost HTML with no styling of their own at all. Give
   them nothing and they render at browser defaults: Times-sized headings in
   our font on a navy page.

   So: a readable measure, typography for everything the card does not claim,
   and our bare h1 rule neutralised inside the body so it cannot reach into a
   card that was laid out against a different theme.
*/
.postpage{padding:104px 0 80px;}
.postbody{max-width:740px;margin:0 auto;padding:0 24px;}
.pmeta{margin:0;color:var(--muted);font-size:11px;letter-spacing:.16em;
  text-transform:uppercase;font-variation-settings:'wght' 700,'wdth' 82;}
.ptitle{margin:14px 0 0;color:var(--head);line-height:1.1;
  font-size:clamp(30px,4.6vw,46px);letter-spacing:-.025em;
  font-variation-settings:'wght' 800,'wdth' 104;}
.pdek{margin:18px 0 0;color:var(--text2);font-size:19px;line-height:1.55;}
.pbody{margin-top:34px;font-size:17.5px;line-height:1.7;}

/* A third kind: the primers. Each is a standalone document pushed under a
   .pfp wrapper, and it carries its OWN masthead, so the theme's title block
   printed the same headline a second line above it. On the /primers/ hub it
   also produced "Primers . 2 MIN READ", which is not a thing an index page
   should claim. Where the body is a primer, the primer IS the page. */
.postpage:has(.pfp) :is(.pmeta,.ptitle,.pdek){display:none;}
.postpage:has(.pfp){padding-top:76px;}

/* the card brought its own layout; do not inherit a page-level h1 rule */
.pbody :is(h1,h2,h3,h4){font-variation-settings:'wght' 700,'wdth' 100;
  letter-spacing:-.012em;color:var(--head);line-height:1.2;}
.pbody h2{font-size:26px;margin:40px 0 0;}
.pbody h3{font-size:20px;margin:32px 0 0;}
.pbody p{margin:18px 0 0;}
.pbody ul,.pbody ol{margin:18px 0 0;padding-left:22px;}
.pbody li{margin-bottom:9px;}
.pbody img{border-radius:6px;margin:26px 0 0;}
.pbody figure{margin:28px 0 0;}
.pbody figcaption{margin-top:9px;color:var(--muted);font-size:13.5px;
  text-align:center;}
.pbody blockquote{margin:28px 0 0;padding-left:20px;
  border-left:3px solid var(--teal);color:var(--head);}
.pbody hr{margin:36px 0 0;border:0;border-top:1px solid var(--line2);}
.pbody iframe,.pbody video{max-width:100%;border-radius:6px;margin-top:26px;}
.pbody details{margin-top:28px;}
.pbody summary{cursor:pointer;color:var(--tealsoft);}
@media (max-width:820px){
  .postpage{padding:84px 0 56px;}
  .pbody{font-size:16.5px;}
}