/* Blog design system — scoped .nc-blog. Tokens mirror README.md. Components added per phase. */
.nc-blog { --navy:#1F3864; --navy-deep:#16233b; --lightblue:#E8EDF5; --ink:#16233b; --muted:#5a6272;
  --body:#3a4250; --hair:#eceef2; --border:#d8dde6; --zebra:#F7F9FE;
  --f-head:'Plus Jakarta Sans',system-ui,sans-serif; --f-body:'Hanken Grotesk',system-ui,sans-serif; }
.nc-blog { font-family:var(--f-body); color:var(--body); }
.nc-blog__wrap { max-width:1200px; margin:0 auto; padding:0 clamp(18px,4vw,48px); }
/* WordPress emoji reset — core emoji CSS is dequeued by style isolation, so keep
   emoji <img> at inline text size instead of their natural (huge) intrinsic size. */
.nc-blog img.emoji { display:inline; height:1em; width:1em; margin:0 .07em; vertical-align:-0.1em; background:none; border:none; box-shadow:none; padding:0; }
/* Tronix FAQ (Bootstrap accordion): the active/first item's <button> is rendered with a
   stray `collapse` class, so Bootstrap's `.collapse:not(.show){display:none}` hides the
   question and leaves its answer floating alone. Force the accordion button visible. */
.nc-blog .accordion-button.collapse { display: flex; }
/* =============================================================
   Phase 2: Archive partials — card, hero+chips, subscribe band
   ============================================================= */

/* --- nc-bl-card (Task 2.1) ---------------------------------- */
.nc-blog .nc-bl-card {
	text-decoration: none;
	display: flex;
	flex-direction: column;
	border: 1px solid var(--border);
	border-radius: 14px;
	overflow: hidden;
	background: #fff;
	transition: border-color 0.18s, box-shadow 0.18s, transform 0.18s;
	color: var(--body);
}
.nc-blog .nc-bl-card:hover {
	border-color: var(--c);
	box-shadow: 0 16px 38px var(--sh);
	transform: translateY(-4px);
}

/* media area */
.nc-blog .nc-bl-card__media {
	position: relative;
	height: 170px;
	flex: none;
	display: block;
	overflow: hidden;
	background: var(--tint);
}
.nc-blog .nc-bl-card__img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
	display: block;
}
/* fallback tile: full-area tinted slab, glyph centred */
.nc-blog .nc-bl-card__fallback {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 100%;
}

/* card body */
.nc-blog .nc-bl-card__body {
	padding: 22px 24px 24px;
	display: flex;
	flex-direction: column;
	flex: 1;
}

/* category label */
.nc-blog .nc-bl-card__cat {
	display: block;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	margin-bottom: 10px;
	/* color set inline via style="color:var(--c)" */
}

/* title */
.nc-blog .nc-bl-card__title {
	font-family: var(--f-head);
	font-weight: 700;
	font-size: 17px;
	letter-spacing: -0.015em;
	line-height: 1.3;
	margin: 0 0 10px;
	color: var(--ink);
}

/* excerpt */
.nc-blog .nc-bl-card__excerpt {
	font-size: 14px;
	line-height: 1.55;
	color: var(--muted);
	margin: 0 0 18px;
	flex: 1;
}

/* footer row */
.nc-blog .nc-bl-card__foot {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
}
.nc-blog .nc-bl-card__meta {
	font-size: 12.5px;
	color: #7a818e;
}
.nc-blog .nc-bl-card__more {
	font-size: 12.5px;
	font-weight: 700;
	color: var(--navy);
	white-space: nowrap;
}

