/* Penny Brohn — block-editor content styles (front end + editor).
   THE BLOCK-STYLE CONTRACT: the client's pages reference these class names
   (is-style-intro, is-style-pb-leaf, is-style-pb-cta, is-style-pb-callout,
   is-style-pb-soft, is-style-pb-dawn, is-style-pb-quote-mulberry). Ported from
   WPCodeBox snippets 32 + 33 on 3 Sep 2026 and retokenised onto the design
   system. Registered in inc/block-styles.php. Never rename a class here. */

/* ---- Base type for block content (matches .inner-content in the DS) ---- */
.wp-block-heading strong{font-weight:800;color:var(--ds-color-mulberry,#835263);}
/* heading dual-font emphasis */
.wp-block-heading strong{font-weight:800;color:var(--ds-color-mulberry,#835263);}
h2.wp-block-heading{font-family:'Flink',system-ui,Arial,sans-serif;font-weight:800;font-size:30px;line-height:1.15;}
h3.wp-block-heading{font-family:'Flink',system-ui,Arial,sans-serif;font-weight:800;font-size:22px;line-height:1.2;}

/* intro paragraph */
.is-style-intro{font-size:23px;font-weight:500;line-height:1.5;letter-spacing:-.003em;color:var(--ds-color-navy,var(--navy,#23375A));margin-bottom:30px;}
@media (max-width:600px){.is-style-intro{font-size:20px;}}

/* lists */
.wp-block-list li::marker{color:var(--ds-color-mulberry,#835263);}

/* separator */
.wp-block-separator{border:none;height:1px;background:var(--ds-color-border-subtle,#EDEAE7);max-width:none;}

/* image rounded + caption */
.wp-block-image.is-style-rounded img{border-radius:15px;}
.wp-block-image figcaption{font-size:14px;opacity:.75;}

/* callout group */
.pb-callout{background:var(--ds-color-mint,#D2F0F0);border-radius:14px;padding:28px 32px;}
.pb-callout h3{margin-top:0;}

/* quote */
.wp-block-quote{border-left:3px solid var(--ds-color-mulberry,#835263);padding-left:24px;font-style:normal;}
.wp-block-quote p{font-size:20px;}

/* pullquote — buff panel with brand quote mark, after row.pull-quote in the design system */
.wp-block-pullquote{border:none !important;position:static;background:var(--ds-color-buff,var(--buff,#F4EFE9));border-radius:18px;padding:44px 40px 40px !important;margin:40px 0;text-align:center !important;}
.wp-block-pullquote::before{content:"“";display:block;font-family:'Mackinac',serif;font-weight:500;font-size:76px;line-height:.62;color:var(--ds-color-mulberry,#835263);margin-bottom:14px;}
.wp-block-pullquote blockquote{border:none;margin:0;padding:0;}
/* no theme quote icon; we use our own mark on the figure */
figure.wp-block-pullquote blockquote::before{content:none !important;display:none !important;}
.wp-block-pullquote blockquote p{font-family:'Mackinac',serif;font-weight:500;font-size:27px;line-height:1.28;letter-spacing:-.005em;color:var(--ds-color-navy,#23375A);margin:0;}
.wp-block-pullquote cite{display:block;margin-top:22px;font-family:'Flink',system-ui,Arial,sans-serif;font-style:normal;font-size:15px;font-weight:700;color:var(--ds-color-navy,#23375A);}
.wp-block-pullquote cite::before{content:"";display:block;width:34px;height:2px;border-radius:2px;margin:0 auto 16px;background:var(--ds-color-navy,#23375A);opacity:.35;}

/* pullquote — mulberry variant (block style: "Mulberry") */
.wp-block-pullquote.is-style-pb-quote-mulberry{background:var(--ds-color-mulberry,#835263);}
.wp-block-pullquote.is-style-pb-quote-mulberry::before{color:var(--ds-color-buttercup-deep,#FFDC50);}
.wp-block-pullquote.is-style-pb-quote-mulberry blockquote p{color:#fff;}
.wp-block-pullquote.is-style-pb-quote-mulberry cite{color:rgba(255,255,255,.85);}
.wp-block-pullquote.is-style-pb-quote-mulberry cite::before{background:var(--ds-color-buttercup-deep,#FFDC50);opacity:.7;}

@media (max-width:600px){
.wp-block-pullquote{padding:34px 26px 30px !important;border-radius:14px;}
.wp-block-pullquote blockquote p{font-size:23px;}
.wp-block-pullquote::before{font-size:60px;}
}

/* table — override theme's all-cell borders */
.wp-block-table table,
.wp-block-table th,
.wp-block-table td{border:none;font-size:inherit;}
.wp-block-table table{border-collapse:collapse;width:100%;}
.wp-block-table th{text-align:left;padding:12px 16px;font-family:'Flink',system-ui,Arial,sans-serif;font-weight:800;font-size:15px;color:var(--ds-color-navy,#23375A);border-bottom:2px solid var(--ds-color-border-subtle,#EDEAE7) !important;}
.wp-block-table td{padding:12px 16px;font-size:16px;border-bottom:1px solid var(--ds-color-border-subtle,#EDEAE7) !important;}
.wp-block-table.is-style-stripes tbody tr:nth-child(odd) td{background:var(--ds-color-buff,#F4EFE9);}

/* file / downloads — beige */
.wp-block-file{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;background:var(--ds-color-buff,#F4EFE9);border:none;border-radius:12px;padding:16px 20px;}
.wp-block-file>a:first-child{font-family:'Flink',system-ui,Arial,sans-serif;font-weight:800;font-size:16px;color:var(--ds-color-navy,#23375A);text-decoration:none;}

/* details / FAQ — beige */
.wp-block-details{background:var(--ds-color-buff,#F4EFE9);border:none;border-radius:12px;overflow:hidden;}
.wp-block-details summary{list-style:none;padding:18px 22px 0px 22px;cursor:pointer;font-family:'Flink',system-ui,Arial,sans-serif;font-weight:800;font-size:19px;color:var(--ds-color-navy,#23375A);display:flex;align-items:center;justify-content:space-between;gap:16px;}
.wp-block-details summary::-webkit-details-marker{display:none;}
.wp-block-details summary::after{content:"";flex:none;width:12px;height:12px;border-right:2px solid var(--ds-color-mulberry,#835263);border-bottom:2px solid var(--ds-color-mulberry,#835263);transform:rotate(45deg);transition:transform .2s ease;}
.wp-block-details[open] summary::after{transform:rotate(-135deg);}
.wp-block-details>:not(summary){padding:0 22px 20px;}

/* media & text */
.pb-media-text .wp-block-media-text__media img{border-radius:15px;}
.pb-media-text h3{margin-top:0;}

/* ---- Block styles registered in inc/block-styles.php (from snippet 33) ---- */
/* ---- Separators -------------------------------------------------------
   hr. prefix is deliberate: kept from the Blocksy era so nothing else can clip the leaf. */
hr.wp-block-separator.is-style-pb-soft,
hr.wp-block-separator.is-style-pb-leaf,
hr.wp-block-separator.is-style-pb-dawn{border:0;opacity:1;max-width:none;width:100%;background-color:transparent;}

hr.wp-block-separator.is-style-pb-soft{height:1px;background:linear-gradient(90deg,transparent,rgba(35,55,90,.22) 22%,rgba(35,55,90,.22) 78%,transparent);margin-block:clamp(2.25rem,4vw,3.5rem);}

hr.wp-block-separator.is-style-pb-leaf{position:relative;height:30px;min-height:30px;background-image:url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20223%20328'%3E%3Cpath%20d='M806.618,789.42L801.112,771.412L783.105,776.918C741.055,789.774%20717.388,834.284%20730.244,876.335L735.75,894.341L753.757,888.836C795.807,875.98%20819.473,831.47%20806.618,789.42'%20transform='matrix(2.66667,0,0,2.66667,-1937.98,-2057.1)'%20fill='%2364DCD2'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:center;background-size:auto 24px;margin-block:clamp(2.5rem,5vw,4rem);}
hr.wp-block-separator.is-style-pb-leaf::before,
hr.wp-block-separator.is-style-pb-leaf::after{content:"";position:absolute;top:50%;width:calc(50% - 32px);height:1px;}
hr.wp-block-separator.is-style-pb-leaf::before{left:0;background:linear-gradient(90deg,transparent,rgba(35,55,90,.22));}
hr.wp-block-separator.is-style-pb-leaf::after{right:0;background:linear-gradient(270deg,transparent,rgba(35,55,90,.22));}

hr.wp-block-separator.is-style-pb-dawn{height:4px;width:64px;max-width:64px;margin-inline:0;border-radius:99px;background:var(--ds-color-dawn,#FF8C00);margin-block:clamp(2rem,4vw,3rem);}

/* ---- Callout (soft) - block style alias for the existing .pb-callout ---- */
.wp-block-group.is-style-pb-callout{background:var(--ds-color-mint,#D2F0F0);border-radius:14px;padding:28px 32px;}
.wp-block-group.is-style-pb-callout > :first-child{margin-top:0;}
.wp-block-group.is-style-pb-callout > :last-child{margin-bottom:0;}

/* ---- CTA band - matches row.cta-band in the design system --------------- */
.wp-block-group.is-style-pb-cta{background:var(--ds-color-mulberry,#835263);color:#fff;border-radius:20px;padding:clamp(2rem,5vw,3.25rem);margin-block:clamp(2.5rem,5vw,3.5rem);}
.wp-block-group.is-style-pb-cta > :first-child{margin-top:0;}
.wp-block-group.is-style-pb-cta > :last-child{margin-bottom:0;}
.wp-block-group.is-style-pb-cta :is(h2,h3,h4){color:#fff;}
.wp-block-group.is-style-pb-cta :is(h2,h3,h4) strong{color:var(--ds-color-buttercup-deep,#FFDC50);}
.wp-block-group.is-style-pb-cta p{color:rgba(255,255,255,.85);}
.wp-block-group.is-style-pb-cta a:not(.wp-block-button__link){color:#fff;}
.wp-block-group.is-style-pb-cta .wp-block-button:not(.is-style-outline) > .wp-block-button__link{background-color:var(--ds-color-buttercup-deep,#FFDC50);color:var(--ds-color-mulberry,#835263);border-color:transparent;}
.wp-block-group.is-style-pb-cta .wp-block-button:not(.is-style-outline) > .wp-block-button__link:hover,
.wp-block-group.is-style-pb-cta .wp-block-button:not(.is-style-outline) > .wp-block-button__link:focus{background-color:var(--ds-color-buttercup-hover,#FFD025);color:var(--ds-color-mulberry,#835263);}
.wp-block-group.is-style-pb-cta .wp-block-button.is-style-outline > .wp-block-button__link{background-color:transparent;color:#fff;border:2px solid rgba(255,255,255,.5);box-shadow:none;}
.wp-block-group.is-style-pb-cta .wp-block-button.is-style-outline > .wp-block-button__link:hover,
.wp-block-group.is-style-pb-cta .wp-block-button.is-style-outline > .wp-block-button__link:focus{background-color:#fff;color:var(--ds-color-navy,#23375A);border-color:#fff;}

/* ---- Core buttons → design-system pill (Blocksy default was teal, radius 100px) ---- */
.wp-block-button__link,
.wp-element-button{display:inline-flex;align-items:center;justify-content:center;gap:10px;font-family:'Flink',system-ui,Arial,sans-serif;font-weight:800;font-size:16px;line-height:1;padding:14px 26px;border-radius:50px;border:2px solid transparent;background:var(--ds-color-teal,#1E6C82);color:#fff;text-decoration:none;cursor:pointer;transition:transform .15s ease,background .15s ease,color .15s ease,border-color .15s ease;}
.wp-block-button__link:hover,.wp-block-button__link:focus{background:var(--ds-color-teal-hover,#175566);color:#fff;transform:translateY(-1px);}
.wp-block-button.is-style-outline>.wp-block-button__link{background:transparent;color:var(--ds-color-teal,#1E6C82);border-color:var(--ds-color-teal,#1E6C82);}
.wp-block-button.is-style-outline>.wp-block-button__link:hover,.wp-block-button.is-style-outline>.wp-block-button__link:focus{background:var(--ds-color-teal,#1E6C82);color:#fff;}
.wp-block-buttons{display:flex;flex-wrap:wrap;gap:12px;}
.wp-block-buttons.is-content-justification-center{justify-content:center;}
/* the DS gives content links an underline + weight; buttons opt out.
   (.fl-ds-page prefix: in Mode A the runtime emits every DS rule with a
   .fl-ds-page-scoped variant, so theme overrides need the same specificity.) */
.fl-ds-page .inner-content a.wp-block-button__link{border-bottom:2px solid transparent;font-weight:800;}
.fl-ds-page .inner-content .wp-block-button:not(.is-style-outline) a.wp-block-button__link{color:#fff;}
.fl-ds-page .inner-content .wp-block-button.is-style-outline a.wp-block-button__link{color:var(--ds-color-teal,#1E6C82);border-bottom-color:var(--ds-color-teal,#1E6C82);}
.fl-ds-page .inner-content .wp-block-button.is-style-outline a.wp-block-button__link:hover{color:#fff;}
.fl-ds-page .inner-content .wp-block-file__button{border-bottom:2px solid transparent;color:#fff;}

/* ---- Images, columns, media-text, alignment ---- */
.wp-block-image img{border-radius:14px;height:auto;}
.wp-block-image.aligncenter{margin-left:auto;margin-right:auto;}
.wp-block-image .aligncenter{margin-left:auto;margin-right:auto;}
.has-text-align-center{text-align:center;}
.wp-block-columns{display:flex;gap:32px;}
.wp-block-columns.is-not-stacked-on-mobile{flex-wrap:nowrap;}
@media (max-width:781px){.wp-block-columns:not(.is-not-stacked-on-mobile){flex-direction:column;}}
.wp-block-column{flex:1 1 0;min-width:0;}
.wp-block-media-text{display:grid;grid-template-columns:1fr 1fr;gap:32px;align-items:center;}
.wp-block-media-text.has-media-on-the-right .wp-block-media-text__media{order:2;}
@media (max-width:600px){.wp-block-media-text.is-stacked-on-mobile{grid-template-columns:1fr;}.wp-block-media-text.has-media-on-the-right.is-stacked-on-mobile .wp-block-media-text__media{order:0;}}
.wp-block-media-text__media img{width:100%;height:auto;border-radius:15px;}
.wp-block-preformatted{white-space:pre-wrap;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:14px;background:var(--ds-color-buff,#F4EFE9);border-radius:10px;padding:16px 20px;}
.wp-block-file{margin-bottom:12px;}
.wp-block-file .wp-block-file__button{font-size:14px;padding:10px 18px;}

/* ---- The DS hides list bullets globally (ul{list-style:none}) and re-adds them inside
   .inner-content; make sure block lists outside that wrapper still read as lists ---- */
.fl-ds-page ul.wp-block-list:not(.inner-content ul){list-style:disc;padding-left:1.4em;}
.fl-ds-page ol.wp-block-list:not(.inner-content ol){list-style:decimal;padding-left:1.4em;}

/* ---- WordPress core block spacing inside the inner page ---- */
.inner-content .wp-block-group>*+*{margin-top:18px;}
.inner-content .wp-block-details{margin-top:12px;}
.inner-content .wp-block-details+.wp-block-details{margin-top:8px;}
.inner-content hr.wp-block-separator{border:0;}
.inner-content figure.wp-block-image{margin-top:32px;margin-bottom:32px;}

/* ===========================================================================
 * Block-editor faults found in the 6 September review of the eleven inner
 * pages. All eleven carried all of them, so these are contract bugs rather
 * than page bugs, and nobody's content is touched.
 * ======================================================================== */

/* 1. Headings do not collapse their top margin, because the design system
 *    sets them display:inline-block for the underline treatment. So a
 *    heading's 48px top margin is ADDED to whatever sits above it instead of
 *    overlapping it. After a separator that gave 57px above the rule and
 *    105px below. Surgical fix: the inline-block itself is the design
 *    system's choice and carries the underline on every designed page, so it
 *    stays. Only the doubled gap goes. Two classes and two elements, to beat
 *    the runtime's own .fl-ds-page .inner-content h2. */
.fl-ds-page .inner-content hr.wp-block-separator + :is(h2,h3,h4){margin-top:0;}

/* 2. Same cause inside the CTA band. The band already zeroes the top margin
 *    of its first child, but the heading is not its child: the block editor
 *    wraps everything in .wp-block-group__inner-container, so the rule never
 *    matched and the band read 100px at the top against 52px at the bottom. */
.fl-ds-page .inner-content .wp-block-group.is-style-pb-cta > * > :first-child{margin-top:0;}
.fl-ds-page .inner-content .wp-block-group.is-style-pb-cta > * > :last-child{margin-bottom:0;}

/* 3. The band's buttons sat hard against the paragraph above: the paragraph
 *    ends with margin-bottom 0 and the buttons wrapper starts with margin-top
 *    0, so there was no gap at all. */
.fl-ds-page .inner-content .wp-block-group.is-style-pb-cta .wp-block-buttons{margin-top:24px;}

/* 4. WordPress core gives is-style-outline its own padding, calc(.667em + 2px),
 *    which the contract never overrode. Filled buttons took our 14px and
 *    outline ones took core's 10.7px, so a secondary button stood 41px tall
 *    against a primary's 48px. */
body .wp-block-button.is-style-outline > .wp-block-button__link{padding:14px 26px;}

/* 5. The CTA band's own button colours are correct further up this file, and
 *    were being trampled by the .inner-content prose-link rules, which carry
 *    one more element and therefore win. The result on every one of the
 *    eleven pages: a buttercup button with white text at 1.35:1, and an
 *    outline button with teal text on mulberry at 1.05:1, its border white on
 *    three sides and teal on the fourth. Restated here with the band in the
 *    selector so the band wins inside the band, and nowhere else. */
.fl-ds-page .inner-content .is-style-pb-cta .wp-block-button:not(.is-style-outline) a.wp-block-button__link{
	color:var(--ds-color-mulberry,#835263);
}
.fl-ds-page .inner-content .is-style-pb-cta .wp-block-button.is-style-outline a.wp-block-button__link{
	color:#fff;border-color:rgba(255,255,255,.5);
}
.fl-ds-page .inner-content .is-style-pb-cta .wp-block-button.is-style-outline a.wp-block-button__link:hover,
.fl-ds-page .inner-content .is-style-pb-cta .wp-block-button.is-style-outline a.wp-block-button__link:focus{
	background-color:#fff;color:var(--ds-color-navy,#23375A);border-color:#fff;
}

/* ---------------------------------------------------------------------------
 * FAQ accordions: one look, not three.
 * The site had three. The design system's own .row-faq details.faq-item is
 * white with a light outline, turning mulberry when open. The service template
 * used a buff block, and the block editor's Details used a buff block whose
 * summary had 0 bottom padding, so the question sat hard on the card's edge.
 * Paul's call on 7 September: outline, not block colour. Both are brought onto
 * the design system's own treatment here.
 * ------------------------------------------------------------------------ */
.wp-block-details{
	background:var(--ds-color-white,#FEFEFE);
	border:1px solid rgba(35,55,90,.10);
	border-radius:12px;
	overflow:hidden;
	transition:border-color .15s ease,box-shadow .15s ease;
}
.wp-block-details[open]{
	border-color:var(--ds-color-mulberry,#835263);
	box-shadow:0 6px 20px rgba(35,55,90,.06);
}
.wp-block-details summary{padding:18px 22px;}
.wp-block-details[open] summary{padding-bottom:12px;}

/* The callout's button sat straight against the paragraph above it, the same
   missing gap the CTA band had. */
.fl-ds-page .inner-content .wp-block-group.is-style-pb-callout .wp-block-buttons{margin-top:20px;}

/* Quote attributions go navy. Harrison's ruling, 14 September 2026. The design
   system credits its quotes in mulberry; only the credit changes, the big
   decorative quote marks stay as they are. One more class than the base rule,
   because the runtime emits every rule three times. */
body .pull-quote .cite,
body.fl-ds-page .pull-quote .cite,
body .article-quote cite,
body.fl-ds-page .article-quote cite,
body .svc-quote cite,
body.fl-ds-page .svc-quote cite{color:var(--ds-color-navy,#23375A);}


/* ---- Christmas appeal (/appeal/, page 1738), 21 Oct 2026 ----------------
   Gift tiers reuse the Get involved impact cards (.tile-card.impact-card). The
   grid and the amount styling live in that Beaver Builder block's own node CSS,
   so they are restated here for the block-editor page. Story rows are core
   columns: the design system's flow spacing only reaches direct children of
   .inner-content, so it is repeated inside the row and the CTA band. */
.fl-ds-page .inner-content .pb-appeal-tiers{display:grid;grid-template-columns:1fr;gap:22px;margin-inline:auto;}
@media (min-width:600px){.fl-ds-page .inner-content .pb-appeal-tiers{grid-template-columns:repeat(2,1fr);}}
@media (min-width:1000px){.fl-ds-page .inner-content .pb-appeal-tiers{grid-template-columns:repeat(4,1fr);}}
.fl-ds-page .inner-content .pb-appeal-tiers .impact-card h3.amount{font-family:'Mackinac',serif;font-weight:500;font-size:54px;line-height:1;letter-spacing:-0.01em;color:var(--ds-color-navy,#23375A);margin:0 0 12px;}
.fl-ds-page .inner-content .pb-appeal-story .wp-block-column > * + *{margin-top:24px;}
.fl-ds-page .inner-content .pb-appeal-story{gap:clamp(1.5rem,4vw,3rem);}
.fl-ds-page .inner-content .wp-block-group.is-style-pb-cta > .wp-block-group__inner-container > p + p{margin-top:1em;}
/* Text first in the markup so phones read heading, story, then photo; the photo moves left from 782px, where core columns sit side by side. */
@media (min-width:782px){.fl-ds-page .inner-content .pb-appeal-story--reverse{flex-direction:row-reverse;}}

/* Filled buttons inside a news story. The design system paints every link in
   .article-body teal at (0,3,1), which made a solid teal button's label teal on
   teal. Found on the Christmas appeal post, 21 Oct 2026. */
.fl-ds-page .article-body .wp-block-button:not(.is-style-outline) > .wp-block-button__link{color:#fff;}