/* =============================================
   Mark Forrester — Additional CSS
   ============================================= */

/* --- Post grid cards: pin the 4:3 frame so a slow/failed image
       can never blow out the grid row --- */
.wp-block-post .wp-block-post-featured-image {
	aspect-ratio: 4 / 3;
	overflow: hidden;
	display: block;
}

.wp-block-post .wp-block-post-featured-image a,
.wp-block-post .wp-block-post-featured-image img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/* Grid items align to the top rather than stretching to the tallest card */
.wp-block-post-template.is-layout-grid {
	align-items: start;
}

/* --- Post grid: light sweeps across the image on hover --- */
.wp-block-post .wp-block-post-featured-image {
	position: relative;
}

.wp-block-post .wp-block-post-featured-image img {
	transition: transform 0.7s cubic-bezier(0.22, 0.61, 0.36, 1);
	will-change: transform;
}

.wp-block-post:hover .wp-block-post-featured-image img {
	transform: scale(1.045);
}

.wp-block-post .wp-block-post-featured-image::after {
	content: '';
	position: absolute;
	inset: 0;
	z-index: 2;
	pointer-events: none;
	background: linear-gradient(
		105deg,
		transparent 35%,
		rgba(255, 255, 255, 0.10) 44%,
		rgba(255, 255, 255, 0.42) 50%,
		rgba(255, 255, 255, 0.10) 56%,
		transparent 65%
	);
	transform: translateX(-115%);
	transition: transform 0.85s cubic-bezier(0.22, 0.61, 0.36, 1);
}

.wp-block-post:hover .wp-block-post-featured-image::after {
	transform: translateX(115%);
}

@media (prefers-reduced-motion: reduce) {
	.wp-block-post .wp-block-post-featured-image img,
	.wp-block-post .wp-block-post-featured-image::after {
		transition: none;
	}
	.wp-block-post:hover .wp-block-post-featured-image img { transform: none; }
	.wp-block-post:hover .wp-block-post-featured-image::after { transform: translateX(-115%); }
}

/* --- No rounded corners on photos --- */
.wp-block-post-featured-image img,
.wp-block-image img,
.wp-post-image {
	border-radius: 0 !important;
}

/* --- Post date typography --- */
.wp-block-post-date {
	font-family: var(--wp--preset--font-family--albert-sans), sans-serif !important;
	font-size: 0.7rem !important;
	font-weight: 400 !important;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: #a8a5a0 !important;
}
.wp-block-post-date time {
	color: inherit !important;
	font-family: inherit !important;
	font-size: inherit !important;
	font-weight: inherit !important;
}

/* --- Pagination --- */
.wp-block-query-pagination {
	justify-content: flex-end !important;
	align-items: center;
	border-top: none;
	padding-top: 0;
	margin-top: 1.5rem !important;
	margin-bottom: 0 !important;
}
.wp-block-query-pagination-next,
.wp-block-query-pagination-previous {
	font-size: 0.75rem !important;
	font-weight: 400;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	text-decoration: none !important;
	color: inherit;
	display: inline-flex;
	align-items: center;
	gap: 0.4em;
	transition: gap 0.25s ease;
}
.wp-block-query-pagination-next:hover,
.wp-block-query-pagination-previous:hover { gap: 0.75em; }
.wp-block-query-pagination-next-arrow,
.wp-block-query-pagination-previous-arrow {
	display: inline-block;
	transition: transform 0.25s ease;
}
.wp-block-query-pagination-next:hover .wp-block-query-pagination-next-arrow { transform: translateX(4px); }
.wp-block-query-pagination-previous:hover .wp-block-query-pagination-previous-arrow { transform: translateX(-4px); }
@media (prefers-reduced-motion: reduce) {
	.wp-block-query-pagination-next,
	.wp-block-query-pagination-previous,
	.wp-block-query-pagination-next-arrow,
	.wp-block-query-pagination-previous-arrow { transition: none; }
}

/* --- Section label ("Latest posts"): quiet editorial eyebrow,
       so post titles lead the hierarchy --- */
.mf-section-label {
	font-family: var(--wp--preset--font-family--albert-sans) !important;
	font-size: 0.72rem !important;
	font-weight: 600 !important;
	letter-spacing: 0.09em !important;
	text-transform: uppercase;
	color: #a8a5a0 !important;
	margin-top: 0 !important;
	margin-bottom: 1.75rem !important;
}

