/* =====================================================================
   mol-theme — layout & component styles
   Tokens and base live in style.css. Component styles live here.
   ===================================================================== */

/* ---------- Site header (carbon bar, reversed lockup) ---------- */
.mol-site-header {
	background: var(--mol-carbon);
	color: var(--mol-chalk);
	border-bottom: 1px solid rgba(197, 202, 210, 0.18); /* steel, faint */
}
.mol-site-header__inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1.5rem;
	padding-block: 1rem;
}
.mol-logo { display: inline-flex; }
.mol-logo__img {
	width: clamp(160px, 26vw, 240px);
	height: auto;
}
.mol-logo__img--footer { width: clamp(160px, 30vw, 220px); }

/* ---------- Primary nav (Inter) ---------- */
.mol-primary-nav .mol-menu {
	display: flex;
	align-items: center;
	gap: clamp(1rem, 2.5vw, 2.25rem);
	list-style: none;
	margin: 0;
	padding: 0;
}
.mol-menu__link,
.mol-primary-nav a {
	font-family: var(--mol-font-body);
	font-weight: 500;
	font-size: 0.95rem;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: var(--mol-chalk);
	text-decoration: none;
	padding-block: 0.25rem;
	border-bottom: 2px solid transparent;
	transition: color 0.15s ease, border-color 0.15s ease;
}
.mol-menu__link:hover,
.mol-menu__link:focus,
.mol-primary-nav a:hover,
.mol-primary-nav a:focus {
	color: var(--mol-ember);
	border-bottom-color: var(--mol-ember);
	text-decoration: none;
}

/* Dropdown submenus */
.mol-menu .menu-item-has-children { position: relative; }
.mol-menu .menu-item-has-children > a::after {
	content: "\2335";
	margin-left: 0.35rem;
	font-size: 0.7em;
	opacity: 0.7;
}
.mol-menu .sub-menu {
	position: absolute;
	top: 100%;
	left: 0;
	min-width: 230px;
	list-style: none;
	margin: 0;
	padding: 0.4rem 0;
	background: var(--mol-graphite);
	border: 1px solid rgba(197, 202, 210, 0.12);
	border-radius: 8px;
	opacity: 0;
	visibility: hidden;
	transform: translateY(6px);
	transition: opacity 0.15s ease, transform 0.15s ease, visibility 0.15s ease;
	z-index: 50;
}
.mol-menu .menu-item-has-children:hover > .sub-menu,
.mol-menu .menu-item-has-children:focus-within > .sub-menu {
	opacity: 1;
	visibility: visible;
	transform: translateY(0);
}
.mol-menu .sub-menu li { width: 100%; }
.mol-menu .sub-menu a {
	display: block;
	padding: 0.6rem 1.2rem;
	font-size: 0.82rem;
	letter-spacing: 0.03em;
	border-bottom: 0;
}
.mol-menu .sub-menu a:hover,
.mol-menu .sub-menu a:focus { background: var(--mol-ember); color: var(--mol-chalk); }

/* Nav toggle (mobile) */
.mol-nav-toggle {
	display: none;
	position: relative;
	width: 44px;
	height: 44px;
	background: transparent;
	border: 1px solid var(--mol-steel);
	border-radius: var(--mol-radius);
	cursor: pointer;
}
.mol-nav-toggle__bar,
.mol-nav-toggle__bar::before,
.mol-nav-toggle__bar::after {
	position: absolute;
	left: 50%;
	width: 22px;
	height: 2px;
	background: var(--mol-chalk);
	transform: translateX(-50%);
	transition: transform 0.2s ease, opacity 0.2s ease;
}
.mol-nav-toggle__bar { top: 50%; margin-top: -1px; }
.mol-nav-toggle__bar::before { content: ""; top: -7px; }
.mol-nav-toggle__bar::after  { content: ""; top: 7px; }
.mol-nav-toggle[aria-expanded="true"] .mol-nav-toggle__bar { background: transparent; }
.mol-nav-toggle[aria-expanded="true"] .mol-nav-toggle__bar::before { top: 0; transform: translateX(-50%) rotate(45deg); }
.mol-nav-toggle[aria-expanded="true"] .mol-nav-toggle__bar::after  { top: 0; transform: translateX(-50%) rotate(-45deg); }