/* --- nc-bl-hero + nc-bl-chips (Task 2.2) -------------------- */
.nc-blog .nc-bl-hero {
	position: relative;
	overflow: hidden;
	background:
		radial-gradient(900px 520px at 6% -12%, rgba(123,97,255,0.10), transparent 62%),
		radial-gradient(840px 520px at 99% -4%, rgba(15,179,165,0.10), transparent 60%),
		linear-gradient(180deg, #F7F9FE, #ffffff 74%);
	padding: clamp(44px, 6vw, 80px) 0 clamp(30px, 4vw, 48px);
}
.nc-blog .nc-bl-hero__bg {
	position: absolute;
	inset: 0;
	opacity: 0.6;
	pointer-events: none;
}
.nc-blog .nc-bl-hero__bg svg {
	width: 100%;
	height: 100%;
	display: block;
}

/* "Insights" pill */
.nc-blog .nc-bl-hero__pill {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-size: 12.5px;
	font-weight: 600;
	letter-spacing: 0.04em;
	color: var(--navy);
	background: var(--lightblue);
	padding: 7px 14px;
	border-radius: 999px;
	margin-bottom: 22px;
	white-space: nowrap;
}
.nc-blog .nc-bl-hero__pill::before {
	content: '';
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: var(--navy);
	flex: none;
}

/* H1 */
.nc-blog .nc-bl-hero__h1 {
	font-family: var(--f-head);
	font-weight: 800;
	font-size: clamp(32px, 4.6vw, 56px);
	line-height: 1.05;
	letter-spacing: -0.03em;
	margin: 0;
	color: var(--navy-deep, #16233b);
	text-wrap: balance;
}

/* dek */
.nc-blog .nc-bl-hero__dek {
	font-size: clamp(15.5px, 1.5vw, 19px);
	line-height: 1.6;
	color: #555;
	margin: 18px 0 0;
	max-width: 62ch;
}

/* chip nav */
.nc-blog .nc-bl-chips {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin-top: 30px;
}
.nc-blog .nc-bl-chip {
	font-family: var(--f-head);
	font-size: 13px;
	font-weight: 700;
	padding: 9px 18px;
	border-radius: 999px;
	border: 1px solid var(--border);
	background: #fff;
	color: var(--body);
	text-decoration: none;
	transition: border-color 0.15s, color 0.15s, background 0.15s;
	white-space: nowrap;
}
.nc-blog .nc-bl-chip:hover {
	border-color: var(--navy);
	color: var(--navy);
}
.nc-blog .nc-bl-chip.is-active {
	border-color: var(--navy);
	background: var(--navy);
	color: #fff;
}


/* =============================================================
   Phase 2: Grid, featured card, pager (Tasks 2.4 + 2.5)
   ============================================================= */

/* --- Section wrappers --------------------------------------- */
.nc-blog .nc-bl-featuredwrap {
	padding: clamp(24px, 3vw, 40px) 0 clamp(28px, 3.5vw, 44px);
}
.nc-blog .nc-bl-gridwrap {
	padding: 0 0 clamp(48px, 6vw, 80px);
}

/* --- nc-bl-grid (3-col → 2-col → 1-col) -------------------- */
.nc-blog .nc-bl-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: clamp(16px, 2vw, 24px);
}
@media (max-width: 980px) {
	.nc-blog .nc-bl-grid {
		grid-template-columns: repeat(2, 1fr);
	}
}
@media (max-width: 640px) {
	.nc-blog .nc-bl-grid {
		grid-template-columns: 1fr;
	}
}

/* --- nc-bl-featured (large horizontal card) ----------------- */
.nc-blog .nc-bl-featured {
	text-decoration: none;
	display: grid;
	grid-template-columns: 0.95fr 1.05fr;
	gap: 0;
	background: #fff;
	border: 1px solid #e6e9ef;
	border-radius: 18px;
	overflow: hidden;
	box-shadow: 0 18px 50px rgba(31, 56, 100, 0.1);
	transition: box-shadow 0.18s, transform 0.18s;
	color: var(--body);
}
.nc-blog .nc-bl-featured:hover {
	box-shadow: 0 24px 60px rgba(31, 56, 100, 0.16);
	transform: translateY(-3px);
}

/* image column */
.nc-blog .nc-bl-featured__media {
	position: relative;
	min-height: 260px;
	display: block;
	overflow: hidden;
	background: var(--tint);
}
.nc-blog .nc-bl-featured__img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
	display: block;
}
/* Fallback tile (nc_blog_fallback_tile) is a <span> — make it fill */
.nc-blog .nc-bl-featured__media .nc-bl-card__fallback {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
}

/* "Featured" navy pill top-left */
.nc-blog .nc-bl-featured__pill {
	position: absolute;
	top: 16px;
	left: 16px;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: #fff;
	background: rgba(31, 56, 100, 0.92);
	padding: 6px 12px;
	border-radius: 999px;
	white-space: nowrap;
}

/* content column */
.nc-blog .nc-bl-featured__body {
	padding: clamp(26px, 3.4vw, 44px);
	display: flex;
	flex-direction: column;
	justify-content: center;
}

/* category pill */
.nc-blog .nc-bl-featured__cat {
	display: inline-flex;
	align-self: flex-start;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	padding: 5px 11px;
	border-radius: 999px;
	margin-bottom: 16px;
	/* color + background set inline */
}

/* H2 */
.nc-blog .nc-bl-featured__title {
	font-family: var(--f-head);
	font-weight: 800;
	font-size: clamp(22px, 2.6vw, 32px);
	letter-spacing: -0.025em;
	line-height: 1.15;
	margin: 0 0 14px;
	color: var(--ink);
}

/* excerpt */
.nc-blog .nc-bl-featured__excerpt {
	font-size: 15px;
	line-height: 1.6;
	color: #555;
	margin: 0 0 20px;
}

/* byline row */
.nc-blog .nc-bl-featured__byline {
	display: flex;
	align-items: center;
	gap: 10px;
	font-size: 13.5px;
	color: #7a818e;
	flex-wrap: wrap;
}
.nc-blog .nc-bl-featured__avatar {
	width: 30px;
	height: 30px;
	border-radius: 50%;
	background: var(--lightblue);
	color: var(--navy);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-family: var(--f-head);
	font-weight: 800;
	font-size: 12px;
	flex: none;
}
.nc-blog .nc-bl-featured__author {
	color: var(--body);
	font-weight: 600;
}
.nc-blog .nc-bl-featured__sep {
	color: #c5cbd6;
}

/* 1-col stacked on mobile */
@media (max-width: 720px) {
	.nc-blog .nc-bl-featured {
		grid-template-columns: 1fr;
	}
	.nc-blog .nc-bl-featured__media {
		min-height: 200px;
	}
}

/* --- nc-bl-pager -------------------------------------------- */
.nc-blog .nc-bl-pager {
	display: flex;
	align-items: center;
	justify-content: center;
	flex-wrap: wrap;
	gap: 8px;
	margin-top: clamp(32px, 4vw, 48px);
}

/* all page-number tiles */
.nc-blog .nc-bl-pager__tile {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 38px;
	height: 38px;
	border-radius: 10px;
	border: 1px solid var(--border);
	background: #fff;
	color: var(--body);
	font-family: var(--f-head);
	font-size: 14px;
	font-weight: 700;
	text-decoration: none;
	transition: border-color 0.15s, color 0.15s, background 0.15s;
}
.nc-blog .nc-bl-pager__tile:hover {
	border-color: var(--navy);
	color: var(--navy);
}
/* dots / ellipsis */
.nc-blog .nc-bl-pager__tile.dots {
	border-color: transparent;
	background: transparent;
	pointer-events: none;
	color: #7a818e;
	width: auto;
	padding: 0 4px;
}
/* current page */
.nc-blog .nc-bl-pager__tile.is-current {
	background: var(--navy);
	border-color: var(--navy);
	color: #fff;
	pointer-events: none;
}