/* --- Sidebar: tighten the logo/bio -> nav gap --- */
.site-sidebar > .wp-block-group > .wp-block-group:first-child {
	padding-bottom: 2rem !important;
}

/* --- Sidebar height: the theme forces min-height:100vh so the old
       space-between layout could pin socials to the bottom. We use
       flex-start now, so that only created dead space under the footer. --- */
.site-sidebar {
	min-height: 0 !important;
}

/* Trim the page's bottom gutter to match the sides --- */
.wp-site-blocks {
	padding-bottom: 32px !important;
}


/* --- Footer: reads as a footer, not a stray line of text.
       Kill the constrained global padding so the right edge lands on the
       same axis as the pagination, add a faint rule, drop to meta scale. --- */
.site-footer {
	margin-top: 1.5rem !important;
}

.site-footer > .wp-block-group.mf-footer {
	padding-left: 0 !important;
	padding-right: 0 !important;
	padding-top: 1.5rem !important;
	padding-bottom: 0 !important;
	border-top: 1px solid rgba(17, 17, 17, 0.09);
}

.site-footer .mf-footer-title,
.site-footer .mf-footer-title a {
	font-family: var(--wp--preset--font-family--albert-sans), sans-serif !important;
	font-size: 0.78rem !important;
	font-weight: 600 !important;
	letter-spacing: 0.01em !important;
	color: #111 !important;
	text-decoration: none !important;
	margin: 0 !important;
	line-height: 1.4 !important;
}

.site-footer .mf-footer-tagline,
.site-footer .mf-footer-copy {
	font-family: var(--wp--preset--font-family--albert-sans), sans-serif !important;
	font-size: 0.78rem !important;
	font-weight: 400 !important;
	letter-spacing: 0.01em !important;
	color: #a8a5a0 !important;
	margin: 0 !important;
	line-height: 1.4 !important;
}

.site-footer .mf-footer-copy {
	font-variant-numeric: tabular-nums;
}

@media (max-width: 599px) {
	.site-footer > .wp-block-group.mf-footer { padding-top: 1.25rem !important; }
	.site-footer .mf-footer-title,
	.site-footer .mf-footer-tagline,
	.site-footer .mf-footer-copy { font-size: 0.74rem !important; }
}

/* --- Sidebar vertical rhythm --- */
.site-sidebar > .wp-block-group {
	justify-content: flex-start !important;
	gap: 0 !important;
	padding-bottom: 2rem !important;
}
.site-sidebar > .wp-block-group > .wp-block-group:nth-child(2) { margin-top: 40px !important; }
.site-sidebar > .wp-block-group > .wp-block-group:nth-child(3) { margin-top: 40px !important; }

