/* Left-align banner H1 on Vault pages (Blogs, Fitness, Fatherhood, Work) plus About Me and Let's Connect, in line with the content column. Not blog posts. */
body:is(.page-id-2081, .page-id-2082, .page-id-2083, .page-id-2084, .page-id-1859, .page-id-1860) .wp-block-cover__inner-container > .wp-block-group {
	align-items: stretch;
}
body:is(.page-id-2081, .page-id-2082, .page-id-2083, .page-id-2084, .page-id-1859, .page-id-1860) .wp-block-cover__inner-container .is-vertical:has(> .wp-block-post-title) {
	align-items: flex-start;
}
body:is(.page-id-2081, .page-id-2082, .page-id-2083, .page-id-2084, .page-id-1859, .page-id-1860) .wp-block-cover__inner-container .wp-block-post-title {
	text-align: left;
	width: 100%;
}

/* Italicize in-page H2s on Vault pages only */
body:is(.page-id-2081, .page-id-2082, .page-id-2083, .page-id-2084) .wp-block-post-content h2 {
	font-style: italic;
}

/* Site title matches the site-wide Poppins (theme default was Source Sans 3) */
.wp-block-site-title,
.wp-block-site-title a {
	font-family: var(--wp--preset--font-family--poppins);
	font-weight: 600;
}
/* Let's Connect page: content sits flush under the green banner (other pages get spacing). */
.page-id-1860 .bjl-page-main {
  margin-top: 0 !important;
}

/* About Me page: banner title lines up with the 700px body text column. */
.page-id-1859 header h1.wp-block-post-title {
  max-width: 700px;
}

/* Mobile: shorter green title banner. Inline styles set the desktop height, so !important is needed. */
@media (max-width: 600px) {
  header.wp-block-template-part .wp-block-group.alignfull.has-background {
    min-height: 150px !important;
    padding-top: 1.5rem !important;
    padding-bottom: 1.5rem !important;
  }
}
/* Homepage: remove the white gap between the site header and the green hero banner. */
.wp-site-blocks > .wp-block-cover.aligncenter {
	margin-block-start: 0;
}
/* Let's Connect page: banner stays full width. Content is a 960px grid that lines up with the banner title.
   Row 1: profile. Row 2: Listen + Read side by side. Row 3: Instagram. Row 4: blog CTA. Stacks to one column on small screens. */
.page-id-1860 .wp-block-post-content {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 1.5rem;
	max-width: min(960px, calc(100% - 2 * var(--wp--preset--spacing--50)));
	margin: 1.5rem auto;
	padding-left: 0;
	padding-right: 0;
}
.page-id-1860 .wp-block-post-content > .wp-block-group.alignfull {
	max-width: none;
	width: auto;
	margin: 0;
	border-radius: 12px;
	grid-column: 1 / -1;
}
.page-id-1860 .wp-block-post-content > .wp-block-group.alignfull:nth-child(2),
.page-id-1860 .wp-block-post-content > .wp-block-group.alignfull:nth-child(3) {
	grid-column: auto;
}
.page-id-1860 .wp-block-post-content > p:empty {
	display: none;
}
@media (max-width: 781px) {
	.page-id-1860 .wp-block-post-content {
		grid-template-columns: 1fr;
	}
}
/* Let's Connect page: left column = Listen then Instagram; right column = Read (spans both rows). */
.page-id-1860 .wp-block-post-content > .wp-block-group.alignfull:nth-child(1) {
	grid-column: 1 / -1;
	grid-row: 1;
}
.page-id-1860 .wp-block-post-content > .wp-block-group.alignfull:nth-child(2) {
	grid-column: 1;
	grid-row: 2;
}
.page-id-1860 .wp-block-post-content > .wp-block-group.alignfull:nth-child(3) {
	grid-column: 2;
	grid-row: 2 / span 2;
}
.page-id-1860 .wp-block-post-content > .wp-block-group.alignfull:nth-child(4) {
	grid-column: 1;
	grid-row: 3;
}
.page-id-1860 .wp-block-post-content > .wp-block-group.alignfull:nth-child(5) {
	grid-column: 1 / -1;
	grid-row: 4;
}
@media (max-width: 781px) {
	.page-id-1860 .wp-block-post-content > .wp-block-group.alignfull:nth-child(n) {
		grid-column: 1;
		grid-row: auto;
	}
}
/* Let's Connect page: taller Spotify embed (16:9 instead of the wide 21:9 strip). */
.page-id-1860 .wp-embed-aspect-21-9 .wp-block-embed__wrapper::before {
	padding-top: 56.25%;
}