/* "Next →" pill */
.nc-blog .nc-bl-pager__next {
	display: inline-flex;
	align-items: center;
	height: 38px;
	padding: 0 16px;
	border-radius: 10px;
	border: 1px solid var(--border);
	background: #fff;
	color: var(--body);
	font-family: var(--f-head);
	font-size: 14px;
	font-weight: 700;
	text-decoration: none;
	transition: border-color 0.15s, color 0.15s;
}
.nc-blog .nc-bl-pager__next:hover {
	border-color: var(--navy);
	color: var(--navy);
}

/* =============================================================
   Phase 3: Single-post partials (Tasks 3.1, 3.2, 3.3)
   ============================================================= */

/* ── nc-btn aliases (scoped under .nc-blog for toc + final CTA) */
.nc-blog .nc-btn {
	display: inline-block;
	font-family: var(--f-head);
	font-weight: 700;
	border-radius: 8px;
	cursor: pointer;
	transition: background 0.18s ease, color 0.18s ease;
	text-decoration: none;
	white-space: nowrap;
	border: none;
}
.nc-blog .nc-btn--navy {
	color: #fff;
	background: var(--navy);
	padding: 12px 22px;
	font-size: 14.5px;
	border-radius: 9px;
}
.nc-blog .nc-btn--navy:hover {
	background: #16294a;
	color: #fff;
}
.nc-blog .nc-btn--white {
	color: var(--navy);
	background: #fff;
	padding: 17px 36px;
	border-radius: 9px;
	font-size: 16px;
}
.nc-blog .nc-btn--white:hover {
	background: var(--lightblue);
	color: var(--navy);
}

