/*
 * Article body typography – mirrors the classes BlogPost.tsx puts on each element.
 * Applies to block-editor output (paragraphs, headings, lists, images, quotes).
 */
.jg-post-body > * { margin-top: 0; margin-bottom: 0; }

/* Intro paragraphs (before the first heading): text-[1.02rem] leading-[1.85] text-foreground/85 mb-5 */
.jg-post-body > p { line-height: 1.85; color: hsl(var(--foreground) / 0.85); margin-bottom: 1rem; }
.jg-post-body > p:not(h2 ~ p, h3 ~ p) { font-size: 1.02rem; margin-bottom: 1.25rem; }

/* Section headings: mt-10 text-xl md:text-2xl font-bold tracking-tight mb-4 */
.jg-post-body > h2 { margin-top: 2.5rem; margin-bottom: 1rem; font-size: 1.25rem; line-height: 1.75rem; font-weight: 700; letter-spacing: -0.025em; }
.jg-post-body > h3 { margin-top: 2rem; margin-bottom: 0.75rem; font-size: 1.125rem; line-height: 1.75rem; font-weight: 700; letter-spacing: -0.025em; }
@media (min-width: 768px) {
  .jg-post-body > h2 { font-size: 1.5rem; line-height: 2rem; }
  .jg-post-body > h3 { font-size: 1.25rem; }
}

/* Bullets: mt-2 space-y-2, accent dot, text-foreground/85 */
.jg-post-body > ul { list-style: none; padding: 0; margin-top: 0.5rem; margin-bottom: 1rem; }
.jg-post-body > ul > li { position: relative; padding-left: 1.125rem; color: hsl(var(--foreground) / 0.85); line-height: 1.5; }
.jg-post-body > ul > li + li { margin-top: 0.5rem; }
.jg-post-body > ul > li::before { content: ""; position: absolute; left: 0; top: 0.5rem; height: 0.375rem; width: 0.375rem; border-radius: 9999px; background: hsl(var(--accent)); }
.jg-post-body > ol { list-style: decimal; padding-left: 1.5rem; margin: 0.5rem 0 1rem; color: hsl(var(--foreground) / 0.85); }
.jg-post-body > ol > li + li { margin-top: 0.5rem; }

/* Other blocks editors may add later. */
.jg-post-body a { color: hsl(var(--primary)); font-weight: 500; text-decoration: underline; text-underline-offset: 4px; }
.jg-post-body strong { color: hsl(var(--foreground)); font-weight: 600; }
.jg-post-body > blockquote, .jg-post-body > .wp-block-quote { margin: 2rem 0; border-left: 4px solid hsl(var(--primary) / 0.4); padding-left: 1.25rem; color: hsl(var(--foreground) / 0.8); }
.jg-post-body > figure, .jg-post-body > .wp-block-image { margin: 2rem 0; }
.jg-post-body img { max-width: 100%; height: auto; border-radius: 1rem; }
.jg-post-body figcaption { margin-top: 0.5rem; text-align: center; font-size: 0.75rem; color: hsl(var(--muted-foreground)); }