/* ===== Mobile nav overlay: white background, green accents, social row ===== */

/* Social icons live in the menu markup but only show inside the open mobile overlay. */
.wp-block-navigation .bjl-nav-social {
	display: none;
}

/* Overlay shell: white, thin green bar across the top. */
.wp-block-navigation__responsive-container.is-menu-open {
	background-color: #ffffff;
	border-top: 6px solid #3f5b44;
}
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content {
	padding: 4rem 2rem 2.5rem;
	align-items: flex-start;
	justify-content: center;
	gap: 0;
}
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container {
	align-items: flex-start;
	gap: 0.25rem;
	width: 100%;
}

/* Main links: big, Poppins, green, with a hairline divider between each. */
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item {
	width: 100%;
	flex-wrap: wrap;
	border-bottom: 1px solid #d8dcd0;
}
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content {
	font-family: var(--wp--preset--font-family--poppins);
	font-size: 1.75rem;
	font-weight: 600;
	line-height: 1.2;
	color: #3f5b44;
	padding: 0.9rem 0;
}
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content:hover,
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content:focus-visible {
	color: #1e2a22;
}

/* Current page gets a green marker. */
.wp-block-navigation__responsive-container.is-menu-open .current-menu-item > .wp-block-navigation-item__content {
	box-shadow: inset 4px 0 0 #3f5b44;
	padding-left: 1rem;
}

/* Vault submenu: smaller, indented, green rule on the left. */
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container {
	padding: 0 0 0.75rem 1rem;
	margin-left: 0.25rem;
	border-left: 2px solid #3f5b44;
	width: 100%;
}
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item {
	border-bottom: 0;
}
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
	font-size: 1.125rem;
	font-weight: 500;
	color: #5b6058;
	padding: 0.45rem 0;
}

/* Social row. */
.wp-block-navigation__responsive-container.is-menu-open .bjl-nav-social {
	display: flex;
	flex-wrap: wrap;
	gap: 0.75rem;
	width: 100%;
	margin-top: 2rem;
	padding-top: 1.25rem;
}
.wp-block-navigation__responsive-container.is-menu-open .bjl-nav-social::before {
	content: "Find me on";
	flex-basis: 100%;
	font-family: var(--wp--preset--font-family--poppins);
	font-size: 0.75rem;
	font-weight: 500;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: #5b6058;
}
.wp-block-navigation__responsive-container.is-menu-open .bjl-nav-social .wp-social-link {
	background-color: #3f5b44 !important;
	color: #ffffff !important;
}

/* Close button: green, easy to tap. */
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-close {
	color: #3f5b44;
	top: 1.25rem;
	right: 1.25rem;
}
.wp-block-navigation__responsive-container-close svg {
	width: 32px;
	height: 32px;
}

/* Gentle staggered fade-in when the menu opens. */
@keyframes bjl-nav-rise {
	from { opacity: 0; transform: translateY(10px); }
	to   { opacity: 1; transform: translateY(0); }
}
@media (prefers-reduced-motion: no-preference) {
	.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > * {
		opacity: 0;
		animation: bjl-nav-rise 0.4s ease forwards;
	}
	.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > :nth-child(1) { animation-delay: 0.05s; }
	.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > :nth-child(2) { animation-delay: 0.12s; }
	.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > :nth-child(3) { animation-delay: 0.19s; }
	.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > :nth-child(4) { animation-delay: 0.26s; }
}


/* ===== Mobile nav overlay: compact, left-aligned pass (overrides the block above) ===== */
.wp-block-navigation__responsive-container.is-menu-open {
	--navigation-layout-justification-setting: flex-start;
	--navigation-layout-justify: flex-start;
	--navigation-layout-align: flex-start;
	text-align: left;
}
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content {
	padding: 3.75rem 1.5rem 1.5rem;
	justify-content: flex-start;
	align-items: flex-start;
}
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container {
	align-items: flex-start;
	justify-content: flex-start;
	gap: 0;
	text-align: left;
}
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item {
	align-items: flex-start;
	justify-content: flex-start;
	text-align: left;
}
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content {
	font-size: 1.5rem;
	padding: 0.6rem 0;
	text-align: left;
}
.wp-block-navigation__responsive-container.is-menu-open .current-menu-item > .wp-block-navigation-item__content {
	padding-left: 0.75rem;
}

/* Vault submenu: one compact row instead of a tall stack. */
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	align-items: flex-start;
	justify-content: flex-start;
	gap: 0 1.25rem;
	padding: 0 0 0.6rem 0.75rem;
	margin: 0 0 0.25rem;
	min-width: 0;
	width: 100%;
}
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item {
	width: auto;
}
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
	font-size: 1rem;
	padding: 0.3rem 0;
}