/* ── Task 3.1: nc-bl-shero (single post hero, 2 variants) ------ */
.nc-blog .nc-bl-shero {
	position: relative;
	overflow: hidden;
	background:
		radial-gradient(900px 520px at 6% -12%, rgba(123,97,255,0.10), transparent 62%),
		radial-gradient(840px 520px at 99% -4%, rgba(15,179,165,0.10), transparent 60%),
		linear-gradient(180deg, #F7F9FE, #ffffff 74%);
	padding: clamp(36px, 5vw, 64px) 0 0;
}
/* Simple variant (no cover image) gets bottom padding + divider */
.nc-blog .nc-bl-shero--simple {
	padding-bottom: clamp(28px, 3.5vw, 44px);
	border-bottom: 1px solid #eceef2;
}
/* Essay variant bottom padding handled by the cover block below */
.nc-blog .nc-bl-shero--cover {
	padding-bottom: 0;
}

.nc-blog .nc-bl-shero__bg {
	position: absolute;
	inset: 0;
	opacity: 0.6;
	pointer-events: none;
}
.nc-blog .nc-bl-shero__bg svg {
	width: 100%;
	height: 100%;
	display: block;
}

.nc-blog .nc-bl-shero__in {
	position: relative;
	z-index: 1;
	max-width: 1200px;   /* same frame as .nc-bl-article so the hero left edge aligns with the body column */
	margin: 0 auto;
	padding: 0 clamp(18px, 4vw, 48px);
}
/* Hero heading + dek use a wide left-aligned measure (see rules below). */

/* Breadcrumb */
.nc-blog .nc-bl-shero__breadcrumb {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 6px;
	font-size: 13px;
	color: #7a818e;
	margin-bottom: 22px;
}
.nc-blog .nc-bl-shero__breadcrumb a {
	color: #7a818e;
	text-decoration: none;
}
.nc-blog .nc-bl-shero__breadcrumb a:hover {
	color: var(--navy);
}
.nc-blog .nc-bl-shero__breadcrumb-current {
	color: var(--navy);
	font-weight: 600;
}

/* Category pills */
.nc-blog .nc-bl-shero__pills {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin-bottom: 18px;
}
.nc-blog .nc-bl-shero__pill {
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	padding: 5px 11px;
	border-radius: 999px;
}

/* H1 */
.nc-blog .nc-bl-shero__h1 {
	font-family: var(--f-head);
	font-weight: 800;
	font-size: clamp(28px, 4vw, 48px);
	line-height: 1.08;
	letter-spacing: -0.03em;
	margin: 0 0 18px;
	color: #16233b;
	max-width: 1000px;
}

/* Dek */
.nc-blog .nc-bl-shero__dek {
	font-size: clamp(15.5px, 1.5vw, 19px);
	line-height: 1.6;
	color: #555;
	margin: 0 0 24px;
	max-width: 52rem;
	font-style: italic;
}

/* Byline */
.nc-blog .nc-bl-shero__byline {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px;
	font-size: 13.5px;
	color: #7a818e;
	padding-bottom: 28px;
}
.nc-blog .nc-bl-shero__avatar {
	width: 34px;
	height: 34px;
	border-radius: 50%;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-family: var(--f-head);
	font-weight: 800;
	font-size: 13px;
	flex: none;
}
.nc-blog .nc-bl-shero__author {
	color: #3a4250;
	font-weight: 600;
}
.nc-blog .nc-bl-shero__sep {
	color: #c5cbd6;
}

/* Cover image (essay variant) */
.nc-blog .nc-bl-shero__cover {
	margin-top: 0;
}
.nc-blog .nc-bl-shero__img {
	width: 100%;
	aspect-ratio: 1320 / 700;
	object-fit: cover;
	display: block;
	border-radius: 16px 16px 0 0;
	box-shadow: 0 24px 60px rgba(31, 56, 100, 0.18);
}

/* ── Task 3.2: nc-bl-rail / nc-bl-toc / nc-bl-bookcard ---------- */
.nc-blog .nc-bl-rail {
	position: sticky;
	top: 90px;
	display: flex;
	flex-direction: column;
	gap: 24px;
}

/* TOC nav */
.nc-blog .nc-bl-toc {
	display: flex;
	flex-direction: column;
}
.nc-blog .nc-bl-toc__h {
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: #5B7BB4;
	margin-bottom: 14px;
}
.nc-blog .nc-bl-toc ul {
	list-style: none;
	margin: 0;
	padding: 0;
	border-left: 2px solid #eceef2;
	padding-left: 16px;
	display: flex;
	flex-direction: column;
	gap: 10px;
}
.nc-blog .nc-bl-toc ul li {
	margin: 0;
	padding: 0;
}
.nc-blog .nc-bl-toc ul li a {
	font-size: 13.5px;
	line-height: 1.4;
	color: #5a6272;
	text-decoration: none;
	transition: color 0.15s;
}
.nc-blog .nc-bl-toc ul li a:hover {
	color: var(--navy);
}

/* Booking card */
.nc-blog .nc-bl-bookcard {
	background: #E8EDF5;
	border-radius: 12px;
	padding: 18px;
}
.nc-blog .nc-bl-bookcard__h {
	font-family: var(--f-head);
	font-weight: 700;
	font-size: 14px;
	color: #16233b;
	margin-bottom: 6px;
}
.nc-blog .nc-bl-bookcard p {
	font-size: 13px;
	line-height: 1.5;
	color: #5a6272;
	margin: 0 0 14px;
}

/* Rail: desktop-only — hide at ≤ 980px */
@media (max-width: 980px) {
	.nc-blog .nc-bl-rail {
		display: none;
	}
}

/* ── Task 3.3: nc-bl-tags / nc-bl-nav / nc-bl-related / nc-bl-final */

/* Tags */
.nc-blog .nc-bl-tags {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px;
	margin-top: clamp(32px, 4vw, 48px);
	padding-top: 24px;
	border-top: 1px solid #eceef2;
}
.nc-blog .nc-bl-tags__label {
	font-size: 13px;
	font-weight: 700;
	color: #7a818e;
}
.nc-blog .nc-bl-tags__pill {
	font-size: 12.5px;
	font-weight: 600;
	color: var(--navy);
	background: var(--lightblue);
	padding: 6px 13px;
	border-radius: 999px;
	text-decoration: none;
	transition: background 0.15s, color 0.15s;
}
.nc-blog .nc-bl-tags__pill:hover {
	background: var(--navy);
	color: #fff;
}

/* Prev / Next nav */
.nc-blog .nc-bl-nav {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 24px;
	margin-top: clamp(28px, 3vw, 40px);
}
.nc-blog .nc-bl-nav__card {
	display: flex;
	flex-direction: column;
	gap: 8px;
	text-decoration: none;
	border: 1px solid #e6e9ef;
	border-radius: 14px;
	padding: 20px 22px;
	transition: border-color 0.18s, box-shadow 0.18s;
}
.nc-blog .nc-bl-nav__card:hover {
	border-color: var(--navy);
	box-shadow: 0 12px 30px rgba(31, 56, 100, 0.12);
}
.nc-blog .nc-bl-nav__card--next {
	text-align: right;
}
.nc-blog .nc-bl-nav__label {
	display: block;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: #7a818e;
}
.nc-blog .nc-bl-nav__title {
	display: block;
	font-family: var(--f-head);
	font-weight: 700;
	font-size: 15px;
	line-height: 1.35;
	color: #16233b;
}
.nc-blog .nc-bl-nav__spacer {
	display: block;
}
@media (max-width: 640px) {
	.nc-blog .nc-bl-nav {
		grid-template-columns: 1fr;
	}
	.nc-blog .nc-bl-nav__card--next {
		text-align: left;
	}
}

/* Related posts band */
.nc-blog .nc-bl-related {
	background: var(--lightblue);
	padding: clamp(48px, 6vw, 80px) 0;
}
.nc-blog .nc-bl-related__in {
	max-width: 1200px;
	margin: 0 auto;
	padding: 0 clamp(18px, 4vw, 48px);
}
.nc-blog .nc-bl-related__head {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	justify-content: space-between;
	gap: 12px;
	margin-bottom: clamp(24px, 3vw, 36px);
}
.nc-blog .nc-bl-related__eyebrow {
	font-size: 12.5px;
	font-weight: 700;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: #5B7BB4;
	margin-bottom: 12px;
}
.nc-blog .nc-bl-related__h2 {
	font-family: var(--f-head);
	font-weight: 800;
	font-size: clamp(24px, 3vw, 36px);
	letter-spacing: -0.025em;
	margin: 0;
	color: #16233b;
}
.nc-blog .nc-bl-related__all {
	font-size: 14.5px;
	font-weight: 700;
	color: var(--navy);
	text-decoration: none;
	white-space: nowrap;
}
.nc-blog .nc-bl-related__all:hover {
	color: #16294a;
}
.nc-blog .nc-bl-related__grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: clamp(16px, 2vw, 24px);
}
@media (max-width: 980px) {
	.nc-blog .nc-bl-related__grid {
		grid-template-columns: repeat(2, 1fr);
	}
}
@media (max-width: 640px) {
	.nc-blog .nc-bl-related__grid {
		grid-template-columns: 1fr;
	}
}

