/* Rabbit Hole Digital — block editor content, front end.
   Styles Gutenberg blocks inside the prose containers so Field Notes, pages,
   and case-study bodies render on-brand. Scoped so it never leaks into the
   designed sections. Token-driven; works in both light and .rh-dark scopes. */

/* Flex containers already provide vertical rhythm via gap, so strip the
   browser's default block margins and re-add only where a heading needs air. */
.rh-article-prose > *,
.rh-prose > * { margin-top: 0; margin-bottom: 0; }

/* ---------- Headings ---------- */
.rh-article-prose h2,
.rh-prose h2 {
  font-family: var(--font-display); font-weight: 800;
  font-size: var(--h2-size); line-height: var(--h2-lh); letter-spacing: var(--h2-ls);
  color: var(--text-hi); margin: var(--space-4) 0 0; text-wrap: balance;
}
.rh-article-prose h3,
.rh-prose h3 {
  font-family: var(--font-display); font-weight: 700;
  font-size: 1.6rem; letter-spacing: -.01em; line-height: 1.2;
  color: var(--text-hi); margin: var(--space-4) 0 0;
}
.rh-article-prose h4,
.rh-prose h4 {
  font-family: var(--font-display); font-weight: 700; font-size: 1.15rem;
  color: var(--text-hi); margin: var(--space-3) 0 0;
}

/* ---------- Links ---------- */
.rh-article-prose a,
.rh-prose a {
  color: var(--accent); text-decoration: underline;
  text-underline-offset: 3px; text-decoration-thickness: 1px;
}
.rh-article-prose a:hover,
.rh-prose a:hover { color: var(--accent-hover) !important; }

/* ---------- Lists ---------- */
.rh-article-prose ul, .rh-article-prose ol,
.rh-prose ul, .rh-prose ol {
  font-family: var(--font-body); font-size: var(--body-lg-size); line-height: 1.7;
  color: var(--text); margin: 0; padding-left: 1.25rem;
  display: flex; flex-direction: column; gap: .5rem;
}
.rh-article-prose li::marker,
.rh-prose li::marker { color: var(--accent); }
.rh-article-prose li > ul, .rh-article-prose li > ol,
.rh-prose li > ul, .rh-prose li > ol { margin-top: .5rem; }

/* ---------- Quotes ---------- */
.rh-article-prose blockquote,
.rh-prose blockquote {
  margin: 0; padding-left: var(--space-5); border-left: 2px solid var(--accent);
  font-family: var(--font-display); font-weight: var(--quote-weight);
  font-size: var(--quote-size); line-height: var(--quote-lh); letter-spacing: var(--quote-ls);
  color: var(--text); text-wrap: balance;
}
.rh-article-prose blockquote p,
.rh-prose blockquote p { font: inherit; color: inherit; margin: 0; }
.rh-article-prose blockquote cite,
.rh-article-prose .wp-block-quote__citation,
.rh-prose blockquote cite,
.rh-prose .wp-block-quote__citation {
  display: block; margin-top: var(--space-3); font-style: normal;
  font-family: var(--font-mono); font-size: var(--mono-size);
  letter-spacing: var(--mono-ls); text-transform: uppercase; color: var(--text-muted);
}
.rh-article-prose .wp-block-pullquote,
.rh-prose .wp-block-pullquote { padding: 0; text-align: left; }

/* ---------- Media ---------- */
.rh-article-prose figure,
.rh-prose figure { margin: 0; }
.rh-article-prose img,
.rh-prose img {
  display: block; width: 100%; height: auto;
  border-radius: var(--radius-card); border: 1px solid var(--hairline);
}
.rh-article-prose figcaption,
.rh-prose figcaption {
  font-family: var(--font-mono); font-size: 11px; letter-spacing: .1em;
  text-transform: uppercase; color: var(--text-faint); margin-top: var(--space-3);
}