/* Social row: left-aligned, smaller icons, no divider line under it. */
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item:has(> .bjl-nav-social) {
	border-bottom: 0;
}
.wp-block-navigation__responsive-container.is-menu-open .bjl-nav-social {
	justify-content: flex-start;
	text-align: left;
	font-size: 20px;
	gap: 0.6rem;
	margin-top: 0.75rem;
	padding-top: 0.5rem;
}


/* ===== Mobile nav: right-side drawer, right-aligned, no dividers (overrides the two blocks above) ===== */
.wp-block-navigation__responsive-container.is-menu-open {
	left: auto;
	right: 0;
	width: 72%;
	max-width: 320px;
	box-shadow: -10px 0 30px rgba(0, 0, 0, 0.18);
	--navigation-layout-justification-setting: flex-end;
	--navigation-layout-justify: flex-end;
	--navigation-layout-align: flex-end;
	text-align: right;
}
@media (prefers-reduced-motion: no-preference) {
	.wp-block-navigation__responsive-container.is-menu-open {
		animation: bjl-drawer-in 0.25s ease;
	}
}
@keyframes bjl-drawer-in {
	from { transform: translateX(100%); }
	to   { transform: translateX(0); }
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content {
	padding: 3.75rem 1.25rem 1.5rem;
	align-items: flex-end;
}
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container {
	align-items: flex-end;
	justify-content: flex-start;
	text-align: right;
}

/* No dividers. */
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item,
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item:has(> .bjl-nav-social) {
	border-bottom: 0;
	align-items: flex-end;
	justify-content: flex-end;
	text-align: right;
}
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content {
	text-align: right;
}

/* Current page marker moves to the right edge. */
.wp-block-navigation__responsive-container.is-menu-open .current-menu-item > .wp-block-navigation-item__content {
	box-shadow: inset -4px 0 0 #3f5b44;
	padding-left: 0;
	padding-right: 0.75rem;
}

/* Vault submenu: right-aligned row, green rule on the right. */
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container {
	justify-content: flex-end;
	gap: 0 1rem;
	padding: 0 0.75rem 0.5rem 0;
	border-left: 0;
	border-right: 2px solid #3f5b44;
	margin: 0 0 0.25rem;
}

/* Social row: right-aligned. */
.wp-block-navigation__responsive-container.is-menu-open .bjl-nav-social {
	justify-content: flex-end;
	text-align: right;
}


/* Vault submenu: stack vertically again, right-aligned. */
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container {
	flex-direction: column;
	flex-wrap: nowrap;
	align-items: flex-end;
	gap: 0;
}
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item {
	width: 100%;
	justify-content: flex-end;
}


/* ===== Mobile nav: floating rounded card instead of full-height rectangle ===== */
.wp-block-navigation__responsive-container.is-menu-open {
	top: 0.75rem;
	right: 0.75rem;
	bottom: auto;
	height: auto;
	max-height: calc(100dvh - 1.5rem);
	overflow-y: auto;
	border-top: 0;
	border-radius: 24px;
	box-shadow: 0 12px 40px rgba(0, 0, 0, 0.2);
}
@keyframes bjl-drawer-in {
	from { transform: translateX(calc(100% + 1rem)); opacity: 0; }
	to   { transform: translateX(0); opacity: 1; }
}


/* ===== Mobile nav: flush-right drawer, rounded on the left side only, set lower on screen ===== */
.wp-block-navigation__responsive-container.is-menu-open {
	top: 5rem;
	right: 0;
	border-radius: 24px 0 0 24px;
	max-height: calc(100dvh - 6.5rem);
	box-shadow: -10px 8px 30px rgba(0, 0, 0, 0.18);
}


/* ===== Mobile nav: underlined main links + "Nav" label top left ===== */
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > .wp-block-navigation-item > .wp-block-navigation-item__content {
	text-decoration: underline;
	text-decoration-color: #3f5b44;
	text-decoration-thickness: 2px;
	text-underline-offset: 6px;
}
.wp-block-navigation__responsive-container.is-menu-open::before {
	content: "Nav";
	position: absolute;
	top: 1.35rem;
	left: 1.5rem;
	font-family: var(--wp--preset--font-family--poppins);
	font-style: italic;
	font-weight: 200;
	font-size: 1.25rem;
	line-height: 1;
	letter-spacing: 0.02em;
	color: #3f5b44;
}


/* ===== Mobile nav: remove "Nav" label, X becomes "Close Nav", more space above first link ===== */
.wp-block-navigation__responsive-container.is-menu-open::before {
	content: none;
	display: none;
}
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-close svg {
	display: none;
}
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-close::after {
	content: "Close Nav";
	font-family: var(--wp--preset--font-family--poppins);
	font-size: 1rem;
	font-weight: 500;
	line-height: 1;
	color: #3f5b44;
}
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content {
	padding-top: 5.5rem;
}


/* Close Nav: italic, thin */
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-close::after {
	font-style: italic;
	font-weight: 200;
}


/* ===== "Here's the Gist" callout for blog posts (Group block with class bjl-gist) ===== */
.bjl-gist {
	background-color: #f5f3ee;
	border-left: 6px solid #3f5b44;
	border-radius: 0 12px 12px 0;
	padding: 1.25rem 1.5rem;
	margin-top: 1.5rem;
	margin-bottom: 2rem;
}
.bjl-gist .bjl-gist__title {
	font-family: var(--wp--preset--font-family--poppins);
	font-size: 1.25rem;
	font-weight: 700;
	line-height: 1.3;
	color: #3f5b44;
	margin: 0 0 0.6rem;
}
.bjl-gist ul {
	margin: 0;
	padding-left: 1.25rem;
}
.bjl-gist li {
	margin-bottom: 0.4rem;
	line-height: 1.6;
}
.bjl-gist li:last-child {
	margin-bottom: 0;
}


/* "Here's the Gist" callout: smaller, lighter body text; title matches homepage section headings */
.bjl-gist .bjl-gist__title {
	font-family: var(--wp--preset--font-family--poppins);
	font-size: 1rem;
	font-weight: 400;
	letter-spacing: 2px;
	text-transform: uppercase;
	margin: 0 0 0.6rem;
}
.bjl-gist li {
	font-size: 0.9rem;
	font-weight: 300;
	line-height: 1.6;
	color: #1e2a22;
}


/* ===== Post sidebar preview: categories + related posts cards (classes only used on the preview draft) ===== */
.bjl-side-card {
	background-color: #ffffff;
	border: 1px solid #dde0d8;
	border-radius: 12px;
	padding: 1rem 1.1rem;
	margin-bottom: 1rem;
}
.bjl-side-card .bjl-side-title {
	font-size: 13px;
	font-weight: 600;
	letter-spacing: 2px;
	text-transform: uppercase;
	color: #3f5b44;
	margin: 0 0 0.5rem;
}
.bjl-side-card ul,
.bjl-side-card .wp-block-post-template {
	list-style: none;
	margin: 0;
	padding: 0;
}
.bjl-side-card .wp-block-categories li {
	font-size: 14px;
	padding: 0.4rem 0;
	border-bottom: 1px solid #eceee8;
}
.bjl-side-card .wp-block-categories li:last-child {
	border-bottom: 0;
}
.bjl-side-card .wp-block-post-template > li {
	padding: 0.5rem 0;
	border-bottom: 1px solid #eceee8;
}
.bjl-side-card .wp-block-post-template > li:last-child {
	border-bottom: 0;
}
.bjl-side-card .wp-block-post-title {
	font-size: 14px;
	font-weight: 500;
	line-height: 1.35;
	margin: 0;
}
.bjl-side-card .wp-block-post-terms {
	font-size: 11px;
	color: #5b6058;
	margin: 2px 0 0;
}
@media (min-width: 782px) {
	.bjl-side-sticky {
		position: sticky;
		top: 1.5rem;
	}
}


/* ===== Post template: sidebar author card, related thumbnails, category pills ===== */
.bjl-author-card {
	gap: 0.9rem;
}
.bjl-author-card .bjl-side-title {
	margin: 0 0 2px;
}
.bjl-author-card .wp-block-post-author-name {
	font-size: 16px;
	font-weight: 600;
	color: #1e2a22;
	margin: 0;
}
.bjl-author-card .wp-block-avatar img {
	border-radius: 50%;
	display: block;
}

.bjl-side-card .wp-block-jetpack-related-posts .jp-related-posts-i2__list,
.bjl-side-card .wp-block-jetpack-related-posts .jp-related-posts-i2__row {
	display: block;
	margin: 0;
	padding: 0;
	list-style: none;
}
.bjl-side-card .jp-related-posts-i2__post {
	margin: 0 0 1rem;
	padding: 0;
	list-style: none;
}
.bjl-side-card .jp-related-posts-i2__post:last-child {
	margin-bottom: 0;
}
.bjl-side-card .jp-related-posts-i2__post-img {
	display: block;
	width: 100%;
	aspect-ratio: 16 / 9;
	object-fit: cover;
	border-radius: 8px;
	margin: 0 0 6px;
}
.bjl-side-card .jp-related-posts-i2__post-link {
	font-size: 14px;
	font-weight: 500;
	line-height: 1.35;
	color: #1e2a22;
	text-decoration: none;
}

.bjl-terms-row {
	font-size: 13px;
	color: #5b6058;
}
.bjl-terms-row .wp-block-post-terms {
	margin: 0 0 0.5rem;
}
.bjl-terms-row .wp-block-post-terms a {
	display: inline-block;
	background-color: #f5f3ee;
	border: 1px solid #dde0d8;
	border-radius: 999px;
	padding: 0.2rem 0.8rem;
	margin: 0 0.35rem 0.35rem 0;
	font-size: 13px;
	color: #3f5b44;
	text-decoration: none;
}
.bjl-terms-row .wp-block-post-terms .wp-block-post-terms__separator {
	display: none;
}


/* Keep reading card: thumbnails from the query block */
.bjl-side-card .wp-block-post-template > li .wp-block-post-featured-image {
	margin: 0 0 6px;
}
.bjl-side-card .wp-block-post-template > li .wp-block-post-featured-image img {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 16 / 9;
	object-fit: cover;
	border-radius: 8px;
}
.bjl-side-card .wp-block-post-template > li {
	padding: 0.75rem 0;
}
.bjl-side-card .wp-block-post-template > li:first-child {
	padding-top: 0.25rem;
}
.bjl-side-card .wp-block-post-template > li:last-child {
	padding-bottom: 0;
}


/* Published by card: contact links under the name */
.bjl-author-card .bjl-author-links {
	font-size: 13px;
	line-height: 1.6;
	margin: 4px 0 0;
	overflow-wrap: anywhere;
}
.bjl-author-card .bjl-author-links a {
	color: #3f5b44;
	text-decoration: none;
}
.bjl-author-card .bjl-author-links a:hover {
	text-decoration: underline;
}


/* Published by card: social logos under the name */
.bjl-author-card .bjl-author-social {
	margin-top: 8px;
	gap: 0.4rem;
}
.bjl-author-card .bjl-author-social .wp-social-link {
	background-color: #3f5b44 !important;
	color: #ffffff !important;
}


/* Sidebar scrolls with the page (no sticky) */
.bjl-side-sticky {
	position: static !important;
	top: auto !important;
}



/* Mobile: body text about 1px smaller (theme fluid size is ~17.8px on phones, this sets 16.8px). Headings unchanged. */
@media (max-width: 600px) {
	body {
		font-size: 1.05rem;
	}
}



/* Mobile readability pass: more line spacing for body text, Gist bullets up to 16px. */
@media (max-width: 600px) {
	body {
		line-height: 1.6;
	}
	.bjl-gist li {
		font-size: 1rem;
	}
}



/* ===== Header: the logo image already reads "Brandon's Blog Vault". The site title stays in the markup as hidden text so the homepage keeps its H1 and crawlers and screen readers still get the name. Inner pages have their own H1, so it is dropped there. ===== */
.wp-block-site-title.bjl-sr-title {
	position: absolute !important;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	clip-path: inset(50%);
	white-space: nowrap;
	border: 0;
}
body:not(.home) .wp-block-site-title.bjl-sr-title {
	display: none;
}


/* Header title fix: this site's homepage body class is "blog" (no static front page set), so keep the hidden H1 there instead of removing it. */
body.blog .wp-block-site-title.bjl-sr-title,
body.home .wp-block-site-title.bjl-sr-title {
	display: block;
}



/* Header logo: larger on desktop so the wordmark stays crisp on standard (1x) screens. Phones keep the 200px size set in the block. */
@media (min-width: 782px) {
	.wp-block-site-logo img {
		width: 260px !important;
		height: auto !important;
	}
}



/* Sidebar scrolls with the page again (sticky) on desktop. Overrides the "no sticky" rule above now that the image sits in the body column.
   max-height + overflow keeps every card reachable when the sidebar is taller than the screen. */
@media (min-width: 782px) {
	.bjl-side-sticky {
		position: sticky !important;
		top: 1.5rem !important;
		max-height: calc(100vh - 3rem);
		overflow-y: auto;
		scrollbar-width: thin;
	}
}



/* Sidebar stays put while the body scrolls: plain sticky, no inner scrolling. */
@media (min-width: 782px) {
	.bjl-side-sticky {
		max-height: none !important;
		overflow: visible !important;
	}
}



/* ===== Blog posts: banner title lines up with the left edge of the 1100px layout (logo edge). Scoped to single posts so pages keep their 960px banner. ===== */
body.single-post header.wp-block-template-part > .wp-block-group.alignfull > .wp-block-group {
	max-width: 1100px;
	width: 100%;
	margin-left: auto;
	margin-right: auto;
}

/* Blog posts: publish date centered over the article column. */
body.single-post .wp-block-post-date {
	text-align: center;
}



/* Blog post banner fix: the 960px cap sits on the post title block itself (the wrapper group is already full width), so widen the title block. Supersedes the wrapper-group rule above. */
body.single-post header.wp-block-template-part .wp-block-post-title {
	max-width: 1100px;
	width: 100%;
	text-align: left;
}



/* ===== Header search: magnifying-glass icon that expands into a field ===== */
.wp-block-navigation .bjl-nav-search {
	align-self: center;
}
.wp-block-navigation .bjl-nav-search .wp-block-search__button {
	background: transparent;
	color: #2c4030;
	border: 0;
	padding: 0.35rem;
	margin: 0;
	cursor: pointer;
	line-height: 1;
}
.wp-block-navigation .bjl-nav-search .wp-block-search__button:hover,
.wp-block-navigation .bjl-nav-search .wp-block-search__button:focus-visible {
	color: #000000;
}
.wp-block-navigation .bjl-nav-search .wp-block-search__button svg {
	width: 24px;
	height: 24px;
	fill: currentColor;
}
.wp-block-navigation .bjl-nav-search .wp-block-search__input {
	border: 1px solid #dde0d8;
	border-radius: 999px;
	padding: 0.4rem 1rem;
	font-family: var(--wp--preset--font-family--poppins);
	font-size: 0.9rem;
	background: #ffffff;
}
/* Mobile drawer: keep the search left of the tap target and full width when open. */
.wp-block-navigation__responsive-container.is-menu-open .bjl-nav-search {
	align-self: flex-end;
	max-width: 100%;
}



/* ===== Header search moved to its own row under the main nav, right-aligned under Let's Connect ===== */
.bjl-header-search-row {
	margin-top: 0.25rem;
}
.bjl-header-search .wp-block-search__button {
	background: transparent;
	color: #2c4030;
	border: 0;
	padding: 0.25rem;
	margin: 0;
	cursor: pointer;
	line-height: 1;
}
.bjl-header-search .wp-block-search__button:hover,
.bjl-header-search .wp-block-search__button:focus-visible {
	color: #000000;
}
.bjl-header-search .wp-block-search__button svg {
	width: 22px;
	height: 22px;
	fill: currentColor;
}
.bjl-header-search .wp-block-search__input {
	border: 1px solid #dde0d8;
	border-radius: 999px;
	padding: 0.4rem 1rem;
	font-family: var(--wp--preset--font-family--poppins);
	font-size: 0.9rem;
	background: #ffffff;
}



/* ===== Header search v3: centered in the header row with a "Search for Blogs" label (replaces the under-nav row styles above) ===== */
.bjl-header-main {
	position: relative;
}
.bjl-header-search .wp-block-search__button {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
}
.bjl-header-search .wp-block-search__button::after {
	content: "Search for Blogs";
	font-family: var(--wp--preset--font-family--poppins);
	font-size: 0.9rem;
	font-weight: 500;
	line-height: 1;
	white-space: nowrap;
}
/* Once the field opens, the label gets out of the way. */
.bjl-header-search:focus-within .wp-block-search__button::after {
	display: none;
}
/* Desktop: dead center of the header row, in the white space between logo and nav. */
@media (min-width: 1000px) {
	.bjl-header-main .bjl-header-search {
		position: absolute;
		left: 50%;
		top: 50%;
		transform: translate(-50%, -50%);
		margin: 0;
	}
}
/* Smaller screens: icon only, sits between logo and menu button. */
@media (max-width: 999px) {
	.bjl-header-search .wp-block-search__button::after {
		display: none;
	}
}



/* Header search: icon on the right of the label; hover keeps the text visible (green to dark, underlined label) instead of going white. */
.bjl-header-search .wp-block-search__button {
	flex-direction: row-reverse;
	background-color: transparent !important;
	color: #2c4030 !important;
}
.bjl-header-search .wp-block-search__button:hover,
.bjl-header-search .wp-block-search__button:focus-visible {
	background-color: transparent !important;
	color: #1e2a22 !important;
}
.bjl-header-search .wp-block-search__button:hover::after,
.bjl-header-search .wp-block-search__button:focus-visible::after {
	text-decoration: underline;
	text-underline-offset: 4px;
	text-decoration-thickness: 2px;
}



/* ===== Header search v4: always-open field (no expand animation), centered on desktop. Overrides the button-only / label rules above. ===== */
.bjl-header-search .wp-block-search__button::after {
	content: none !important;
}
.bjl-header-search .wp-block-search__inside-wrapper {
	border: 1px solid #dde0d8;
	border-radius: 999px;
	background: #ffffff;
	padding: 2px 4px 2px 14px;
	align-items: center;
}
.bjl-header-search .wp-block-search__input {
	border: 0 !important;
	border-radius: 0;
	background: transparent;
	padding: 0.35rem 0;
	font-family: var(--wp--preset--font-family--poppins);
	font-size: 0.9rem;
	min-width: 0;
}
.bjl-header-search .wp-block-search__input:focus {
	outline: none;
}
.bjl-header-search .wp-block-search__inside-wrapper:focus-within {
	border-color: #3f5b44;
}
.bjl-header-search .wp-block-search__button {
	flex-direction: row;
	padding: 0.3rem 0.4rem;
}
/* Smaller screens: no room between logo and menu, so the field drops to its own full-width row. */
@media (max-width: 999px) {
	.bjl-header-main {
		flex-wrap: wrap !important;
	}
	.bjl-header-main .bjl-header-search {
		order: 3;
		flex: 1 1 100%;
		width: 100% !important;
		max-width: 100%;
		margin-top: 0.5rem;
	}
}



/* Header search on small screens: half width, centered on its own row. */
@media (max-width: 999px) {
	.bjl-header-main .bjl-header-search {
		flex: 0 0 50% !important;
		width: 50% !important;
		min-width: 170px;
		margin-left: auto;
		margin-right: auto;
	}
}



/* Header search on small screens: left aligned (overrides the centered margins above). */
@media (max-width: 999px) {
	.bjl-header-main .bjl-header-search {
		margin-left: 0;
		margin-right: auto;
	}
}



/* ===== Header search v5: magnifying-glass icon right of the logo opens a full-screen search overlay (replaces the inline search field styles above) ===== */
.bjl-search-trigger {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	margin: 0 0 0 0.75rem;
	padding: 0;
	background: transparent;
	border: 0;
	border-radius: 50%;
	color: #2c4030;
	cursor: pointer;
	flex-shrink: 0;
}
.bjl-search-trigger:hover,
.bjl-search-trigger:focus-visible {
	background: #f5f3ee;
	color: #1e2a22;
}
.bjl-search-trigger svg {
	width: 24px;
	height: 24px;
	fill: none;
	stroke: currentColor;
	stroke-width: 2;
	stroke-linecap: round;
	stroke-linejoin: round;
}

dialog.bjl-search-overlay {
	position: fixed;
	inset: 0;
	width: 100%;
	height: 100%;
	max-width: none;
	max-height: none;
	margin: 0;
	padding: 1.5rem;
	border: 0;
	background: rgba(255, 255, 255, 0.97);
	color: #1e2a22;
	box-sizing: border-box;
}
dialog.bjl-search-overlay[open] {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
}
dialog.bjl-search-overlay::backdrop {
	background: rgba(30, 42, 34, 0.5);
}
@media (prefers-reduced-motion: no-preference) {
	dialog.bjl-search-overlay[open] {
		animation: bjl-search-fade 0.2s ease;
	}
}
@keyframes bjl-search-fade {
	from { opacity: 0; }
	to   { opacity: 1; }
}
body:has(dialog.bjl-search-overlay[open]) {
	overflow: hidden;
}

.bjl-search-close {
	position: absolute;
	top: 1.25rem;
	right: 1.25rem;
	padding: 0.5rem 0.75rem;
	background: transparent;
	border: 0;
	font-family: var(--wp--preset--font-family--poppins);
	font-size: 1rem;
	font-weight: 500;
	line-height: 1;
	color: #3f5b44;
	cursor: pointer;
}
.bjl-search-close:hover,
.bjl-search-close:focus-visible {
	color: #1e2a22;
	text-decoration: underline;
	text-underline-offset: 4px;
	text-decoration-thickness: 2px;
}

.bjl-search-form {
	display: flex;
	align-items: center;
	gap: 0.75rem;
	width: min(720px, 100%);
}
.bjl-search-form input[type="search"] {
	flex: 1 1 auto;
	min-width: 0;
	padding: 0.5rem 0;
	background: transparent;
	border: 0;
	border-bottom: 2px solid #3f5b44;
	border-radius: 0;
	font-family: var(--wp--preset--font-family--poppins);
	font-size: clamp(1.25rem, 4vw, 2rem);
	color: #1e2a22;
	-webkit-appearance: none;
	appearance: none;
}
.bjl-search-form input[type="search"]:focus {
	outline: none;
	border-bottom-color: #1e2a22;
}
.bjl-search-form input[type="search"]::placeholder {
	color: #8a8f86;
}
.bjl-search-form button[type="submit"] {
	padding: 0.7rem 1.4rem;
	background: #3f5b44;
	border: 0;
	border-radius: 999px;
	font-family: var(--wp--preset--font-family--poppins);
	font-size: 0.95rem;
	font-weight: 500;
	color: #ffffff;
	cursor: pointer;
}
.bjl-search-form button[type="submit"]:hover,
.bjl-search-form button[type="submit"]:focus-visible {
	background: #2c4030;
}
@media (max-width: 600px) {
	.bjl-search-form {
		flex-wrap: wrap;
	}
	.bjl-search-form input[type="search"] {
		flex: 1 1 100%;
	}
	.bjl-search-form button[type="submit"] {
		flex: 1 1 100%;
	}
}



/* Header search v5b: icon now sits left of the nav / menu button, so no left margin. */
.bjl-search-trigger {
	margin: 0;
}
.bjl-header-right {
	flex-shrink: 0;
}



/* ===== Mobile nav: half-moon drawer. Shrinks to fit the links, big curve on the left, no wasted white space. ===== */
.wp-block-navigation__responsive-container.is-menu-open {
	width: fit-content;
	min-width: 190px;
	max-width: min(320px, 85vw);
	border-radius: 120px 0 0 120px;
	box-shadow: -8px 6px 28px rgba(0, 0, 0, 0.16);
}
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content {
	padding: 4.25rem 1.5rem 2.5rem 2.75rem;
	width: auto;
}
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container,
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container {
	width: auto;
}
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-close {
	top: 1.5rem;
	right: 1.5rem;
}



/* ===== Mobile nav: half-moon v2. Smaller curve, tighter padding, smaller type, and width forced to the content (the earlier fit-content was losing to the 72% rule). ===== */
.wp-block-navigation__responsive-container.is-menu-open {
	width: max-content !important;
	min-width: 0 !important;
	max-width: 85vw !important;
	border-radius: 64px 0 0 64px;
	top: 4.5rem;
}
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-dialog,
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content {
	width: auto !important;
	min-width: 0;
}
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content {
	padding: 3.5rem 1.25rem 1.5rem 2.25rem;
}
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content {
	font-size: 1.2rem;
	padding: 0.4rem 0;
}
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
	font-size: 0.95rem;
	padding: 0.2rem 0;
}
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-close {
	top: 1.1rem;
	right: 1.25rem;
}
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-close::after {
	font-size: 0.9rem;
}
.wp-block-navigation__responsive-container.is-menu-open .bjl-nav-social {
	margin-top: 0.5rem;
	padding-top: 0.25rem;
	font-size: 17px;
	gap: 0.45rem;
}