/* Final CTA */
.nc-blog .nc-bl-final {
	background: var(--navy);
	color: #fff;
	padding: clamp(60px, 8vw, 110px) clamp(18px, 4vw, 48px);
	text-align: center;
	position: relative;
	overflow: hidden;
}
.nc-blog .nc-bl-final__bg {
	position: absolute;
	inset: 0;
	opacity: 0.5;
	pointer-events: none;
}
.nc-blog .nc-bl-final__bg svg {
	width: 100%;
	height: 100%;
	display: block;
}
.nc-blog .nc-bl-final__in {
	position: relative;
	z-index: 1;
	max-width: 760px;
	margin: 0 auto;
}
.nc-blog .nc-bl-final__h2 {
	font-family: var(--f-head);
	font-weight: 800;
	font-size: clamp(30px, 4.2vw, 52px);
	letter-spacing: -0.03em;
	line-height: 1.05;
	margin: 0;
	text-wrap: balance;
	color: #fff;
}
.nc-blog .nc-bl-final__p {
	font-size: clamp(16px, 1.6vw, 19px);
	line-height: 1.55;
	color: rgba(255, 255, 255, 0.82);
	margin: 20px auto 34px;
	max-width: 50ch;
}

/* =============================================================
   Phase 3: Task 3.4 — single.php article + rail grid
   ============================================================= */

/* Article body + TOC rail: 2-col layout, body first */
.nc-blog .nc-bl-article {
	max-width: 1200px;
	margin: 0 auto;
	display: grid;
	grid-template-columns: 1fr 240px;
	gap: clamp(32px, 4vw, 64px);
	padding: clamp(36px, 5vw, 64px) clamp(18px, 4vw, 48px) 0;
	align-items: start;
}
/* After-article band (tags + prev/next): same 1200px frame as the article, but a
   single column so the tags/nav line up with the reading column instead of the
   viewport edge. */
.nc-blog .nc-bl-article--after {
	grid-template-columns: 1fr;
	padding-top: 0;
	padding-bottom: clamp(40px, 5vw, 64px);
}

/* Article body column */
.nc-blog .nc-bl-article__body {
	max-width: 760px;
	min-width: 0; /* prevent grid blowout on long words / code */
}

