/* Blog article template. Brand tokens map to the site's own variables (site.css). */
.post-page{
  --p-font:var(--sans);
  --p-head:var(--serif);
  --p-ink:var(--ink);
  --p-soft:var(--body);
  --p-bg:var(--paper);
  --p-panel:#eeece0;
  --p-line:var(--line);
  --p-line-strong:#c7c5b9;
  --p-accent:var(--ink);
  --p-on-accent:var(--white);
  --p-radius:24px;
  --p-radius-img:16px;
  --p-col:44rem;
  --p-max:1280px;
}
.post-page .post{padding:40px 24px 64px}
@media(min-width:1024px){.post-page .post{padding:64px 48px 96px}}
.post-col{max-width:var(--p-col);margin:0 auto;display:flex;flex-direction:column;gap:24px}
.post-crumbs{font-size:13px;line-height:20px;color:var(--p-soft)}
.post-crumbs a:hover{color:var(--red);text-decoration:underline}
.post-crumbs .s{margin:0 4px}
.post-chip{display:inline-block;width:max-content;padding:4px 12px;border-radius:999px;background:var(--p-panel);color:var(--p-soft);font-size:13px;line-height:20px;font-weight:500}
.post-head{display:flex;flex-direction:column;gap:24px}
.post-title{margin:0;font:400 clamp(34px,5vw,52px)/1.08 var(--p-head);letter-spacing:-.025em;text-wrap:balance;color:var(--p-ink)}
.post-byline{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap}
.post-author{display:flex;align-items:center;gap:12px}
.post-avatar{--d:44px;position:relative;flex:none;display:block;width:var(--d);height:var(--d);overflow:hidden;border-radius:50%;background:#f1dfce}
.post-avatar img{position:absolute;left:calc(var(--d) * -.357);top:calc(var(--d) * -.036);width:calc(var(--d) * 1.75);max-width:none;height:auto}
.post-author .name{display:block;font-weight:700;line-height:1.2}
.post-author .role{display:block;font-size:13px;line-height:20px;color:var(--p-soft)}
.post-dates{margin:0;font-size:13px;line-height:20px;color:var(--p-soft)}
.post-dates .sep{margin:0 4px}
.post-disclaimer{margin:0;font-size:13px;line-height:20px;color:var(--p-soft);border-left:2px solid var(--p-line-strong);padding-left:16px}

/* share */
.post-share{display:flex;flex-wrap:wrap;align-items:center;gap:8px;font-size:13px}
.post-share .lbl{color:var(--p-soft);margin-right:4px}
.post-share .share{display:inline-flex;align-items:center;padding:6px 14px;border:1px solid var(--p-line-strong);border-radius:999px;color:var(--p-ink);font-weight:700;background:transparent;cursor:pointer;font-family:inherit;font-size:13px;line-height:20px;transition:background .2s,border-color .2s}
.post-share .share:hover{background:var(--p-panel);border-color:var(--p-ink)}

/* hero image */
.post-hero{max-width:64rem;margin:40px auto 0}
.post-hero img{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;border-radius:var(--p-radius)}

/* summary, toc, cta strip */
.post-summary{border-radius:var(--p-radius);background:var(--p-panel);padding:28px}
.post-summary .h{margin:0 0 8px;font-weight:700}
.post-summary p:not(.h){margin:0;font-size:17px;line-height:1.6}
.post-toc{border:1px solid var(--p-line);border-radius:var(--p-radius);padding:20px 28px;background:var(--white)}
.post-toc summary{display:flex;align-items:center;justify-content:space-between;cursor:pointer;font-weight:700;list-style:none}
.post-toc summary::-webkit-details-marker{display:none}
.post-toc .chev{transition:transform .2s}
.post-toc[open] .chev{transform:rotate(180deg)}
.post-toc ol{margin:16px 0 0;padding-left:20px;display:flex;flex-direction:column;gap:8px;color:var(--p-soft)}
.post-toc a:hover{color:var(--red);text-decoration:underline}
.post-ctastrip{border:1px solid var(--p-line);border-radius:var(--p-radius);padding:20px 28px;display:flex;flex-direction:column;gap:16px;justify-content:space-between;background:var(--white)}
@media(min-width:640px){.post-ctastrip{flex-direction:row;align-items:center}}
.post-ctastrip p{margin:0;flex:1}
.post-ctastrip .a{font-weight:700}
.post-ctastrip .b{color:var(--p-soft)}
.post-btn{display:inline-flex;align-items:center;justify-content:center;width:max-content;max-width:100%;padding:8px 20px;border-radius:999px;background:var(--p-accent);color:var(--p-on-accent);font-weight:700;font-size:14px;line-height:24px;white-space:nowrap;transition:background .2s,opacity .2s}
.post-btn:hover{background:var(--red);color:#fff}

/* article body */
.post-prose{margin-top:16px;font-size:18px;line-height:1.75;color:var(--p-ink)}
.post-prose h2{margin:2.2em 0 .6em;font:400 clamp(27px,3.4vw,34px)/1.15 var(--p-head);letter-spacing:-.03em;color:var(--p-ink);scroll-margin-top:16px}
.post-prose h3{margin:2em 0 .5em;font:700 22px/1.3 var(--p-font);letter-spacing:-.01em;color:var(--p-ink);scroll-margin-top:16px}
.post-prose p{margin:0 0 1.2em}
.post-prose a{color:var(--red);text-decoration:underline;text-underline-offset:3px}
.post-prose ul,.post-prose ol{margin:0 0 1.2em;padding-left:1.4em}
.post-prose ul{list-style:disc}.post-prose ol{list-style:decimal}
.post-prose li{margin:.45em 0}
.post-prose blockquote{border-left:3px solid var(--p-ink);margin:2em 0;padding:.1em 0 .1em 1.2em;font:400 22px/1.45 var(--p-head);letter-spacing:-.01em}
.post-prose blockquote p{margin:0}
.post-prose .callout{margin:2em 0;padding:18px 22px;border-left:4px solid var(--red);border-radius:0 12px 12px 0;background:var(--p-panel)}
.post-prose .callout p{margin:0}
.post-table{margin:1.6em 0;overflow-x:auto}
.post-prose table{width:100%;min-width:480px;border-collapse:collapse;font-size:16px;line-height:1.5}
.post-prose th,.post-prose td{border-bottom:1px solid var(--p-line);padding:.6em .8em;text-align:left;vertical-align:top}
.post-prose th{font-weight:700;border-bottom-color:var(--p-line-strong)}
.post-prose code{background:var(--p-panel);border-radius:6px;padding:.1em .35em;font-size:.9em}
.post-prose hr{border:0;border-top:1px solid var(--p-line);margin:2.6em 0;height:0}
.post-prose .next{margin:2em 0 0;padding-top:20px;border-top:1px solid var(--p-line)}

/* faq, sources */
.post-faq{display:flex;flex-direction:column;gap:8px;margin-top:24px}
.post-faq h2{margin:0 0 8px;font:400 clamp(27px,3.4vw,34px)/1.15 var(--p-head);letter-spacing:-.03em}
.post-faq .item{border-top:1px solid var(--p-line);padding:20px 0;display:flex;flex-direction:column;gap:8px}
.post-faq h3{margin:0;font:700 20px/1.3 var(--p-font)}
.post-faq p{margin:0;font-size:18px;line-height:28px;color:var(--p-soft)}
.post-sources{display:flex;flex-direction:column;gap:12px;margin-top:16px}
.post-sources h2{margin:0;font:400 26px/1.2 var(--p-head);letter-spacing:-.02em}
.post-sources ul{margin:0;padding-left:20px;display:flex;flex-direction:column;gap:4px}
.post-sources a{color:var(--red);text-decoration:underline;text-underline-offset:2px}

/* closing cta and author box */
.post-banner{margin-top:24px;border-radius:var(--p-radius);background:var(--p-panel);padding:32px;display:flex;flex-direction:column;gap:16px}
.post-banner .h{margin:0;font:400 28px/1.15 var(--p-head);letter-spacing:-.03em}
.post-banner p{margin:0;color:var(--p-soft)}
.post-authorbox{margin-top:24px;border-radius:var(--p-radius);background:var(--p-ink);color:var(--white);padding:32px;display:flex;flex-direction:column;gap:24px}
@media(min-width:640px){.post-authorbox{flex-direction:row;align-items:center}}
.post-authorbox .post-avatar{--d:80px}
.post-authorbox .info{flex:1;display:flex;flex-direction:column;gap:4px}
.post-authorbox .n{font-size:20px;font-weight:700}
.post-authorbox .r{color:rgba(255,253,246,.7)}
.post-authorbox .post-btn{background:var(--white);color:var(--p-ink)}
.post-authorbox .post-btn:hover{background:var(--white);color:var(--p-ink);opacity:.85}

/* related */
.post-related{padding:0 24px 64px}
@media(min-width:1024px){.post-related{padding:0 48px 96px}}
.post-related-inner{max-width:var(--p-max);margin:0 auto}
.post-related-head{display:flex;align-items:flex-end;justify-content:space-between;margin-bottom:32px;gap:16px}
.post-related-head h2{margin:0;font:400 clamp(27px,3.4vw,34px)/1.15 var(--p-head);letter-spacing:-.03em}
.post-related-head a{font-weight:700;text-decoration:underline;text-underline-offset:4px}
.post-related-head a:hover{color:var(--red)}
.post-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:24px}
@media(min-width:768px){.post-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(min-width:1024px){.post-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
.post-card{display:flex;flex-direction:column;height:100%;padding:24px;background:var(--white);border:1px solid var(--p-line);border-radius:var(--p-radius);transition:border-color .2s}
.post-card:hover,.post-card:focus-visible{border-color:var(--red)}
.post-chips{display:flex;flex-wrap:wrap;gap:8px}
.post-meta{margin:20px 0 0;font-size:13px;line-height:20px;color:var(--p-soft)}
.post-meta .sep{margin:0 8px;opacity:.5}
.post-card h3{margin:12px 0 0;font:400 24px/1.2 var(--p-head);letter-spacing:-.025em}
.post-excerpt{margin:12px 0 0;flex:1;color:var(--p-soft);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.post-more{margin-top:24px;display:inline-flex;align-items:center;gap:12px;font-weight:700}
.post-arrow{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:50%;background:var(--p-panel);transition:background .2s,color .2s}
.post-card:hover .post-arrow,.post-card:focus-visible .post-arrow{background:var(--red);color:#fff}
.post-cover{margin-top:24px;width:100%;max-width:100%;height:auto;aspect-ratio:16/10;object-fit:cover;border-radius:var(--p-radius-img);display:block;background:var(--p-line)}
@media (prefers-reduced-motion:reduce){.post-page *{transition:none!important}}
.post-prose pre{margin:1.6em 0;padding:16px 18px;overflow-x:auto;border:1px solid var(--p-line);border-radius:12px;background:var(--white);font-size:14px;line-height:1.6}
.post-prose pre code{display:block;padding:0;background:none;font-family:var(--mono);font-size:inherit;white-space:pre-wrap;overflow-wrap:anywhere}
@media(max-width:620px){.post-prose{font-size:17px;line-height:1.7}.post-summary{padding:22px}.post-banner,.post-authorbox{padding:24px}}