@media (max-width: 800px) {
	.mol-nav-toggle { display: block; }
	.mol-primary-nav {
		display: none;
		position: absolute;
		left: 0;
		right: 0;
		top: 100%;
		background: var(--mol-graphite);
		border-bottom: 1px solid rgba(197, 202, 210, 0.18);
		z-index: 50;
	}
	.mol-site-header { position: relative; }
	.mol-primary-nav.is-open { display: block; }
	.mol-primary-nav .mol-menu {
		flex-direction: column;
		align-items: flex-start;
		gap: 0;
		padding: var(--mol-gutter);
	}
	.mol-primary-nav .mol-menu__item { width: 100%; }
	.mol-primary-nav .mol-menu__link { display: block; width: 100%; padding-block: 0.75rem; }
	/* Submenus stack inline within the mobile panel, no floating dropdown. */
	.mol-menu .sub-menu {
		position: static;
		opacity: 1;
		visibility: visible;
		transform: none;
		min-width: 0;
		background: transparent;
		border: 0;
		padding: 0 0 0 1rem;
	}
	.mol-menu .menu-item-has-children > a::after { display: none; }
}

/* ---------- Site footer ---------- */
.mol-site-footer { color: var(--mol-ash); }
.mol-site-footer__top {
	display: grid;
	gap: clamp(1.5rem, 4vw, 2.5rem); align-items: start;
	padding-top: 4rem;
}
.mol-site-footer__top--cols-3 { grid-template-columns: minmax(0, 1.8fr) minmax(0, 1fr) minmax(0, 1fr); }
.mol-site-footer__top--cols-4 { grid-template-columns: minmax(0, 1.6fr) repeat(3, minmax(0, 1fr)); }
.mol-site-footer__top > * { min-width: 0; }
.mol-site-footer__tagline { color: var(--mol-steel); max-width: 42ch; margin-top: 1.1rem; line-height: 1.6; }
.mol-footer-col__title {
	font-family: var(--mol-font-body); font-size: 0.8rem; font-weight: 500;
	letter-spacing: 0.08em; text-transform: uppercase; color: var(--mol-steel); margin: 0 0 0.9rem;
}
.mol-footer-links { list-style: none; margin: 0; padding: 0; }
.mol-footer-links a {
	font-family: var(--mol-font-body); font-weight: 500; font-size: 0.9rem;
	color: var(--mol-steel); line-height: 2;
}
.mol-footer-links a:hover { color: var(--mol-chalk); }
.mol-social { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 0.4rem; }
.mol-social__link {
	font-family: var(--mol-font-body); font-weight: 500; font-size: 0.9rem; color: var(--mol-steel);
}
.mol-social__link:hover { color: var(--mol-chalk); }