/* --- Social links --- */
.wp-block-social-links.is-style-logos-only {
	margin-top: 1em !important;
	gap: 24px !important;
}
.wp-block-social-links.is-style-logos-only .wp-block-social-link {
	opacity: 0.45;
	transition: opacity 0.2s ease, transform 0.2s ease;
}
.wp-block-social-links.is-style-logos-only .wp-block-social-link:hover {
	opacity: 1;
	transform: translateY(-2px);
}
.wp-block-social-links.is-style-logos-only .wp-social-link-instagram:hover { color: #e1306c !important; }
.wp-block-social-links.is-style-logos-only .wp-social-link-linkedin:hover { color: #0a66c2 !important; }
.wp-block-social-links.is-style-logos-only .wp-social-link-twitter:hover { color: #1da1f2 !important; }
.wp-block-social-links.is-style-logos-only .wp-block-social-link svg { width: 18px; height: 18px; }
@media (prefers-reduced-motion: reduce) {
	.wp-block-social-links.is-style-logos-only .wp-block-social-link { transition: none; }
}

/* --- Subscribe below socials --- */
.mf-sidebar-subscribe { margin-top: 1em !important; }

/* --- Logo wink --- */
.wp-block-site-logo a {
	display: inline-block;
	position: relative;
	transition: all 0.2s ease-in-out;
}
.wp-block-site-logo a:hover img {
	content: url('https://mark.blog/wp-content/uploads/2026/03/mark-blog-logo-hover-2.png');
}
body::after {
	position: absolute; width: 0; height: 0; overflow: hidden; z-index: -1;
	content: url('https://i0.wp.com/mark.blog/wp-content/uploads/2018/05/mark-blog-logo.png');
}



/* --- Fraunces display headings: optical tracking --- */
h1, h2, h3,
.wp-block-post-title,
.wp-block-heading {
	letter-spacing: -0.015em;
}

/* --- Social labels: kill the 7.8px trailing margin so the label text
       ends on the same right axis (x=246) as the nav, not 8px short --- */
.site-sidebar .wp-block-social-link-label {
	margin-right: 0 !important;
}

/* --- Sidebar micro-bio --- */


.mf-bio-link {
	color: #c9968e;
	text-decoration: none;
	white-space: nowrap;
}

.mf-bio-arrow {
	color: #c9968e;
	transition: transform 0.2s ease;
	display: inline-block;
}

.mf-bio-link:hover .mf-bio-arrow { transform: translateX(3px); }

@media (prefers-reduced-motion: reduce) {
	.mf-bio-arrow { transition: none; }
}


/* --- Desktop site padding --- */
.wp-site-blocks,
.has-global-padding {
	padding-left: 32px !important;
	padding-right: 32px !important;
}

/* --- Mobile site padding: match iOS system bar inset (~16px) --- */
@media (max-width: 599px) {
	.wp-site-blocks { padding-left: 16px !important; padding-right: 16px !important; }
	.has-global-padding { padding-left: 16px !important; padding-right: 16px !important; }
}

/* --- Sidebar / content gutter --- */
@media (min-width: 782px) {
	.wp-block-columns.alignwide { gap: 56px !important; }
}

/* --- Sidebar nav: Fraunces is wider than the old serif, stop "Investments" wrapping --- */
.site-sidebar .wp-block-navigation-item__content {
	white-space: nowrap;
}

.site-sidebar .wp-block-navigation {
	flex-wrap: nowrap !important;
}

/* --- Active nav item --- */




/* --- Sidebar micro-bio: Fraunces italic epigraph under the portrait --- */
.mf-sidebar-bio {
	font-family: var(--wp--preset--font-family--fraunces), Georgia, serif !important;
	font-style: italic !important;
	font-size: 0.9rem !important;
	font-weight: 400 !important;
	line-height: 1.55 !important;
	letter-spacing: 0 !important;
	color: #8a8683 !important;
	text-align: right !important;
	max-width: 182px;
	margin: 1.75rem 0 0 auto !important;
	-webkit-hyphens: none;
	hyphens: none;
	text-wrap: pretty;
}

/* --- Active nav item: colour + a dot in the right gutter.
       Absolutely positioned, so the right edge stays perfectly flush
       and the left edge is never broken. Echoes the About timeline dots. --- */
.site-sidebar .wp-block-navigation-item.current-menu-item > a {
	color: #c9968e !important;
}

.site-sidebar .wp-block-navigation-item.current-menu-item {
	position: relative;
}



.site-sidebar .wp-block-navigation-item.current-menu-item::after {
	content: '\2192';
	position: absolute;
	right: -25px;
	top: 50%;
	transform: translateY(-50%);
	color: #c9968e;
	font-family: var(--wp--preset--font-family--albert-sans), sans-serif;
	font-size: 0.6em;
	line-height: 1;
	font-style: normal;
	pointer-events: none;
}

/* --- Post grid card shadows --- */
@media (prefers-reduced-motion: reduce) {
	}

/* --- Mobile: post grid single column --- */
@media (max-width: 599px) {
	.wp-block-post-template.columns-3,
	.wp-block-post-template.columns-2 { grid-template-columns: 1fr !important; }
}

/* --- Single post paper card --- */
body.single-post main.wp-block-group {
	background: transparent;
	padding: 2.5rem 2.75rem 3rem;
	margin-bottom: 2rem;
	box-shadow: none;
	border-radius: 0;
}
body.single-post .mf-post-card {
	background: #ffffff;
	border-radius: 2px;
	padding: 0 2.75rem 3rem;
	margin-left: -2.75rem;
	margin-right: -2.75rem;
	width: calc(100% + 5.5rem);
}
body.single-post .wp-block-post-featured-image {
	margin-left: -2.75rem;
	margin-right: -2.75rem;
	width: calc(100% + 5.5rem);
	max-width: calc(100% + 5.5rem);
	overflow: hidden;
	margin-top: 0;
}
body.single-post .wp-block-post-featured-image img {
	display: block; width: 100%; height: auto; border-radius: 0 !important;
}
body.single-post .wp-block-post-content .alignwide {
	margin-left: 0; margin-right: 0; width: 100%; max-width: 100%;
}
body.single-post main.wp-block-group > .wp-block-group:first-child {
	margin-left: -2.75rem;
	margin-right: -2.75rem;
	margin-top: -2.5rem;
	width: calc(100% + 5.5rem);
	max-width: calc(100% + 5.5rem);
	padding-bottom: 0;
}
body.single-post .wp-block-post-title { margin-bottom: 0.15rem !important; }
body.single-post main.wp-block-group > .wp-block-group:first-child > .wp-block-group { gap: 0.5rem !important; }
body.single-post .wp-block-post-comments-link { padding-top: 0 !important; padding-bottom: 0 !important; }

/* --- Single post: no featured image — flat white, no shadows --- */
body.single-post main.wp-block-group:not(:has(.wp-block-post-featured-image)) {
	background-color: #ffffff !important;
	padding-top: 0 !important;
	overflow: hidden;
}
body.single-post main.wp-block-group:not(:has(.wp-block-post-featured-image)) > .wp-block-group:first-child {
	margin-top: 0 !important;
	margin-left: -44px !important;
	margin-right: -44px !important;
	max-width: calc(100% + 88px) !important;
	width: calc(100% + 88px) !important;
	padding: 2.75rem 2.75rem 0 !important;
	background-color: #ffffff !important;
	border-radius: 0 !important;
	box-shadow: none !important;
}
body.single-post main.wp-block-group:not(:has(.wp-block-post-featured-image)) > .mf-post-card {
	padding-top: 1.25rem !important;
	margin-top: 0 !important;
	border-radius: 0 !important;
	box-shadow: none !important;
}

/* --- Mobile: single post layout --- */
@media (max-width: 599px) {
	body.single-post main.wp-block-group { padding: 1rem 1rem 2rem !important; }
	body.single-post .mf-post-card {
		margin-left: -1rem !important; margin-right: -1rem !important;
		width: calc(100% + 2rem) !important;
		padding-left: 1rem !important; padding-right: 1rem !important;
	}
	body.single-post .wp-block-post-featured-image {
		margin-left: -1rem !important; margin-right: -1rem !important;
		width: calc(100% + 2rem) !important; max-width: calc(100% + 2rem) !important;
	}
	body.single-post main.wp-block-group > .wp-block-group:first-child {
		margin-left: -1rem !important; margin-right: -1rem !important;
		margin-top: -1rem !important;
		width: calc(100% + 2rem) !important; max-width: calc(100% + 2rem) !important;
	}
	body.single-post .wp-block-post-content .wp-block-quote,
	body.single-post .wp-block-post-content .wp-block-pullquote {
		margin-left: 0 !important; margin-right: 0 !important; width: 100% !important;
	}
}

/* --- Blockquote: typography-only, no border --- */
.wp-block-quote {
	border: none !important; border-left: none !important;
	padding: 0.25rem 0 !important;
	margin-left: 1.5rem !important; margin-right: 1.5rem !important;
	margin-top: 2rem !important; margin-bottom: 2rem !important;
}
.wp-block-quote p {
	font-family: var(--wp--preset--font-family--fraunces), Georgia, serif !important;
	font-style: italic !important;
	font-size: 1.2rem !important;
	font-weight: 400 !important;
	line-height: 1.65 !important;
	color: #3a3530 !important;
	letter-spacing: 0.01em;
}
.wp-block-quote cite {
	font-family: var(--wp--preset--font-family--albert-sans), sans-serif !important;
	font-style: normal !important;
	font-size: 0.7rem !important;
	font-weight: 400 !important;
	letter-spacing: 0.07em;
	text-transform: uppercase;
	color: #a8a5a0 !important;
	margin-top: 0.75rem !important;
	display: block;
}

/* --- Bio panel blob --- */







/* --- Sidebar subscribe: quiet outline button, not a black slab --- */
.jetpack-subscribe-floating-button { display: none !important; }

/* Hide the email field — button-only mode */
.mf-sidebar-subscribe input[type="email"],
.mf-sidebar-subscribe input[type="text"] {
	display: none !important;
}

.mf-sidebar-subscribe .wp-block-jetpack-subscriptions__form-elements,
.mf-sidebar-subscribe .wp-block-jetpack-subscriptions__container,
.mf-sidebar-subscribe form {
	display: flex;
	justify-content: flex-end;
	margin: 0;
}

/* Cover every element Jetpack may render the control as */
.mf-sidebar-subscribe button,
.mf-sidebar-subscribe button[type="submit"],
.mf-sidebar-subscribe input[type="submit"],
.mf-sidebar-subscribe .wp-block-button__link,
.mf-sidebar-subscribe .wp-block-jetpack-subscriptions__button,
.mf-sidebar-subscribe .mf-subscribe-btn {
	font-family: var(--wp--preset--font-family--albert-sans), sans-serif !important;
	font-size: 0.7rem !important;
	font-weight: 500 !important;
	letter-spacing: 0.09em !important;
	text-transform: uppercase !important;
	color: #6b6a6a !important;
	background: transparent !important;
	background-color: transparent !important;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236b6a6a' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='2' y='4' width='20' height='16' rx='2'/%3E%3Cpath d='m2 7 10 6 10-6'/%3E%3C/svg%3E") !important;
	background-repeat: no-repeat !important;
	background-position: left 1em center !important;
	background-size: 13px 13px !important;
	border: 1px solid rgba(17, 17, 17, 0.18) !important;
	border-radius: 2px !important;
	padding: 0.62em 1.15em 0.62em 2.9em !important;
	min-height: 0 !important;
	line-height: 1.2 !important;
	box-shadow: none !important;
	cursor: pointer;
	transition: color 0.2s ease, border-color 0.2s ease;
}

.mf-sidebar-subscribe button:hover,
.mf-sidebar-subscribe button[type="submit"]:hover,
.mf-sidebar-subscribe input[type="submit"]:hover,
.mf-sidebar-subscribe .wp-block-button__link:hover,
.mf-sidebar-subscribe .wp-block-jetpack-subscriptions__button:hover,
.mf-sidebar-subscribe .mf-subscribe-btn:hover {
	color: #c9968e !important;
	border-color: #c9968e !important;
	background-color: transparent !important;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23c9968e' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='2' y='4' width='20' height='16' rx='2'/%3E%3Cpath d='m2 7 10 6 10-6'/%3E%3C/svg%3E") !important;
}

@media (prefers-reduced-motion: reduce) {
	.mf-sidebar-subscribe button,
	.mf-sidebar-subscribe input[type="submit"] { transition: none; }
}

/* --- Nav overlay: subscribe + social left-align flush with nav items --- */
.wp-block-navigation__responsive-container.is-menu-open .mf-nav-overlay-subscribe .wp-block-jetpack-subscriptions__form-elements,
.wp-block-navigation__responsive-container.is-menu-open .mf-nav-overlay-subscribe .wp-block-jetpack-subscriptions__container {
	justify-content: flex-start !important;
}
.wp-block-navigation__responsive-container.is-menu-open .mf-nav-overlay-subscribe input[type="submit"] {
	margin-left: 0 !important;
}
.wp-block-navigation__responsive-container.is-menu-open .mf-nav-overlay-social {
	margin-left: 0 !important;
	padding-left: 0 !important;
}

/* --- About page --- */
.entry-content .has-large-font-size.wp-block-paragraph { font-size: 1.15rem !important; line-height: 1.65; }
.mf-about-sidebar h4.wp-block-heading {
	font-size: 0.72rem !important;
	font-family: var(--wp--preset--font-family--albert-sans), sans-serif !important;
	font-weight: 600 !important;
	letter-spacing: 0.07em;
	text-transform: uppercase;
	color: #a8a5a0;
	margin-bottom: 0.6rem !important;
	margin-top: 1.75rem !important;
}
.mf-about-sidebar h4.wp-block-heading:first-of-type { margin-top: 0.75rem !important; }
.mf-about-sidebar .wp-block-list,
.mf-about-sidebar .wp-block-paragraph { font-size: 1.05rem !important; line-height: 1.6 !important; }
.mf-about-sidebar .wp-block-list {
	margin-top: 0 !important; margin-bottom: 0 !important;
	padding-left: 1.1em !important; padding-bottom: 0 !important;
}
.mf-about-sidebar.wp-block-column {
	background-color: #ffffff;
	border-radius: 2px;
	padding: 1.75rem 1.25rem !important;
	margin-top: 2.75rem;
	align-self: flex-start;
}
.mf-about-sidebar .wp-block-image {
	position: relative;
	margin-top: -1.75rem; margin-left: -1.25rem; margin-right: -1.25rem; margin-bottom: 1.5rem;
}
.mf-about-sidebar .wp-block-image img { display: block; width: 100%; border-radius: 1px 1px 0 0; }
.mf-about-sidebar .wp-block-image .wp-element-caption {
	position: absolute; bottom: 0; left: 0; right: 0; margin: 0;
	padding: 1.5rem 1rem 0.65rem;
	background: linear-gradient(to top, rgba(0,0,0,0.55) 0%, transparent 100%);
	color: rgba(255,255,255,0.88);
	font-size: 0.7rem; letter-spacing: 0.03em; text-align: center; line-height: 1.4;
}

/* --- Custom timeline --- */
.mf-timeline.wp-block-group { gap: 0 !important; margin-top: 2rem; }
.mf-timeline .mf-timeline__item.wp-block-group {
	position: relative;
	padding: 0 0 2.5rem 1.5rem;
	border-left: 1px solid rgba(17,17,17,0.15);
	gap: 0.25rem !important;
	list-style: none;
}
.mf-timeline .mf-timeline__item.wp-block-group:last-child { padding-bottom: 0; border-left-color: transparent; }
.mf-timeline .mf-timeline__item.wp-block-group::before {
	content: "";
	position: absolute; top: 0.35em; left: -4px;
	width: 7px; height: 7px;
	border-radius: 50%; background: #111;
	transition: background 0.2s ease;
}
.mf-timeline .mf-timeline__item.wp-block-group:hover::before { background: #a8a5a0; }
.mf-timeline .mf-timeline__year.wp-block-paragraph {
	font-family: var(--wp--preset--font-family--albert-sans), sans-serif !important;
	font-size: 0.68rem !important; font-weight: 600 !important;
	letter-spacing: 0.07em; text-transform: uppercase;
	color: #a8a5a0; margin: 0 0 0.4rem !important; line-height: 1;
}
.mf-timeline .mf-timeline__body.wp-block-paragraph { font-size: 1.05rem; line-height: 1.65; color: #333; margin: 0 !important; }
.mf-timeline .mf-timeline__body a { color: inherit; text-decoration-color: rgba(17,17,17,0.3); text-underline-offset: 0.2em; transition: text-decoration-color 0.2s ease; }
.mf-timeline .mf-timeline__body a:hover { text-decoration-color: #111; }
@media (prefers-reduced-motion: reduce) {
	.mf-timeline .mf-timeline__item.wp-block-group::before,
	.mf-timeline .mf-timeline__body a { transition: none; }
}

/* =============================================
   COMMENTS
   Post body is 19.1px — comments sit deliberately
   below that so the article keeps prominence.
   ============================================= */

/* --- Blob list: alternating warm tint --- */
.wp-block-comment-template > li .wp-block-group.has-background-background-color {
	background-color: transparent !important;
	margin-bottom: 0 !important;
}

.wp-block-comment-template {
	list-style: none !important;
	padding-left: 0 !important;
	margin: 0 !important;
}

.wp-block-comment-template > li {
	padding: 1.9rem 1.75rem 2.9rem !important;
	margin: 0 0 0.75rem !important;
}

.wp-block-comment-template > li:nth-child(odd) {
	background-color: #ece7df !important;
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 130' preserveAspectRatio='none'%3E%3Cpath d='M8,10 C18,0 48,5 78,2 C108,-1 148,4 178,2 C194,1 201,10 199,24 C197,36 204,48 201,63 C198,76 205,90 200,104 C195,116 180,122 160,126 C140,130 112,133 84,131 C56,129 28,126 12,118 C0,112 -1,100 2,86 C5,72 -3,60 2,45 C6,30 -2,20 8,10 Z' fill='black'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 130' preserveAspectRatio='none'%3E%3Cpath d='M8,10 C18,0 48,5 78,2 C108,-1 148,4 178,2 C194,1 201,10 199,24 C197,36 204,48 201,63 C198,76 205,90 200,104 C195,116 180,122 160,126 C140,130 112,133 84,131 C56,129 28,126 12,118 C0,112 -1,100 2,86 C5,72 -3,60 2,45 C6,30 -2,20 8,10 Z' fill='black'/%3E%3C/svg%3E");
	-webkit-mask-size: 100% 100%; mask-size: 100% 100%;
	-webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;
}

.wp-block-comment-template > li:nth-child(even) {
	background-color: transparent !important;
}

/* --- Avatar --- */
.wp-block-avatar img {
	border-radius: 50% !important;
}

/* --- Author --- */
.wp-block-comment-author-name,
.wp-block-comment-author-name a {
	font-family: var(--wp--preset--font-family--albert-sans), sans-serif !important;
	font-size: 0.9rem !important;
	font-weight: 600 !important;
	letter-spacing: 0.005em;
	color: #111 !important;
	text-decoration: none !important;
	line-height: 1.3 !important;
}

/* --- Date --- */
.wp-block-comment-date,
.wp-block-comment-edit-link {
	font-family: var(--wp--preset--font-family--albert-sans), sans-serif !important;
	font-size: 0.66rem !important;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: #a8a5a0 !important;
}

.wp-block-comment-date a,
.wp-block-comment-edit-link a {
	color: inherit !important;
	text-decoration: none !important;
}

/* --- Body: 15px against the post's 19.1px --- */
.wp-block-comment-content {
	margin-top: 0.9rem !important;
	font-size: 0.94rem !important;
	line-height: 1.72 !important;
	color: #3d3a37 !important;
}

.wp-block-comment-content p {
	margin: 0 0 0.9em !important;
	font-size: inherit !important;
	line-height: inherit !important;
}

.wp-block-comment-content p:last-child { margin-bottom: 0 !important; }

.wp-block-comment-content a {
	color: inherit;
	text-decoration-color: rgba(17, 17, 17, 0.3);
	text-underline-offset: 0.18em;
}

.wp-block-comment-content a:hover { text-decoration-color: #c9968e; }

/* --- Reply link --- */
.wp-block-comment-reply-link a {
	font-family: var(--wp--preset--font-family--albert-sans), sans-serif !important;
	font-size: 0.66rem !important;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: #a8a5a0 !important;
	text-decoration: none !important;
	transition: color 0.2s ease;
}

.wp-block-comment-reply-link a:hover { color: #c9968e !important; }

/* --- Comments title ("30 Comments") --- */
.wp-block-comments-title {
	font-family: var(--wp--preset--font-family--albert-sans), sans-serif !important;
	font-size: 0.72rem !important;
	font-weight: 600 !important;
	letter-spacing: 0.09em !important;
	text-transform: uppercase;
	color: #a8a5a0 !important;
	margin: 0 0 1.75rem !important;
}

/* --- Reply form --------------------------------------------------
   The core h3#reply-title ships with margin:0 on all sides, which is
   why it collided with the comment above and the form below.        */
.comment-respond {
	margin-top: 3.25rem !important;
	padding-top: 2rem;
	border-top: 1px solid rgba(17, 17, 17, 0.09);
}

h3.comment-reply-title,
.comment-reply-title {
	font-family: var(--wp--preset--font-family--albert-sans), sans-serif !important;
	font-size: 0.72rem !important;
	font-weight: 600 !important;
	letter-spacing: 0.09em !important;
	text-transform: uppercase;
	color: #a8a5a0 !important;
	line-height: 1.4 !important;
	margin: 0 0 1.5rem !important;
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 0.9em;
}

/* "Cancel reply" — quiet sibling, not part of the heading */
.comment-reply-title small {
	font-size: 1em;
}

#cancel-comment-reply-link {
	font-family: var(--wp--preset--font-family--albert-sans), sans-serif !important;
	font-size: 0.66rem !important;
	font-weight: 400 !important;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: #a8a5a0 !important;
	text-decoration: none !important;
	border-bottom: 1px solid rgba(17, 17, 17, 0.18);
	padding-bottom: 1px;
	transition: color 0.2s ease, border-color 0.2s ease;
}

#cancel-comment-reply-link:hover {
	color: #c9968e !important;
	border-color: #c9968e;
}

/* --- Fields --- */
.comment-respond .comment-form-comment,
.comment-respond .comment-form-author,
.comment-respond .comment-form-email,
.comment-respond .comment-form-url {
	margin-bottom: 1.1rem;
}

.comment-respond label {
	display: block;
	font-family: var(--wp--preset--font-family--albert-sans), sans-serif !important;
	font-size: 0.66rem !important;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: #a8a5a0 !important;
	margin-bottom: 0.5rem;
}

.comment-respond textarea,
.comment-respond input[type="text"],
.comment-respond input[type="email"],
.comment-respond input[type="url"] {
	width: 100%;
	box-sizing: border-box;
	font-family: var(--wp--preset--font-family--albert-sans), sans-serif !important;
	font-size: 0.94rem !important;
	line-height: 1.6 !important;
	color: #3d3a37 !important;
	background: #ffffff;
	border: 1px solid rgba(17, 17, 17, 0.14) !important;
	border-radius: 2px !important;
	padding: 0.85rem 1rem !important;
	transition: border-color 0.2s ease;
}

.comment-respond textarea:focus,
.comment-respond input[type="text"]:focus,
.comment-respond input[type="email"]:focus,
.comment-respond input[type="url"]:focus {
	outline: none;
	border-color: #c9968e !important;
}

.comment-respond .comment-notes,
.comment-respond .form-submit + p,
.comment-respond .comment-form-cookies-consent label {
	font-size: 0.72rem !important;
	line-height: 1.6 !important;
	color: #a8a5a0 !important;
	text-transform: none;
	letter-spacing: 0;
}

/* --- Submit: same quiet outline as the sidebar subscribe --- */
.comment-respond .form-submit {
	margin: 1.4rem 0 0 !important;
}

.comment-respond input[type="submit"],
.comment-respond .wp-block-button__link {
	font-family: var(--wp--preset--font-family--albert-sans), sans-serif !important;
	font-size: 0.7rem !important;
	font-weight: 500 !important;
	letter-spacing: 0.09em !important;
	text-transform: uppercase !important;
	color: #6b6a6a !important;
	background: transparent !important;
	border: 1px solid rgba(17, 17, 17, 0.18) !important;
	border-radius: 2px !important;
	padding: 0.62em 1.3em !important;
	cursor: pointer;
	transition: color 0.2s ease, border-color 0.2s ease;
}

.comment-respond input[type="submit"]:hover,
.comment-respond .wp-block-button__link:hover {
	color: #c9968e !important;
	border-color: #c9968e !important;
	background: transparent !important;
}

@media (prefers-reduced-motion: reduce) {
	.comment-respond input[type="submit"],
	.comment-respond textarea,
	.comment-respond input,
	#cancel-comment-reply-link,
	.wp-block-comment-reply-link a { transition: none; }
}

/* --- Akismet privacy notice: renders outside #respond, so it needs
       its own rule or it inherits full 19px body size --- */
.akismet_comment_form_privacy_notice {
	font-family: var(--wp--preset--font-family--albert-sans), sans-serif !important;
	font-size: 0.72rem !important;
	font-weight: 400 !important;
	line-height: 1.65 !important;
	color: #a8a5a0 !important;
	margin: 1.25rem 0 0 !important;
}

.akismet_comment_form_privacy_notice a {
	color: inherit !important;
	text-decoration-color: rgba(17, 17, 17, 0.25);
	text-underline-offset: 0.18em;
}

.akismet_comment_form_privacy_notice a:hover {
	color: #c9968e !important;
	text-decoration-color: #c9968e;
}


/* --- Post navigation (prev/next between the hatched rules) ---------
   The homepage pagination rule above also matches this nav (same block),
   which squashed its top gap to 24px while the bottom kept the theme's
   2em. Restore symmetry.                                              */
.wp-block-query-pagination:has(.wp-block-post-navigation-link) {
	margin-top: 2em !important;
	margin-bottom: 0 !important;
}

/* --- Safety net: CoBlocks hides elements at opacity:0 in CSS and
       relies on JS to reveal them. If that JS never fires the content
       is invisible. Keep everything visible by default.              --- */
.coblocks-animate {
	opacity: 1 !important;
}