.home .ast-builder-menu-1 .menu-item > .menu-link { color: var(--ast-global-color-5);}
body:not(.home) .ast-builder-menu-1 .menu-item > .menu-link { color: var(--ast-global-color-2);}
.home .ast-header-button-1 .ast-custom-button { color: var(--ast-global-color-4); border-color: var(--ast-global-color-5); background: transparent;}
body:not(.home) .ast-header-button-1 .ast-custom-button { color: var(--ast-global-color-5); background: var(--ast-global-color-0); border-color: var(--ast-global-color-0);}
.home .ast-header-social-1-wrap .ast-social-color-type-custom svg { fill: var(--ast-global-color-5);}
body:not(.home) .ast-header-social-1-wrap .ast-social-color-type-custom svg { fill: var(--ast-global-color-2);}
:root { --ast-global-color-0: #2C1A3C;}
.wp-container-spectra-container-is-layout-0f724195 .wp-block-button .wp-block-button__link { background-color: #FFFFFF; color: #2C1A3C;}

/* Mauve trim rollout - test 2 - 2px #90486C border on plum CTA buttons, header button, sitewide */
.wp-block-button .wp-block-button__link:not(.latepoint-book-button-rna5y4tlq-1759833625100) { border: 2px solid #90486C; }
body:not(.home) .ast-header-button-1 .ast-custom-button { border-color: #90486C; border-width: 2px; }
.home .ast-header-button-1 .ast-custom-button { border-color: #90486C; border-width: 2px; }

/* Match Latest Posts heading to New in Resources heading */
.entry-content .wpnbha .article-section-title { font-size: 38px; font-weight: 600; line-height: 49.4px; font-family: 'DM Serif Display', serif; }

/* Fix: submenu dropdown links (Finance/Governance/Marketing/Operations under No-Nonsense Nonprofits) were inheriting white text from the transparent-header home rule above, making them invisible against the white dropdown background */
.home .ast-builder-menu-1 .sub-menu .menu-link { color: var(--ast-global-color-2) !important; }
.home .ast-builder-menu-1 .sub-menu .menu-link:hover { color: var(--ast-global-color-1) !important; }

/* Resources page  compact two-column product cards (item 7) */
.resource-card { margin-bottom: 30px; }
.resource-card .resource-card-image img { width: 100%; height: 220px; object-fit: cover; border-radius: 6px; }
.resource-card .resource-card-title { margin-top: 14px; margin-bottom: 6px; }
.resource-card .resource-card-desc { color: var(--ast-global-color-3); margin-bottom: 14px; }


/* Round 4 — item 3: Popular Articles / Jetpack Top Posts was forced to 2 columns
   by the rule below (added in Round 3), which is what caused the editor (3 per
   row, no custom CSS loaded there) vs live (2 per row, custom CSS applied)
   mismatch. Restoring genuine 3-per-row on live, and capping the thumbnail
   size — this is meant to be a compact list, not a photo gallery. */
.wp-block-jetpack-top-posts.is-grid-layout.ast-top-posts-2col .jetpack-top-posts-wrapper {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 28px 32px !important;
}
.ast-top-posts-2col .jetpack-top-posts-item { margin: 0; grid-column: auto !important; }
.ast-top-posts-2col .jetpack-top-posts-thumbnail-link,
.ast-top-posts-2col .jetpack-top-posts-thumbnail-link img {
  max-height: 140px !important;
  width: 100% !important;
  object-fit: cover !important;
}
@media (max-width: 800px) {
  .wp-block-jetpack-top-posts.is-grid-layout.ast-top-posts-2col .jetpack-top-posts-wrapper { grid-template-columns: repeat(2, 1fr) !important; }
}
@media (max-width: 500px) {
  .wp-block-jetpack-top-posts.is-grid-layout.ast-top-posts-2col .jetpack-top-posts-wrapper { grid-template-columns: 1fr !important; }
}


/* Round 3 — item 1: nav wrapping fix follow-up — prevent "Work With Me" button text wrapping
   after moving Primary Menu + Search into the header's center zone (see below) */
.ast-header-button-1 .ast-custom-button,
.site-header-primary-section-right .ast-custom-button {
  white-space: nowrap;
}


/* Round 4 — item 1: header fixes */
/* 1a. Facebook/LinkedIn icons were stacking vertically — wrap collapses to ~30px (one icon) under block display, wrapping the second icon to a new line. Force horizontal flex layout. */
.ast-header-social-1-wrap .header-social-inner-wrap,
.ast-header-social-1-wrap {
  display: flex !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  width: auto !important;
  gap: 12px;
}

/* 1b. Search icon was low-contrast (dark grey) against the homepage hero photo — apply the same .home / body:not(.home) treatment already used for nav text, header button and social icons. */
.home .ast-search-menu-icon svg { fill: var(--ast-global-color-5); }
body:not(.home) .ast-search-menu-icon svg { fill: var(--ast-global-color-2); }

/* 1c. Shrink "Work With Me" button so the header row fits more comfortably */
.ast-header-button-1 .ast-custom-button {
  padding-left: 24px;
  padding-right: 24px;
}


/* Round 4 — item 2: New in Resources separator lines were centering within the
   full-width column (not the narrower image+text row above them), landing far
   right. Left-align them to match the row's left edge instead. */
.new-in-resources-row + hr.wp-block-separator {
  margin-left: 0 !important;
  margin-right: auto !important;
}


/* Round 4 — item 6: Category/tag archive pages — was a single-column "doomscroll"
   layout (huge featured image, big excerpt, one post per row). Converted to a
   compact 3-column grid: shared archive template, so this fixes every category
   and tag archive at once. Sizing kept readable (not tiny) for a dyslexic-friendly
   audience — clear title, short clamped excerpt, capped thumbnail height. */
body.archive .ast-row {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 40px 28px !important;
}
body.archive .ast-row > .ast-article-post {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  float: none !important;
}
/* Round 6 — item 1: Archive thumbnails were a fixed-height 190px landscape
   crop (~1.9:1) — inconsistent with the square treatment used on the
   Resources page and homepage "New in Resources". Squared up: 1:1 aspect
   ratio on the container, image covers it via object-fit so no distortion
   regardless of the source image's own proportions. */
body.archive .ast-article-post .post-thumb-img-content {
  aspect-ratio: 1 / 1;
  height: auto;
  max-height: none;
  overflow: hidden;
  display: block;
}
body.archive .ast-article-post .post-thumb-img-content img {
  height: 100% !important;
  width: 100% !important;
  object-fit: cover !important;
}
body.archive .ast-article-post .entry-title {
  font-size: 21px !important;
  line-height: 1.35 !important;
  margin: 16px 0 6px !important;
}
body.archive .ast-article-post .entry-meta {
  font-size: 13px !important;
}
body.archive .ast-article-post .ast-excerpt-container {
  max-height: 76px !important;
  overflow: hidden !important;
  position: relative;
}
body.archive .ast-article-post .ast-excerpt-container p {
  font-size: 15.5px !important;
  line-height: 1.55 !important;
  margin: 0 0 6px !important;
}
body.archive .ast-article-post .ast-read-more-container {
  font-size: 14px !important;
  margin-top: 8px !important;
}
@media (max-width: 921px) {
  body.archive .ast-row { grid-template-columns: repeat(2, 1fr) !important; }
}
@media (max-width: 600px) {
  body.archive .ast-row { grid-template-columns: 1fr !important; }
}

/* Round 4 — item 7: Resources page product grid, 2 columns -> 3 columns.
   The page is built from several separate Gutenberg "Columns" blocks per
   category (not one repeating grid), so instead of restructuring blocks we
   flatten the Columns/Column wrappers with display:contents and let the
   page's entry-content act as one CSS Grid: headings/paragraphs/separators
   span the full row (forcing a line break between categories), and each
   resource-card sits in a single cell, 3 per row. Images shrunk to suit
   (rectangular covers, not square). */
body.page-id-3055 .entry-content.clear {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  column-gap: 28px !important;
  row-gap: 6px !important;
  align-items: start !important;
}
body.page-id-3055 .entry-content.clear .wp-block-columns,
body.page-id-3055 .entry-content.clear .wp-block-column {
  display: contents !important;
}
body.page-id-3055 .entry-content.clear > * {
  grid-column: 1 / -1;
}
body.page-id-3055 .entry-content.clear .resource-card {
  grid-column: span 1 !important;
  margin-bottom: 24px !important;
}
body.page-id-3055 .entry-content.clear .resource-card .resource-card-image {
  background: #f4f1ec;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 170px;
  border-radius: 6px;
  overflow: hidden;
}
body.page-id-3055 .entry-content.clear .resource-card .resource-card-image img {
  height: auto !important;
  width: auto !important;
  max-height: 170px !important;
  max-width: 100% !important;
  object-fit: contain !important;
}
body.page-id-3055 .entry-content.clear h2.wp-block-heading {
  margin-top: 20px;
}
@media (max-width: 900px) {
  body.page-id-3055 .entry-content.clear { grid-template-columns: repeat(2, 1fr) !important; }
}
@media (max-width: 600px) {
  body.page-id-3055 .entry-content.clear { grid-template-columns: 1fr !important; }
}

/* Round 4 — item 8: Contact page — "Get in Touch" heading/intro were flush to
   the page edge (no wrapping padded container like the Book a Call / Send a
   Message row below them, which has its own 48px block padding) — indent to
   match. Also grow the Google Calendar embed so its booking widget fits
   without an internal scrollbar; the "Leave a Message" column already
   stretches to match via the row's flex layout, so no extra rule needed
   there. */
body.page-id-968 .entry-content.clear > h2.wp-block-heading:first-child,
body.page-id-968 .entry-content.clear > h2.wp-block-heading:first-child + p.wp-block-paragraph {
  padding-left: 48px;
  padding-right: 48px;
}
body.page-id-968 .entry-content.clear iframe {
  height: 780px !important;
}
@media (max-width: 600px) {
  body.page-id-968 .entry-content.clear > h2.wp-block-heading:first-child,
  body.page-id-968 .entry-content.clear > h2.wp-block-heading:first-child + p.wp-block-paragraph {
    padding-left: 20px;
    padding-right: 20px;
  }
}

/* Footer centring fix — constrain the primary footer builder row (Quick Links, Find the free guides, brand blurb) to the site's standard content width and centre it, so it stops sitting flush left with a gap on wide screens */
.site-footer .site-primary-footer-wrap {
  max-width: 1240px;
  margin-left: auto;
  margin-right: auto;
}

/* Category archive card excerpts — clamp to a fixed line count so row heights stay even across all category archives regardless of excerpt length */
.ast-excerpt-container p {
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* Round 5 — item 1: Resources-new (draft) page product grid, mirrors the
   page-id-3055 grid above so the WooCommerce draft preview page uses the
   same compact 3-per-row card layout as the live Resources page. */
body.page-id-3295 .entry-content.clear {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  column-gap: 28px !important;
  row-gap: 6px !important;
  align-items: start !important;
}
body.page-id-3295 .entry-content.clear .wp-block-columns,
body.page-id-3295 .entry-content.clear .wp-block-column {
  display: contents !important;
}
body.page-id-3295 .entry-content.clear > * {
  grid-column: 1 / -1;
}
body.page-id-3295 .entry-content.clear .resource-card {
  grid-column: span 1 !important;
  margin-bottom: 24px !important;
}
body.page-id-3295 .entry-content.clear .resource-card .resource-card-image {
  background: #f4f1ec;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 170px;
  border-radius: 6px;
  overflow: hidden;
}
body.page-id-3295 .entry-content.clear .resource-card .resource-card-image img {
  height: auto !important;
  width: auto !important;
  max-height: 170px !important;
  max-width: 100% !important;
  object-fit: contain !important;
}
body.page-id-3295 .entry-content.clear h2.wp-block-heading {
  margin-top: 20px;
}
@media (max-width: 900px) {
  body.page-id-3295 .entry-content.clear { grid-template-columns: repeat(2, 1fr) !important; }
}
@media (max-width: 600px) {
  body.page-id-3295 .entry-content.clear { grid-template-columns: 1fr !important; }
}

/* Footer legal links separator - added because raw text separator was being stripped */
.ast-footer-html-1 p a:not(:last-of-type)::after {
	    content: " | ";
	    opacity: 0.7;
}

/* Stack right/left-aligned images full-width on mobile so text can't get squeezed into a 1-character column */
@media (max-width: 600px) {
  .entry-content .alignright,
  .entry-content .alignleft {
    float: none !important;
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
  .entry-content .alignright img,
  .entry-content .alignleft img {
    width: 100% !important;
    height: auto !important;
  }
}

/* Cap blog post images now that the sidebar removal widened the content column - images were rendering at full natural size (e.g. 1024px) */
.single-post .post-thumb-img-content img {
  max-height: 450px;
  width: 100%;
  object-fit: cover;
}

.single-post .entry-content img {
  max-width: 700px;
  height: auto;
  display: block;
  margin-left: auto;
  margin-right: auto;
}

@media (min-width: 601px) {
  .single-post .entry-content .alignright,
  .single-post .entry-content .alignleft {
    max-width: 350px !important;
  }
  .single-post .entry-content .alignright img,
  .single-post .entry-content .alignleft img {
    width: 100% !important;
    max-width: 350px !important;
    margin-left: 0;
    margin-right: 0;
  }
}

/* Align the below-footer (copyright) row with the same boxed width as the primary footer row above it, since the Customizer's row Width toggle isn't taking effect */
.site-below-footer-wrap .ast-builder-grid-row-container-inner {
  max-width: 1240px;
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  box-sizing: border-box;
}

/* On mobile (stacked layout), force both the contact-info column and the legal text to use the same left padding so they align flush */
@media (max-width: 921px) {
  .site-footer-primary-section-3,
  .site-footer-below-section-1,
  .site-footer-below-section-2 {
    padding-left: 0 !important;
    margin-left: 0 !important;
    width: 100% !important;
    text-align: left !important;
  }
}