/* Nestori blog — article + index styles. Loads AFTER assets/styles.css and
   leans on its design tokens (:root vars), nav, footer, buttons and FAQ. */

/* ---------- Shared ---------- */
.post-shell{max-width:720px;margin:0 auto;padding:0 24px;}
.blog-kicker{font-family:var(--mono);font-size:11px;letter-spacing:0.18em;text-transform:uppercase;color:var(--purple-mid);margin-bottom:14px;}
.breadcrumbs{font-size:13px;color:var(--text-faint);margin:28px 0 0;}
.breadcrumbs a{color:var(--text-muted);border-bottom:1px solid var(--border);}
.breadcrumbs a:hover{color:var(--purple-mid);border-color:var(--purple-border);}
.breadcrumbs .sep{margin:0 7px;color:var(--border);}

/* ---------- Blog index ---------- */
.blog-hero{text-align:center;padding:72px 24px 28px;position:relative;overflow:hidden;}
.blog-hero h1{font-size:clamp(32px,4.6vw,52px);font-weight:700;max-width:760px;margin:0 auto 18px;}
.blog-hero h1 .em{font-family:var(--hand);font-weight:700;font-size:1.12em;color:var(--purple);letter-spacing:0;}
.blog-hero p{font-size:17px;color:var(--text-muted);max-width:560px;margin:0 auto;line-height:1.65;}
.post-grid{max-width:1080px;margin:36px auto 80px;padding:0 24px;display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:22px;}
.post-card{display:flex;flex-direction:column;background:white;border:0.5px solid var(--border);border-radius:var(--radius-lg);padding:28px 26px 24px;transition:transform 240ms cubic-bezier(.2,.8,.2,1),box-shadow 240ms,border-color 240ms;}
.post-card:hover{transform:translateY(-3px);box-shadow:var(--shadow-soft);border-color:var(--purple-border);}
.post-card .pc-kicker{font-family:var(--mono);font-size:10px;letter-spacing:0.18em;text-transform:uppercase;color:var(--purple-mid);margin-bottom:12px;}
.post-card h2{font-size:21px;font-weight:700;line-height:1.25;margin-bottom:10px;}
.post-card p{font-size:14.5px;color:var(--text-muted);line-height:1.6;flex:1;}
.post-card .pc-meta{margin-top:18px;font-size:12.5px;color:var(--text-faint);display:flex;align-items:center;gap:8px;}
.post-card .pc-read{color:var(--purple-mid);font-weight:600;font-size:13.5px;margin-top:14px;display:inline-flex;align-items:center;gap:6px;}
.post-card:hover .pc-read{text-decoration:underline;}

/* ---------- Article ---------- */
.post-hero{padding:26px 0 8px;}
.post-hero h1{font-size:clamp(30px,4.2vw,44px);font-weight:700;line-height:1.12;margin:14px 0 16px;}
.post-hero .post-lead{font-size:18px;color:var(--text-muted);line-height:1.65;}
.post-meta{display:flex;flex-wrap:wrap;align-items:center;gap:8px 14px;margin:20px 0 0;font-size:13px;color:var(--text-faint);}
.post-meta .pm-author{color:var(--text-muted);font-weight:600;}
.post-divider{height:0.5px;background:var(--border);margin:32px 0 8px;}

.prose{font-size:16.5px;line-height:1.75;color:var(--text);}
.prose>*+*{margin-top:1.15em;}
.prose h2{font-family:var(--serif);font-size:27px;font-weight:600;line-height:1.25;margin-top:2em;letter-spacing:-0.01em;}
.prose h3{font-size:19px;font-weight:700;margin-top:1.7em;}
.prose p{color:var(--text);}
.prose strong{font-weight:650;}
.prose a{color:var(--purple-mid);border-bottom:1px solid var(--purple-border);transition:color 160ms,border-color 160ms;}
.prose a:hover{color:var(--purple);border-color:var(--purple);}
.prose ul,.prose ol{padding-left:1.35em;display:flex;flex-direction:column;gap:0.45em;}
.prose li::marker{color:var(--purple-mid);}
.prose blockquote{font-family:var(--serif);font-style:italic;font-size:19px;line-height:1.6;color:var(--purple-deep);border-left:3px solid var(--purple-border);padding:6px 0 6px 22px;margin-top:1.5em;}
.prose .aside{background:var(--bg-warm);border:0.5px solid var(--border-soft);border-radius:var(--radius);padding:18px 20px;font-size:15px;color:var(--text-muted);}
.prose .aside strong{color:var(--text);}

/* Prompt list — the "questions to answer" checklist look */
.prompt-list{background:var(--purple-tint);border:0.5px solid var(--purple-border);border-radius:var(--radius-lg);padding:22px 24px;display:flex;flex-direction:column;gap:10px;}
.prompt-list li{list-style:none;position:relative;padding-left:26px;font-size:15.5px;}
.prompt-list li::before{content:'✍';position:absolute;left:0;top:1px;font-size:14px;}

/* In-article CTA card */
.post-cta{background:linear-gradient(135deg,var(--purple-tint),#fff);border:1px solid var(--purple-border);border-radius:var(--radius-lg);padding:26px 26px 24px;text-align:center;margin-top:2em;}
.post-cta .pc-title{font-size:19px;font-weight:700;margin-bottom:8px;}
.post-cta p{font-size:14.5px;color:var(--text-muted);max-width:440px;margin:0 auto 16px;}
.post-cta .btn{margin:0 auto;}
.post-cta .pc-note{font-size:12.5px;color:var(--text-faint);margin:12px auto 0;}

/* Example letter reuses .letter-card from styles.css but inline in prose */
.prose .letter-card{position:relative;transform:none;margin:1.8em auto 0;max-width:430px;}

/* Related posts */
.related{max-width:720px;margin:56px auto 0;padding:0 24px;}
.related h2{font-size:15px;font-family:var(--mono);font-weight:500;letter-spacing:0.18em;text-transform:uppercase;color:var(--purple-mid);margin-bottom:16px;}
.related-list{display:flex;flex-direction:column;gap:10px;}
.related-list a{display:block;background:white;border:0.5px solid var(--border);border-radius:var(--radius);padding:15px 18px;font-size:15px;font-weight:600;transition:border-color 200ms,transform 200ms;}
.related-list a:hover{border-color:var(--purple-border);transform:translateX(3px);color:var(--purple-mid);}
.related-list a span{display:block;font-size:13px;color:var(--text-faint);font-weight:400;margin-top:3px;}

/* Article FAQ spacing tweak (reuses .faq-list from styles.css) */
.post-faq{margin-top:56px;}
.post-faq>h2{font-family:var(--serif);font-size:26px;font-weight:600;margin-bottom:18px;}

/* Footer of article body */
.post-outro{margin-top:64px;padding-bottom:24px;}

@media (max-width:640px){
  .post-hero h1{font-size:29px;}
  .prose{font-size:16px;}
  .prose h2{font-size:23px;}
  .blog-hero{padding-top:52px;}
}