.mol-site-footer__bottom {
	display: flex; flex-wrap: wrap; gap: 0.5rem 1.5rem;
	justify-content: space-between; align-items: center;
	margin-top: 2rem;
	padding-top: 1.4rem;
	padding-bottom: 2.5rem;
	border-top: 1px solid rgba(197, 202, 210, 0.15);
	font-size: 0.85rem;
}
.mol-site-footer__legal { display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem 1.25rem; }
.mol-site-footer__copy { margin: 0; color: var(--mol-ash); }
.mol-footer-menu { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 0.5rem 1.25rem; }
.mol-footer-menu a { font-family: var(--mol-font-body); font-weight: 500; color: var(--mol-steel); }
.mol-footer-menu a:hover { color: var(--mol-chalk); }
.mol-site-footer__disclosure { margin: 0; color: var(--mol-ash); max-width: 48ch; }
.mol-site-footer__disclosure a { color: var(--mol-steel); text-decoration: underline; }
.mol-site-footer__disclosure a:hover { color: var(--mol-ember); }
@media (max-width: 900px) {
	.mol-site-footer__top--cols-3,
	.mol-site-footer__top--cols-4 { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
	.mol-site-footer__brand { grid-column: 1 / -1; }
}
@media (max-width: 520px) {
	.mol-site-footer__top--cols-3,
	.mol-site-footer__top--cols-4 { grid-template-columns: minmax(0, 1fr); }
	.mol-site-footer__brand { grid-column: auto; }
}

/* ---------- Section header (eyebrow + title + view-all) ---------- */
.mol-section-header {
	display: flex; flex-wrap: wrap; align-items: end; justify-content: space-between;
	gap: 0.75rem 1.5rem; margin-bottom: clamp(1.5rem, 4vw, 2.5rem);
}
.mol-section-header__eyebrow {
	font-family: var(--mol-font-body); font-weight: 500; font-size: 0.8rem;
	letter-spacing: 0.12em; text-transform: uppercase; color: var(--mol-ember);
	margin: 0 0 0.35rem;
}
.mol-section-header__title { font-size: clamp(1.6rem, 4vw, 2.5rem); font-weight: 800; margin: 0; }
.mol-section-header__link {
	font-family: var(--mol-font-body); font-weight: 500; font-size: 0.95rem;
	color: var(--mol-ember); white-space: nowrap;
}
.mol-section--carbon .mol-section-header__link,
.mol-section--graphite .mol-section-header__link { color: var(--mol-steel); }
.mol-section--carbon .mol-section-header__link:hover,
.mol-section--graphite .mol-section-header__link:hover { color: var(--mol-ember); }

/* ---------- Hero ---------- */
.mol-hero { position: relative; overflow: hidden; }
.mol-hero__inner {
	position: relative; z-index: 2;
	padding-block: clamp(4rem, 9vw, 7rem);
	display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 0.85fr);
	gap: 3rem; align-items: center;
}
.mol-hero__inner > * { min-width: 0; }
.mol-hero--has-image::before {
	content: ""; position: absolute; inset: 0; z-index: 0;
	background-image: var(--mol-hero-img); background-size: cover; background-position: center;
	opacity: 0.5;
}
.mol-hero--has-image::after {
	content: ""; position: absolute; inset: 0; z-index: 1;
	background: linear-gradient(90deg, var(--mol-carbon) 10%, rgba(20,21,26,0.55) 100%);
}
.mol-hero__eyebrow {
	font-family: var(--mol-font-body); font-weight: 500; font-size: 0.8rem;
	letter-spacing: 0.16em; text-transform: uppercase; color: var(--mol-ash); margin: 0 0 1rem;
}
.mol-hero__title { font-size: clamp(3rem, 7vw, 6.5rem); font-weight: 900; line-height: 0.9; margin: 0.25em 0; text-transform: uppercase; }
.mol-hero__lede { color: var(--mol-steel); font-size: clamp(1.05rem, 2vw, 1.2rem); line-height: 1.6; max-width: 44ch; margin: 1.25rem 0 0; }
.mol-hero__cta { margin-top: 1.75rem; }
.mol-hero__media { position: relative; display: flex; justify-content: center; }
.mol-hero__mark { width: clamp(160px, 22vw, 260px); height: auto; opacity: 0.12; }
@media (max-width: 820px) {
	.mol-hero__inner { grid-template-columns: minmax(0, 1fr); }
	.mol-hero__media { display: none; }
}