/* ===== Header search: split by screen size. Desktop (1000px+) keeps the always-open centered field. Smaller screens get the magnifying-glass icon + full-screen overlay. ===== */
@media (min-width: 1000px) {
	.bjl-search-trigger,
	dialog.bjl-search-overlay {
		display: none !important;
	}
}
@media (max-width: 999px) {
	.bjl-header-main .bjl-header-search {
		display: none !important;
	}
}



/* ===== Blog posts: natural scrolling =====
   The right rail was pinned (sticky) while the page scrolled. It is taller than most screens, so the bottom cards stayed hidden and the page felt like it was fighting the scroll. Now the rail scrolls with the article on every screen size. Smooth scrolling applies to anchor jumps only and turns off for visitors who prefer reduced motion. */
@media (min-width: 782px) {
	.bjl-side-sticky {
		position: static !important;
		top: auto !important;
	}
}
html:has(body.single-post) {
	scroll-behavior: smooth;
	scroll-padding-top: 1.5rem;
}
@media (prefers-reduced-motion: reduce) {
	html:has(body.single-post) {
		scroll-behavior: auto;
	}
}

/* GoFundMe widget in the right rail, above Keep reading */
.bjl-gfm-slot {
	margin-bottom: 1rem;
	max-width: 100%;
	overflow: hidden;
}
.bjl-gfm-slot .gfm-embed {
	max-width: 100%;
}