/* ─── Charity Index landing page: hide header image, keep featured for search ─── */
/* Featured image stays set so it renders in site-search thumbnails + social,
   but we don't want the 1024x1024 map repeating inside the hero on this post. */
.postid-51598 .single-post-header__image-wrap {
    display: none;
}

/* ─── Resource content width constraint ─── */
/* Mirror the theme's .post-content > * pattern: center-constrain text,
   let alignfull/alignwide blocks break out to full width. */
.single-resource .entry-content--resource > * {
    max-width: 52.5rem;
    margin-left: auto;
    margin-right: auto;
}

/* Full-width breakout for aligned blocks, map blocks, and ACF section blocks.
   Chapter-nav blocks are excluded — they're constrained back to 52.5rem by
   the rule below, but without this exclusion the position/left properties
   leak through and shift the TOC ~640px to the right when an editor sets
   the block to Full Width in the editor. */
.single-resource .entry-content--resource > *.alignfull:not(.chapter-nav),
.single-resource .entry-content--resource > section.us-map,
.single-resource .entry-content--resource > section.us-map-2 {
    left: 50%;
    margin-left: -50vw;
    margin-right: -50vw;
    max-width: 100vw;
    position: relative;
    right: 50%;
    width: 100vw;
}

.single-resource .entry-content--resource > *.alignwide:not(.chapter-nav) {
    margin-left: -13.75rem;
    margin-right: -13.75rem;
    max-width: 100vw;
}

/* Keep chapter-nav TOC within content width.
   Also resets position/left/right/width because the GLOBAL .alignfull rule
   in dist/css/style.css sets position: relative; left: 50%; width: 100vw
   on every alignfull element. When an editor sets the TOC block to Full
   Width alignment, the max-width and margins below correctly clip the
   element back to 840px and center it — but the position/left properties
   leak through and shift it ~640px to the right. */
.single-resource .entry-content--resource > .chapter-nav--toc {
    max-width: 52.5rem;
    margin-left: auto;
    margin-right: auto;
    position: static;
    left: auto;
    right: auto;
    width: auto;
}

/* ─── Datawrapper embeds ─── */
/* Datawrapper charts are inserted via Custom HTML blocks, which render the
   raw <div> inline with no WordPress wrapper or default margin. The result is
   that adjacent paragraphs, headings, and other embeds sit flush against the
   chart with 0px gap. Add 3rem top/bottom so the charts read as discrete
   sections — heavier than the 24px paragraph rhythm but proportionate.

   !important is required because the Datawrapper embed script injects
   style="all: initial" on the div after it loads, which resets every
   property — display (back to inline), margin (0), and max-width (none) —
   to its CSS initial value. Vertical margins don't apply to inline
   elements, so display: block is also needed. max-width: 52.5rem matches
   the body column width so charts don't sprawl wider than the surrounding
   text. !important on author CSS beats inline style without !important,
   so all four declarations survive the embed's reset. */
.single-resource .entry-content--resource > div[id^="datawrapper-vis-"] {
    display: block !important;
    max-width: 52.5rem !important;
    margin: 3rem auto !important;
}

/* Sticky bar should be full-width */
.single-resource .entry-content--resource > .chapter-nav--sidebar {
    max-width: none;
    margin-left: 0;
    margin-right: 0;
}

/* ─── Blockquote fix — remove giant gradient quote, fix spacing ─── */

blockquote.wp-block-quote::before,
.entry-content blockquote.wp-block-quote::before,
.entry-content--resource blockquote.wp-block-quote::before {
    content: none !important;
    display: none !important;
}

blockquote.wp-block-quote,
.entry-content blockquote.wp-block-quote,
.entry-content--resource blockquote.wp-block-quote {
    border-left: 4px solid #0b272d !important;
    padding: 1rem 0 1rem 1.5rem !important;
    margin: 2rem auto !important;
    max-width: 52.5rem;
    font-size: 1.125rem !important;
    font-style: italic;
    font-weight: 400;
    line-height: 1.7;
    color: #333;
}

blockquote.wp-block-quote p,
.entry-content blockquote.wp-block-quote p {
    font-size: inherit !important;
    margin-bottom: 0.75rem;
}

blockquote.wp-block-quote p:last-child {
    margin-bottom: 0;
}

blockquote.wp-block-quote cite,
blockquote.wp-block-quote .wp-block-quote__citation {
    display: block;
    margin-top: 0.75rem;
    font-size: 0.875rem !important;
    font-style: normal;
    color: #666;
}

/* ─── Charity Index Publication: align header with body content (52.5rem) ─── */
/* Scoped to body.cpi-publication via the body_class filter in inc/hooks.php.
   The default single-post-header puts its title inside a 50%-width column
   with a 6.25rem left padding, which makes it visually wider and offset
   from the body content (which is constrained to 52.5rem and centered).
   These overrides re-center the header column at the same 52.5rem width as
   the body so titles, dividers, and meta lines align with the text below. */

body.cpi-publication .single-post-header .column.single-post-header__content {
    width: 100%;
    max-width: 52.5rem;
    margin-left: auto;
    margin-right: auto;
    padding-left: 0;
    padding-right: 0;
}

/* Suppress the featured-image side of the 50/50 header layout. The split
   column + full-bleed blue pseudo-element treatment isn't appropriate
   inside the constrained body column. */
body.cpi-publication .single-post-header .column.single-post-header__image-wrap {
    display: none;
}

/* Hide the gray diamond-tipped divider rendered as ::after on the header
   content column. Reads as decorative chrome that competes with the
   chapter-nav TOC card immediately below. */
body.cpi-publication .single-post-header .column.single-post-header__content::after {
    display: none;
}