/* ---------- Cards ---------- */
.mol-card__media { display: block; }
.mol-card__media img { width: 100%; aspect-ratio: 16 / 10; object-fit: cover; border-radius: var(--mol-radius); }
.mol-card__body { padding-top: 0.85rem; }
.mol-card__kicker {
	font-family: var(--mol-font-body); font-weight: 500; font-size: 0.75rem;
	letter-spacing: 0.1em; text-transform: uppercase; color: var(--mol-ember);
}
.mol-card__title { font-size: 1.2rem; font-weight: 700; line-height: 1.18; margin: 0.4rem 0; }
.mol-card__title a { color: var(--mol-carbon); }
.mol-section--carbon .mol-card__title a,
.mol-section--graphite .mol-card__title a { color: var(--mol-chalk); }
.mol-card__title a:hover { color: var(--mol-ember); text-decoration: none; }
.mol-card__excerpt { color: var(--mol-ash); font-size: 0.95rem; margin: 0.4rem 0; }
.mol-card__meta { color: var(--mol-ash); font-size: 0.8rem; font-family: var(--mol-font-body); margin: 0.5rem 0 0; }

/* Featured card: media + body side by side on wide screens. */
.mol-card--featured { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); gap: clamp(1.25rem, 3vw, 2.5rem); align-items: center; }
.mol-card--featured > * { min-width: 0; }
.mol-card--featured .mol-card__media img { aspect-ratio: 16 / 9; }
.mol-card--featured .mol-card__title { font-size: clamp(1.5rem, 3vw, 2.25rem); font-weight: 800; }
@media (max-width: 800px) { .mol-card--featured { grid-template-columns: minmax(0, 1fr); } }

/* ---------- Browse by topic (6 cards: 5 categories + EMF) ---------- */
.mol-topic-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: clamp(0.75rem, 2vw, 1.25rem);
}
.mol-topic-grid > * { min-width: 0; }
.mol-topic {
	display: flex; flex-direction: column; gap: 0.6rem; justify-content: space-between;
	min-height: 9rem; padding: clamp(1rem, 2vw, 1.4rem);
	background: var(--mol-carbon); border: 1px solid rgba(197, 202, 210, 0.16);
	border-radius: var(--mol-radius); text-decoration: none;
	transition: border-color 0.15s ease, transform 0.15s ease;
}
.mol-topic:hover { border-color: var(--mol-ember); transform: translateY(-2px); text-decoration: none; }
.mol-topic__name { font-size: clamp(1.1rem, 2vw, 1.5rem); font-weight: 800; color: var(--mol-chalk); }
.mol-topic:hover .mol-topic__name { color: var(--mol-ember); }
.mol-topic__meta {
	font-family: var(--mol-font-body); font-weight: 500; font-size: 0.78rem;
	letter-spacing: 0.06em; text-transform: uppercase; color: var(--mol-ash);
}
/* EMF card: ember border to signal it is a distinct, keyword-driven hub. */
.mol-topic--emf { border-color: var(--mol-ember); }
.mol-topic--emf .mol-topic__name { color: var(--mol-ember); }
@media (max-width: 600px) { .mol-topic-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 400px) { .mol-topic-grid { grid-template-columns: minmax(0, 1fr); } }

/* ---------- Mission teaser ---------- */
.mol-mission-teaser__inner { max-width: 720px; }
.mol-mission-teaser__eyebrow {
	font-family: var(--mol-font-body); font-weight: 500; font-size: 0.8rem;
	letter-spacing: 0.14em; text-transform: uppercase; color: var(--mol-ember); margin: 0 0 0.6rem;
}
.mol-mission-teaser__title { font-size: clamp(1.6rem, 4vw, 2.5rem); font-weight: 800; margin: 0 0 0.75rem; }
.mol-mission-teaser__lede { color: var(--mol-steel); margin: 0 0 1.5rem; }

