/* ===========================================================
   BLOG, 2026-10-21. Ported from the live blog-index.php and
   blog-detail.php: green hero, the post's photo overlapping its
   bottom edge, long-form reading on off-white, audit box on cream,
   related posts on off-white.
   =========================================================== */

/* ---------- /blog/ index ---------- */
.pg-blog-grid{padding-top:clamp(48px,6vw,80px)}
.pg-posts{display:grid;gap:clamp(18px,2vw,28px);grid-template-columns:repeat(3,minmax(0,1fr))}
@media (max-width:1000px){ .pg-posts{grid-template-columns:repeat(2,minmax(0,1fr))} }
@media (max-width:640px){ .pg-posts{grid-template-columns:1fr} }
.pg-post{display:flex;flex-direction:column;text-decoration:none;color:var(--charcoal);background:#fff;border-radius:var(--r);overflow:hidden;
  box-shadow:0 0 0 1px rgba(31,58,42,.08),0 24px 50px -32px rgba(31,58,42,.4);
  transition:transform 200ms cubic-bezier(.2,.7,.3,1),box-shadow 200ms ease}
.pg-post:hover{transform:translateY(-3px);box-shadow:0 0 0 1px rgba(200,151,58,.35),0 30px 60px -30px rgba(31,58,42,.45)}
.pg-post__vis{aspect-ratio:16/10;background:linear-gradient(180deg,#FBF6EA,#EFE4CE);display:grid;place-items:center;color:var(--green);overflow:hidden}
.pg-post__img{width:100%;height:100%;object-fit:cover}
.pg-post__b{display:flex;flex-direction:column;flex:1;padding:clamp(18px,2vw,24px)}
.pg-post__eb{font-family:var(--head);font-weight:700;font-size:.74rem;letter-spacing:.12em;text-transform:uppercase;color:#8A6618}
.pg-post__t{margin:10px 0 10px;font-family:var(--head);font-weight:700;font-size:clamp(1.12rem,1.5vw,1.3rem);line-height:1.22;letter-spacing:-.012em;color:var(--green);text-wrap:balance}
.pg-post__exc{color:var(--slate);font-size:.95rem;line-height:1.6;flex:1}
.pg-post__cta{margin-top:16px;font-family:var(--head);font-weight:700;font-size:.92rem;color:var(--green)}
.pg-post:hover .pg-post__cta{color:#8A6618}

/* ---------- /blog/<slug>/ ---------- */
.pg-post-hero .h1{max-width:22ch;font-size:clamp(2rem,4.6vw,3.7rem);line-height:1.06}
.pg-post-hero .lede{max-width:60ch}
/* room under the hero for the photo to ride up over its bottom edge */
.pg-post-hero[data-fig]{padding-bottom:clamp(110px,14vw,200px)}
.pg-post-body--fig{padding-top:0}
.pg-post-fig{max-width:1040px;margin:calc(clamp(70px,10vw,150px) * -1) auto clamp(40px,5vw,64px);border-radius:16px;overflow:hidden;
  box-shadow:0 0 0 1px rgba(31,58,42,.1),0 40px 80px -40px rgba(31,58,42,.6);background:#EFE4CE}
.pg-post-fig img{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:cover}

/* long-form reading */
.pg-prose{max-width:68ch;margin-inline:auto;font-size:1.1rem;line-height:1.7;color:#2B3038}
.pg-prose > * + *{margin-top:1.15em}
.pg-prose p{text-wrap:pretty}
.pg-prose h2{margin-top:2em;font-family:var(--head);font-weight:800;font-size:clamp(1.5rem,2.6vw,1.95rem);line-height:1.18;letter-spacing:-.018em;color:var(--green);text-wrap:balance}
.pg-prose h3{margin-top:1.7em;font-family:var(--head);font-weight:700;font-size:clamp(1.2rem,1.9vw,1.4rem);line-height:1.25;letter-spacing:-.01em;color:var(--green);text-wrap:balance}
.pg-prose h2 + *,.pg-prose h3 + *{margin-top:.6em}
.pg-prose > :first-child{margin-top:0}
.pg-prose strong{font-weight:600;color:var(--charcoal)}
.pg-prose a{color:var(--green);font-weight:500;text-decoration:underline;text-decoration-color:rgba(200,151,58,.8);text-decoration-thickness:1.5px;text-underline-offset:3px;transition:color 160ms ease}
.pg-prose a:hover{color:#8A6618}
.pg-prose ul,.pg-prose ol{padding-left:1.4em}
.pg-prose ul{list-style:disc}
.pg-prose ol{list-style:decimal}
.pg-prose li{padding-left:.3em}
.pg-prose li + li{margin-top:.55em}
.pg-prose li::marker{color:var(--gold-dk);font-weight:700}
.pg-prose blockquote{padding:4px 0 4px 20px;border-left:4px solid var(--gold);color:var(--green);font-style:italic}
.pg-prose img{max-width:100%;height:auto;border-radius:12px}
.pg-prose code{font-size:.9em;padding:2px 6px;border-radius:6px;background:rgba(31,58,42,.07)}
@media (max-width:640px){ .pg-prose{font-size:1.05rem} }

/* the audit box */
.pg-post-cta{max-width:760px;margin-inline:auto;text-align:center;background:#fff;border-radius:var(--r);padding:clamp(30px,5vw,56px) clamp(22px,4vw,48px);
  box-shadow:0 0 0 1px rgba(31,58,42,.08),0 30px 60px -36px rgba(31,58,42,.45)}
.pg-post-cta .eyebrow{color:#8A6618;font-size:clamp(.88rem,1.15vw,1.02rem);letter-spacing:.15em;line-height:1.3}
.pg-post-cta__t{margin-top:14px;font-family:var(--head);font-weight:800;font-size:clamp(1.6rem,3.4vw,2.4rem);line-height:1.1;letter-spacing:-.02em;color:var(--green);text-wrap:balance}
.pg-post-cta__sub{margin:14px auto 0;max-width:56ch;color:var(--slate);line-height:1.6}
.pg-post-cta .cta__row{margin-top:26px;justify-content:center}

/* keep reading */
.pg-rel{display:flex;flex-direction:column;text-decoration:none}
.pg-rel__cat{font-family:var(--head);font-weight:700;font-size:.74rem;letter-spacing:.12em;text-transform:uppercase;color:#8A6618;margin-bottom:10px}
.pg-rel p{flex:1}
.pg-rel__cta{margin-top:16px;font-family:var(--head);font-weight:700;font-size:.92rem;color:var(--green)}
.pg-rel:hover .pg-rel__cta{color:#8A6618}
.pg-back{margin-top:clamp(36px,5vw,56px);text-align:center}
.pg-back a{display:inline-flex;align-items:center;min-height:44px;font-family:var(--head);font-weight:700;font-size:.78rem;letter-spacing:.1em;text-transform:uppercase;color:#8A6618;text-decoration:none}
.pg-back a:hover{color:var(--green)}