/* Prose typography for the rendered post body */
.nc-blog .nc-blog-article {
	font-size: clamp(15.5px, 1.5vw, 17.5px);
	line-height: 1.72;
	color: var(--body);
}
.nc-blog .nc-blog-article h2,
.nc-blog .nc-blog-article h3,
.nc-blog .nc-blog-article h4 {
	font-family: var(--f-head);
	font-weight: 700;
	letter-spacing: -0.02em;
	line-height: 1.2;
	color: var(--ink);
	margin: 2em 0 0.6em;
}
.nc-blog .nc-blog-article h2 { font-size: clamp(20px, 2.2vw, 26px); }
.nc-blog .nc-blog-article h3 { font-size: clamp(17px, 1.8vw, 21px); }
.nc-blog .nc-blog-article h4 { font-size: clamp(15px, 1.5vw, 18px); }
.nc-blog .nc-blog-article p  { margin: 0 0 1.2em; }
.nc-blog .nc-blog-article ul,
.nc-blog .nc-blog-article ol {
	margin: 0 0 1.2em;
	padding-left: 1.5em;
}
.nc-blog .nc-blog-article li { margin-bottom: 0.4em; }
.nc-blog .nc-blog-article a  {
	color: var(--navy);
	text-underline-offset: 3px;
}
.nc-blog .nc-blog-article a:hover { color: #16294a; }
.nc-blog .nc-blog-article blockquote {
	margin: 1.6em 0;
	padding: 14px 22px;
	border-left: 4px solid var(--navy);
	background: var(--lightblue);
	border-radius: 0 8px 8px 0;
	font-style: italic;
	color: var(--ink);
}
.nc-blog .nc-blog-article code {
	font-size: 0.875em;
	background: var(--zebra);
	border: 1px solid var(--border);
	border-radius: 4px;
	padding: 2px 6px;
}
.nc-blog .nc-blog-article pre {
	background: #1e2635;
	color: #e8ecf4;
	border-radius: 10px;
	padding: 18px 22px;
	overflow-x: auto;
	margin: 1.6em 0;
	font-size: 14px;
	line-height: 1.55;
}
.nc-blog .nc-blog-article pre code {
	background: none;
	border: none;
	padding: 0;
	font-size: inherit;
	color: inherit;
}
.nc-blog .nc-blog-article img {
	max-width: 100%;
	height: auto;
	border-radius: 10px;
	display: block;
	margin: 1.6em 0;
}
.nc-blog .nc-blog-article hr {
	border: none;
	border-top: 1px solid var(--border);
	margin: 2.4em 0;
}
.nc-blog .nc-blog-article table {
	width: 100%;
	border-collapse: collapse;
	margin: 1.6em 0;
	font-size: 14.5px;
}
.nc-blog .nc-blog-article th,
.nc-blog .nc-blog-article td {
	border: 1px solid var(--border);
	padding: 10px 14px;
	text-align: left;
}
.nc-blog .nc-blog-article th {
	background: var(--zebra);
	font-family: var(--f-head);
	font-weight: 700;
	color: var(--ink);
}

/* Responsive: stack to 1-col + hide rail at ≤ 980px */
@media (max-width: 980px) {
	.nc-blog .nc-bl-article {
		grid-template-columns: 1fr;
	}
	.nc-blog .nc-bl-rail {
		display: none;
	}
}

/* ===================== Phase 4 — nc_blog_* article-body widget patterns ===================== */

/* ---- nc-bl-cta : mid-article CTA card (fixed navy gradient + white net overlay) ---- */
.nc-blog .nc-bl-cta {
	display: block;
	text-decoration: none;
	margin-top: clamp(36px, 4.5vw, 56px);
	position: relative;
	overflow: hidden;
	border-radius: 16px;
	background: linear-gradient(155deg, #1F3864 0%, #16233b 100%);
	padding: clamp(26px, 3.2vw, 38px);
	color: #fff;
	box-shadow: 0 20px 50px rgba(31,56,100,0.25);
}
.nc-blog .nc-bl-cta__net {
	position: absolute;
	inset: 0;
	opacity: 0.4;
}
.nc-blog .nc-bl-cta__row {
	position: relative;
	z-index: 1;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 18px;
}
.nc-blog .nc-bl-cta__txt {
	max-width: 480px;
}
.nc-blog .nc-bl-cta__h2 {
	font-family: 'Plus Jakarta Sans', sans-serif;
	font-weight: 800;
	font-size: clamp(18px, 2.2vw, 23px);
	letter-spacing: -0.02em;
	line-height: 1.25;
	margin-bottom: 6px;
	color: #fff;
}
.nc-blog .nc-bl-cta__body {
	font-size: 14.5px;
	line-height: 1.5;
	color: rgba(255,255,255,0.82);
}
.nc-blog .nc-bl-cta__btn {
	display: inline-block;
	font-size: 15px;
	font-weight: 700;
	color: #1F3864;
	background: #fff;
	padding: 14px 26px;
	border-radius: 9px;
	flex: none;
}

/* ---- nc-bl-numlist : numbered layer list (accent number tile) ---- */
.nc-blog .nc-bl-numlist {
	display: flex;
	flex-direction: column;
	gap: 14px;
}
.nc-blog .nc-bl-numlist__card {
	border: 1px solid #e6e9ef;
	border-radius: 14px;
	padding: clamp(20px, 2.4vw, 26px);
	display: flex;
	gap: 16px;
}
.nc-blog .nc-bl-numlist__n {
	width: 34px;
	height: 34px;
	border-radius: 9px;
	background: var(--tile);
	color: var(--c);
	display: flex;
	align-items: center;
	justify-content: center;
	flex: none;
	font-family: 'Plus Jakarta Sans', sans-serif;
	font-weight: 800;
	font-size: 15px;
}
.nc-blog .nc-bl-numlist__title {
	font-family: 'Plus Jakarta Sans', sans-serif;
	font-weight: 700;
	font-size: 17px;
	letter-spacing: -0.01em;
	margin: 4px 0 8px;
	color: #16233b;
	line-height: 1.3;
}
.nc-blog .nc-bl-numlist__desc {
	font-size: 14.5px;
	line-height: 1.6;
	color: #5a6272;
	margin: 0;
}

/* ---- nc-bl-callout : tinted callout cards (bg --tint, border --tile) ---- */
.nc-blog .nc-bl-callout {
	display: flex;
	flex-direction: column;
	gap: 12px;
}
.nc-blog .nc-bl-callout--2 {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 12px;
}
.nc-blog .nc-bl-callout__card {
	background: var(--tint);
	border: 1px solid var(--tile);
	border-radius: 12px;
	padding: 18px 20px;
}
.nc-blog .nc-bl-callout__title {
	font-family: 'Plus Jakarta Sans', sans-serif;
	font-weight: 700;
	font-size: 15px;
	color: #16233b;
	margin-bottom: 5px;
}
.nc-blog .nc-bl-callout__body {
	font-size: 14.5px;
	line-height: 1.55;
	color: #5a6272;
	margin: 0;
}
@media (max-width: 640px) {
	.nc-blog .nc-bl-callout--2 {
		grid-template-columns: 1fr;
	}
}

/* ---- nc-bl-feat : feature/capability grid (2-col tinted cards) ---- */
.nc-blog .nc-bl-feat {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 14px;
}
.nc-blog .nc-bl-feat__card {
	border: 1px solid var(--tile);
	background: var(--tint);
	border-radius: 14px;
	padding: 20px 22px;
}
.nc-blog .nc-bl-feat__title {
	font-family: 'Plus Jakarta Sans', sans-serif;
	font-weight: 700;
	font-size: 16px;
	letter-spacing: -0.01em;
	margin: 0 0 7px;
	color: #16233b;
}
.nc-blog .nc-bl-feat__body {
	font-size: 14px;
	line-height: 1.55;
	color: #5a6272;
	margin: 0;
}
@media (max-width: 640px) {
	.nc-blog .nc-bl-feat {
		grid-template-columns: 1fr;
	}
}

/* ---- nc-bl-table : fixed 3-col comparison table (navy header + zebra body) ---- */
.nc-blog .nc-bl-table {
	overflow-x: auto;
	border: 1px solid #e6e9ef;
	border-radius: 14px;
}
.nc-blog .nc-bl-table table {
	width: 100%;
	border-collapse: collapse;
	min-width: 640px;
	font-size: 13.5px;
}
.nc-blog .nc-bl-table thead tr {
	background: #16233b;
}
.nc-blog .nc-bl-table th {
	background: #16233b; /* explicit — beats the theme's .nc-site th cell background that would otherwise paint over the navy thead row */
	font-family: 'Plus Jakarta Sans', sans-serif;
	font-weight: 700;
	font-size: 12px;
	letter-spacing: 0.05em;
	text-transform: uppercase;
	color: #fff;
	text-align: left;
	padding: 13px 16px;
}
.nc-blog .nc-bl-table__row {
	background: #fff;
}
.nc-blog .nc-bl-table__row--zebra {
	background: #F7F9FE;
}
.nc-blog .nc-bl-table td {
	padding: 12px 16px;
	border-top: 1px solid #eceef2;
	color: #5a6272;
}
.nc-blog .nc-bl-table__c1 {
	font-family: 'Plus Jakarta Sans', sans-serif;
	font-weight: 700;
	color: #16233b;
	white-space: nowrap;
}

/* ---- nc-bl-rank : ranked profile cards (accent top-border + rank tile + chips) ---- */
.nc-blog .nc-bl-rank {
	display: flex;
	flex-direction: column;
	gap: 16px;
}
.nc-blog .nc-bl-rank__card {
	border: 1px solid #e6e9ef;
	border-radius: 16px;
	padding: clamp(22px, 2.6vw, 30px);
	border-top: 4px solid var(--c);
}
.nc-blog .nc-bl-rank__head {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 12px;
	margin-bottom: 12px;
}
.nc-blog .nc-bl-rank__n {
	width: 38px;
	height: 38px;
	border-radius: 10px;
	background: var(--tile);
	color: var(--c);
	display: flex;
	align-items: center;
	justify-content: center;
	flex: none;
	font-family: 'Plus Jakarta Sans', sans-serif;
	font-weight: 800;
	font-size: 16px;
}
.nc-blog .nc-bl-rank__name {
	font-family: 'Plus Jakarta Sans', sans-serif;
	font-weight: 700;
	font-size: 19px;
	letter-spacing: -0.015em;
	margin: 0;
	color: #16233b;
	line-height: 1.25;
}
.nc-blog .nc-bl-rank__epithet {
	font-size: 13px;
	font-weight: 600;
	color: var(--c);
	margin-top: 2px;
}
.nc-blog .nc-bl-rank__body {
	font-size: 15px;
	line-height: 1.65;
	color: #3a4250;
	margin: 0 0 14px;
}
.nc-blog .nc-bl-rank__chips {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}
.nc-blog .nc-bl-rank__chip {
	font-size: 12.5px;
	font-weight: 600;
	color: #3a4250;
	background: #F7F9FE;
	border: 1px solid #e6e9ef;
	padding: 6px 12px;
	border-radius: 999px;
}

/* ---- nc-bl-notice : fixed amber notice ("!" tile + bold lead-in + body) ---- */
.nc-blog .nc-bl-notice {
	background: #FEF4E2;
	border: 1px solid #FBE6BF;
	border-radius: 12px;
	padding: 18px 20px;
	display: flex;
	gap: 14px;
	align-items: flex-start;
	margin-bottom: 18px;
}
.nc-blog .nc-bl-notice__tile {
	width: 30px;
	height: 30px;
	border-radius: 8px;
	background: #EF9D1E;
	color: #fff;
	display: flex;
	align-items: center;
	justify-content: center;
	flex: none;
	font-weight: 800;
}
.nc-blog .nc-bl-notice__body {
	font-size: 14.5px;
	line-height: 1.6;
	color: #6a5a3a;
	margin: 0;
}
.nc-blog .nc-bl-notice__title {
	color: #16233b;
}

/* ---- nc-bl-quote : positioning / pull-quote block (fixed navy left border) ---- */
.nc-blog .nc-bl-quote {
	border-left: 4px solid #1F3864;
	background: #F7F9FE;
	border-radius: 0 14px 14px 0;
	padding: 20px 24px;
	margin-top: 22px;
}
.nc-blog .nc-bl-quote__text {
	font-size: 15px;
	line-height: 1.65;
	color: #3a4250;
	margin: 0;
}
.nc-blog .nc-bl-quote__cite {
	display: block;
	margin-top: 10px;
	font-size: 13px;
	font-style: normal;
	color: #7a818e;
}

/* ---- Article-body prose: style STOCK Elementor widgets inside .nc-blog-article ---- */
.nc-blog-article .elementor-widget-container { padding: 0; }
.nc-blog-article .elementor-widget-heading .elementor-heading-title {
	font-family: 'Plus Jakarta Sans', sans-serif;
	font-weight: 800;
	letter-spacing: -0.02em;
	line-height: 1.25;
	color: #16233b;
	margin: 2em 0 0.6em;
}
.nc-blog-article .elementor-widget-heading h2.elementor-heading-title {
	font-size: clamp(23px, 2.6vw, 30px);
}
.nc-blog-article .elementor-widget-heading h3.elementor-heading-title {
	font-size: clamp(18px, 2vw, 22px);
}
.nc-blog-article .elementor-widget-heading h4.elementor-heading-title {
	font-size: clamp(16px, 1.6vw, 19px);
}
.nc-blog-article .elementor-widget-text-editor {
	font-size: 16.5px;
	line-height: 1.75;
	color: #3a4250;
}
.nc-blog-article .elementor-widget-text-editor p {
	margin: 0 0 1.2em;
}
.nc-blog-article .elementor-widget-text-editor a {
	color: #1F3864;
	text-underline-offset: 3px;
}
.nc-blog-article .elementor-widget-text-editor a:hover {
	color: #16294a;
}
.nc-blog-article .elementor-widget-text-editor ul,
.nc-blog-article .elementor-widget-text-editor ol {
	margin: 0 0 1.2em;
	padding-left: 1.5em;
}
.nc-blog-article .elementor-widget-text-editor li {
	margin-bottom: 0.4em;
}
.nc-blog-article .elementor-widget-image img {
	border-radius: 10px;
}

/* ===================== Phase 5 — comments (native WP, restyled) ===================== */
.nc-blog .nc-bl-comments {
	margin-top: clamp(36px, 4.5vw, 56px);
	border: 1px solid #e6e9ef;
	border-radius: 16px;
	padding: clamp(24px, 3vw, 34px);
}
.nc-blog .nc-bl-comments__title,
.nc-blog .nc-bl-comments__count {
	font-family: 'Plus Jakarta Sans', sans-serif;
	font-weight: 800;
	font-size: clamp(20px, 2.2vw, 25px);
	letter-spacing: -0.02em;
	margin: 0 0 18px;
	color: #16233b;
}
.nc-blog .nc-bl-comments__list {
	list-style: none;
	margin: 0 0 26px;
	padding: 0;
}
.nc-blog .nc-bl-comments__list ol.children {
	list-style: none;
	margin: 0;
	padding-left: clamp(16px, 3vw, 40px);
}
.nc-blog .nc-bl-comments .comment-body {
	padding: 16px 0;
	border-top: 1px solid #eceef2;
}
.nc-blog .nc-bl-comments .comment-author {
	font-family: 'Plus Jakarta Sans', sans-serif;
	font-weight: 700;
	font-size: 15px;
	color: #16233b;
}
.nc-blog .nc-bl-comments .comment-author .avatar {
	border-radius: 50%;
	margin-right: 10px;
	vertical-align: middle;
}
.nc-blog .nc-bl-comments .comment-metadata,
.nc-blog .nc-bl-comments .comment-metadata a {
	color: #7a818e;
	font-size: 12.5px;
	text-decoration: none;
}
.nc-blog .nc-bl-comments .comment-content {
	color: #3a4250;
	font-size: 15px;
	line-height: 1.7;
	margin-top: 6px;
}
.nc-blog .nc-bl-comments .comment-content p { margin: 0 0 10px; }
.nc-blog .nc-bl-comments .reply a {
	color: #1F3864;
	font-weight: 700;
	font-size: 13px;
	text-decoration: none;
}
.nc-blog .nc-bl-comments .comment-awaiting-moderation {
	display: inline-block;
	background: #E7F6ED;
	color: #166534;
	border-radius: 8px;
	padding: 6px 12px;
	font-size: 13px;
	margin-top: 8px;
}
/* form */
.nc-blog .nc-bl-comments .comment-form { margin: 0; }
.nc-blog .nc-bl-comments .comment-form p { margin: 0 0 16px; }
.nc-blog .nc-bl-comments label {
	display: block;
	font-family: 'Plus Jakarta Sans', sans-serif;
	font-size: 13.5px;
	font-weight: 600;
	color: #16233b;
	margin-bottom: 6px;
}
.nc-blog .nc-bl-comments textarea,
.nc-blog .nc-bl-comments input[type="text"],
.nc-blog .nc-bl-comments input[type="email"],
.nc-blog .nc-bl-comments input[type="url"] {
	width: 100%;
	box-sizing: border-box;
	font-family: 'Hanken Grotesk', sans-serif;
	font-size: 15px;
	padding: 13px 16px;
	border-radius: 9px;
	border: 1px solid #d8dde6;
	color: #1a1a1a;
	background: #fff;
	outline: none;
}
.nc-blog .nc-bl-comments textarea { resize: vertical; }
.nc-blog .nc-bl-comments textarea:focus,
.nc-blog .nc-bl-comments input[type="text"]:focus,
.nc-blog .nc-bl-comments input[type="email"]:focus,
.nc-blog .nc-bl-comments input[type="url"]:focus {
	border-color: #1F3864;
	box-shadow: 0 0 0 3px rgba(31, 56, 100, 0.12);
}
.nc-blog .nc-bl-comments .form-submit { margin-bottom: 0; }
/* The parent theme renders the submit as <button class="theme-btns">, not an
   <input type=submit>; cover both (and any submit control inside the card). */
.nc-blog .nc-bl-comments .form-submit input[type="submit"],
.nc-blog .nc-bl-comments .form-submit button,
.nc-blog .nc-bl-comments button[type="submit"] {
	background: #1F3864;
	color: #fff;
	border: none;
	border-radius: 9px;
	padding: 14px 30px;
	font-family: 'Plus Jakarta Sans', sans-serif;
	font-weight: 700;
	font-size: 15px;
	line-height: 1.2;
	cursor: pointer;
	width: auto;
}
.nc-blog .nc-bl-comments .form-submit input[type="submit"]:hover,
.nc-blog .nc-bl-comments .form-submit button:hover,
.nc-blog .nc-bl-comments button[type="submit"]:hover { background: #16294a; }
.nc-blog .nc-bl-comments .comment-form-cookies-consent {
	display: flex;
	align-items: flex-start;
	gap: 8px;
}
.nc-blog .nc-bl-comments .comment-form-cookies-consent label { margin: 0; font-weight: 400; }
.nc-blog .nc-bl-comments .comment-form-cookies-consent input { width: auto; }
.nc-blog .nc-bl-comments__closed { color: #7a818e; font-size: 14px; }
@media (min-width: 620px) {
	.nc-blog .nc-bl-comments .comment-form-author,
	.nc-blog .nc-bl-comments .comment-form-email {
		display: inline-block;
		width: calc(50% - 8px);
		vertical-align: top;
	}
	.nc-blog .nc-bl-comments .comment-form-author { margin-right: 14px; }
}