/* ---------- Aires block (lean, left-aligned, CLP-style) ---------- */
/* Feature band gets real top and bottom padding so it reads as deliberate. */
.mol-aires--feature { padding-block: clamp(4.5rem, 8vw, 7rem); }
.mol-aires__inner { max-width: 640px; }
.mol-aires--feature .mol-aires__inner { max-width: var(--mol-maxw); }
.mol-aires--feature .mol-aires__lead,
.mol-aires--feature .mol-aires__benefit { max-width: 60ch; }
.mol-aires__kicker {
	font-family: var(--mol-font-body); font-weight: 500; font-size: 0.8rem;
	letter-spacing: 0.14em; text-transform: uppercase; color: var(--mol-ember); margin: 0 0 1.5rem;
}
.mol-aires__title { font-size: clamp(1.8rem, 4.5vw, 2.75rem); font-weight: 900; margin: 0 0 1.6rem; }
.mol-aires__lead { color: var(--mol-chalk); font-size: clamp(1.05rem, 2vw, 1.2rem); margin: 0 0 1.1rem; }
.mol-aires__benefit { color: var(--mol-steel); margin: 0 0 2.1rem; }
.mol-aires__cta { display: inline-flex; align-items: center; gap: 0.4em; }
.mol-aires__microcopy {
	font-family: var(--mol-font-body); font-size: 0.85rem; color: var(--mol-steel);
	margin: 1.4rem 0 0;
}
.mol-aires__disclosure { color: var(--mol-ash); font-size: 0.8rem; margin: 1.1rem 0 0; max-width: 52ch; }

/* In-article variant: contained card with an ember edge. */
.mol-aires--inline {
	padding: clamp(1.25rem, 3vw, 1.75rem);
	border-radius: var(--mol-radius);
	border-left: 4px solid var(--mol-ember);
}
.mol-aires--inline .mol-aires__title { font-size: 1.5rem; font-weight: 800; }

/* ---------- Email capture ---------- */
.mol-email-capture { background: var(--mol-chalk); border-top: 1px solid var(--mol-border); border-bottom: 1px solid var(--mol-border); }
.mol-email-capture__inner { max-width: 640px; text-align: center; margin-inline: auto; }
.mol-email-capture__title { font-size: clamp(1.6rem, 4vw, 2.5rem); font-weight: 800; margin: 0 0 0.5rem; }
.mol-email-capture__lede { color: var(--mol-ash); margin: 0 0 1.5rem; }
.mol-email-capture__note { color: var(--mol-ash); font-size: 0.8rem; margin: 0.85rem 0 0; }