/* ---------- Code ---------- */
.rh-article-prose code,
.rh-prose code {
  font-family: var(--font-mono); font-size: .85em; color: var(--text-hi);
  background: var(--surface-2); border: 1px solid var(--hairline);
  border-radius: 3px; padding: .1em .35em;
}
.rh-article-prose pre,
.rh-prose pre {
  font-family: var(--font-mono); font-size: .8125rem; line-height: 1.6;
  background: var(--ink-900); color: #D3D9E1;
  border: 1px solid var(--hairline-strong); border-radius: var(--radius-card);
  padding: var(--space-5); overflow-x: auto;
}
.rh-article-prose pre code,
.rh-prose pre code { background: none; border: 0; padding: 0; color: inherit; font-size: inherit; }

/* ---------- Separator ---------- */
.rh-article-prose hr,
.rh-prose hr { border: 0; border-top: 1px solid var(--hairline-strong); margin: var(--space-4) 0; height: 0; }

/* ---------- Tables ---------- */
.rh-article-prose table,
.rh-prose table {
  width: 100%; border-collapse: collapse;
  font-family: var(--font-body); font-size: 15px; color: var(--text);
}
.rh-article-prose th, .rh-article-prose td,
.rh-prose th, .rh-prose td { border: 1px solid var(--hairline); padding: .6rem .75rem; text-align: left; }
.rh-article-prose th,
.rh-prose th {
  font-family: var(--font-mono); font-size: 11px; letter-spacing: .1em;
  text-transform: uppercase; color: var(--text-muted); background: var(--surface-2); font-weight: 600;
}
.rh-article-prose .wp-block-table,
.rh-prose .wp-block-table { overflow-x: auto; }

/* ---------- Buttons ---------- */
.rh-article-prose .wp-block-buttons,
.rh-prose .wp-block-buttons { display: flex; flex-wrap: wrap; gap: var(--space-3); }
.rh-article-prose .wp-block-button__link,
.rh-prose .wp-block-button__link {
  font-family: var(--font-mono); font-size: var(--mono-size); font-weight: var(--mono-weight);
  letter-spacing: .12em; text-transform: uppercase; line-height: 1; text-decoration: none;
  display: inline-flex; align-items: center; justify-content: center;
  padding: .75rem 1.25rem; border-radius: var(--radius-button);
  background: var(--accent); color: var(--on-accent); border: 1px solid var(--accent);
  transition: background var(--dur) var(--ease), border-color var(--dur) var(--ease);
}
.rh-article-prose .wp-block-button__link:hover,
.rh-prose .wp-block-button__link:hover { background: var(--accent-hover); border-color: var(--accent-hover); color: var(--on-accent) !important; }
.rh-article-prose .is-style-outline .wp-block-button__link,
.rh-prose .is-style-outline .wp-block-button__link {
  background: transparent; color: var(--text); border-color: var(--hairline-strong);
}

/* ---------- Embeds ---------- */
.rh-article-prose iframe,
.rh-prose iframe { max-width: 100%; border: 0; border-radius: var(--radius-card); }
.rh-article-prose .wp-block-embed__wrapper,
.rh-prose .wp-block-embed__wrapper { position: relative; }

/* ---------- Alignment ----------
   The article body sits in a fixed prose column beside a sidebar, so wide and
   full alignments fill the column rather than breaking the grid. */
.rh-article-prose .alignwide, .rh-article-prose .alignfull,
.rh-prose .alignwide, .rh-prose .alignfull { width: 100%; max-width: 100%; }
.rh-article-prose .aligncenter,
.rh-prose .aligncenter { margin-left: auto; margin-right: auto; }
.rh-article-prose .alignleft,
.rh-prose .alignleft { float: left; margin: 0 var(--space-5) var(--space-4) 0; max-width: 50%; }
.rh-article-prose .alignright,
.rh-prose .alignright { float: right; margin: 0 0 var(--space-4) var(--space-5); max-width: 50%; }