/* ---------- Brevo form (shared: popup + inline) ---------- */
.mol-brevo-form { display: flex; flex-wrap: wrap; gap: 0.5rem; }
.mol-brevo-form input[type="email"] {
	flex: 1 1 220px; min-width: 0; padding: 0.9em 1em;
	font-family: var(--mol-font-body); font-size: 1rem;
	border: 1px solid var(--mol-border); border-radius: var(--mol-radius); background: #fff; color: var(--mol-ink);
}
.mol-brevo-form input[type="email"]:focus-visible { border-color: var(--mol-ember); }
.mol-brevo-form .mol-btn { flex: 0 0 auto; }
.mol-brevo-form__msg { flex: 1 0 100%; margin: 0.5rem 0 0; font-size: 0.9rem; color: var(--mol-ash); }
.mol-brevo-form__msg:empty { margin: 0; }
.mol-brevo-form__msg.is-success { color: #1d7a3a; font-weight: 500; }
.mol-section--carbon .mol-brevo-form__msg,
.mol-section--graphite .mol-brevo-form__msg { color: var(--mol-steel); }
.mol-email-capture .mol-brevo-form { justify-content: center; }

/* ---------- Archive header ---------- */
.mol-archive-header { margin-bottom: clamp(1.5rem, 4vw, 2.5rem); }
.mol-archive-header__eyebrow {
	font-family: var(--mol-font-body); font-weight: 500; font-size: 0.8rem;
	letter-spacing: 0.12em; text-transform: uppercase; color: var(--mol-ember); margin: 0 0 0.4rem;
}
.mol-archive-header__title { font-size: clamp(1.8rem, 5vw, 3rem); font-weight: 800; margin: 0; }
.mol-archive-header__desc { color: var(--mol-ash); margin-top: 0.75rem; max-width: 60ch; }
.mol-empty { color: var(--mol-ash); }

/* ---------- Single / page ---------- */
.mol-single__header-inner, .mol-page__header .mol-container { padding-block: clamp(2.5rem, 6vw, 4rem); }
.mol-single__kicker {
	font-family: var(--mol-font-body); font-weight: 500; font-size: 0.8rem;
	letter-spacing: 0.1em; text-transform: uppercase; color: var(--mol-ember);
}
.mol-single__title, .mol-page__title { font-size: clamp(2rem, 6vw, 3.5rem); font-weight: 900; margin: 0.5rem 0; max-width: 22ch; }
.mol-single__meta { color: var(--mol-steel); font-family: var(--mol-font-body); font-size: 0.95rem; margin: 0.5rem 0 0; }
.mol-single__meta .mol-single__author { font-weight: 500; }
.mol-single__media { margin: 0; }
.mol-single__media .mol-container { padding-top: clamp(1.5rem, 4vw, 2.5rem); }
.mol-single__media img { width: 100%; border-radius: var(--mol-radius); }
.mol-single__caption, .mol-page__media + * { color: var(--mol-ash); font-size: 0.85rem; margin-top: 0.5rem; }
.mol-single__body { max-width: 70ch; }
.mol-page__media { margin: 0 0 2rem; }
.mol-page__media img { width: 100%; border-radius: var(--mol-radius); }

/* Prose — article body in Inter, sentence case. */
.mol-prose { font-size: 1.15rem; line-height: 1.7; }
.mol-prose > * + * { margin-top: 1.4em; }
.mol-prose h2 { font-size: clamp(1.5rem, 3vw, 2rem); font-weight: 800; margin-top: 2em; }
.mol-prose h3 { font-size: 1.35rem; font-weight: 700; margin-top: 1.75em; }
.mol-prose a { text-decoration: underline; text-underline-offset: 2px; }
.mol-prose img { border-radius: var(--mol-radius); }
.mol-prose blockquote {
	margin: 1.5em 0; padding: 0.5em 0 0.5em 1.25em;
	border-left: 3px solid var(--mol-ember); color: var(--mol-carbon); font-style: italic;
}
.mol-prose code { background: rgba(20,21,26,0.06); padding: 0.15em 0.4em; border-radius: 3px; font-size: 0.9em; }
.mol-prose pre { background: var(--mol-carbon); color: var(--mol-chalk); padding: 1.25em; border-radius: var(--mol-radius); overflow: auto; }
.mol-prose pre code { background: none; padding: 0; }

.mol-single__tags { margin-top: 2rem; display: flex; flex-wrap: wrap; gap: 0.5rem; }
.mol-single__tags a {
	font-family: var(--mol-font-body); font-size: 0.85rem; font-weight: 500;
	padding: 0.3em 0.7em; border: 1px solid var(--mol-border); border-radius: 999px; color: var(--mol-ink);
}
.mol-single__tags a:hover { border-color: var(--mol-ember); color: var(--mol-ember); text-decoration: none; }

/* In-article Aires block sits inside prose width. */
.mol-single__body .mol-aires--inline { margin: 2.5rem 0; }

/* ---------- Brand / Mission page utilities ---------- */
/* Ember pull-quote for a core mission line. Add class "mol-pullquote" to a
   blockquote, or use the [mol_pullquote] shortcode. */
.mol-pullquote {
	border: 0; padding: 0; margin: 2rem 0;
	font-family: var(--mol-font-display); font-weight: 800; font-style: normal;
	font-size: clamp(1.5rem, 3.5vw, 2.25rem); line-height: 1.2; color: var(--mol-ember);
}
/* Three-up values row. */
.mol-values { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(1rem, 3vw, 2rem); margin: 2.5rem 0; }
.mol-values > * { min-width: 0; }
.mol-value__title { font-family: var(--mol-font-display); font-weight: 800; font-size: 1.2rem; margin: 0 0 0.4rem; }
.mol-value__text { color: var(--mol-ash); margin: 0; font-size: 0.98rem; }
@media (max-width: 700px) { .mol-values { grid-template-columns: minmax(0, 1fr); } }

/* Closing CTA band (Brand Page template). */
.mol-page-cta { text-align: center; }
.mol-page-cta__title { font-size: clamp(1.5rem, 4vw, 2.25rem); font-weight: 800; margin: 0 0 1.25rem; }

/* Author bio */
.mol-author-bio {
	display: flex; gap: 1rem; align-items: start;
	margin-top: 2.5rem; padding: 1.5rem;
	background: var(--mol-chalk); border: 1px solid var(--mol-border); border-radius: var(--mol-radius);
}
.mol-author-bio__avatar { border-radius: 50%; flex: 0 0 auto; }
.mol-author-bio__name { font-family: var(--mol-font-display); font-weight: 700; margin: 0 0 0.25rem; }
.mol-author-bio__desc { color: var(--mol-ash); margin: 0; font-size: 0.95rem; }

/* Post navigation */
.mol-post-nav { border-top: 1px solid var(--mol-border); }
.mol-post-nav__inner {
	display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 1rem;
	padding-block: clamp(1.5rem, 4vw, 2.5rem);
}
.mol-post-nav__inner > * { min-width: 0; }
.mol-post-nav__link { display: flex; flex-direction: column; gap: 0.25rem; font-weight: 700; color: var(--mol-carbon); }
.mol-post-nav__link span { font-family: var(--mol-font-body); font-weight: 500; font-size: 0.8rem; color: var(--mol-ember); text-transform: uppercase; letter-spacing: 0.08em; }
.mol-post-nav__link--next { text-align: right; }
.mol-post-nav__link:hover { color: var(--mol-ember); text-decoration: none; }
@media (max-width: 600px) { .mol-post-nav__inner { grid-template-columns: minmax(0, 1fr); } .mol-post-nav__link--next { text-align: left; } }

/* ---------- 404 ---------- */
.mol-404__inner { max-width: 640px; padding-block: clamp(3rem, 8vw, 6rem); }
.mol-404__code { font-size: clamp(3rem, 12vw, 7rem); font-weight: 900; color: var(--mol-ember); line-height: 1; margin: 0; }
.mol-404__title { font-size: clamp(1.8rem, 5vw, 3rem); font-weight: 800; margin: 0.5rem 0; }
.mol-404__lede { color: var(--mol-steel); margin: 0 0 1.5rem; }
.mol-404__search { margin-bottom: 1.5rem; }

/* ---------- Search form ---------- */
.mol-search-form { display: flex; gap: 0.5rem; flex-wrap: wrap; }
.mol-search-form__input {
	flex: 1 1 240px; min-width: 0; padding: 0.8em 1em;
	font-family: var(--mol-font-body); font-size: 1rem;
	border: 1px solid var(--mol-border); border-radius: var(--mol-radius); background: #fff; color: var(--mol-ink);
}
.mol-section--carbon .mol-search-form__input { background: var(--mol-graphite); border-color: rgba(197,202,210,0.3); color: var(--mol-chalk); }
.mol-search-again { margin-top: 2rem; max-width: 480px; }

/* ---------- Comments ---------- */
.mol-comments { margin-top: 3rem; }
.mol-comments__title { font-size: 1.5rem; font-weight: 800; }
.mol-comments__list { list-style: none; margin: 0 0 2rem; padding: 0; }
.mol-comments__list ol { list-style: none; padding-left: 1.5rem; }
.mol-comments__list .comment-body { padding: 1rem 0; border-bottom: 1px solid var(--mol-border); }

/* ---------- Pagination ---------- */
.mol-pagination { margin-top: clamp(2rem, 5vw, 3rem); }
.mol-pagination .page-numbers {
	display: inline-block; padding: 0.5em 0.9em; margin: 0 0.2em;
	font-family: var(--mol-font-body); font-weight: 500;
	border: 1px solid var(--mol-border); border-radius: var(--mol-radius); color: var(--mol-ink);
}
.mol-pagination .page-numbers.current { background: var(--mol-ember); color: var(--mol-chalk); border-color: var(--mol-ember); }
.mol-pagination a.page-numbers:hover { border-color: var(--mol-ember); text-decoration: none; }
