/* MFC Blog 2 preview 0.1.0 (?mfc_blog2=1, wave 2 item 12). Loaded after blog-v2.css on that request only.
   Tokens: design-system draft 25 Oct (scoped): blue scale, radii 6/12/20, Neue Haas 400/500, no mono. */
body.mfc-b2 {
	--bv2-mono: var(--bv2-sans);
	--bv2-link: #4D8DFF;
	--b2-rs: 6px; --b2-rm: 12px; --b2-rl: 20px;
	--b2-cover: #0E1014;
}
body.mfc-b2 .bv2-mono { letter-spacing: .04em; font-weight: 500; }
body.mfc-b2 .bv2-btn { border-radius: var(--b2-rm); }
body.mfc-b2 .bv2-search, body.mfc-b2 .bv2-toc-m { border-radius: var(--b2-rm); }
body.mfc-b2 .bv2-card, body.mfc-b2 .bv2-rules { border-radius: var(--b2-rm); }
body.mfc-b2 .bv2-feature { border-radius: var(--b2-rl); }

/* ---------- cover (HTML): topic, title on the left, small chart on the right, brand ---------- */
body.mfc-b2 .b2c {
	container-type: inline-size; position: relative; display: grid; aspect-ratio: 16 / 9; width: 100%; height: auto; overflow: hidden;
	grid-template-columns: minmax(0, 1fr) 34%; grid-template-rows: auto 1fr auto; column-gap: 5%;
	padding: 6.5% 6% 5.5%; box-sizing: border-box; color: #F2F4F6; font-family: var(--bv2-sans);
	background:
		radial-gradient(70% 90% at 100% 0%, rgba(0, 106, 255, .16), rgba(0, 106, 255, 0) 60%),
		linear-gradient(rgba(255,255,255,.035) 1px, transparent 1px) 0 0 / 100% 25%,
		linear-gradient(90deg, rgba(255,255,255,.035) 1px, transparent 1px) 0 0 / 12.5% 100%,
		var(--b2-cover);
}
body.mfc-b2 .b2c__topic { grid-column: 1 / -1; grid-row: 1; font: 500 clamp(11px, 3.1cqi, 15px)/1.2 var(--bv2-sans); color: #80B0FF; letter-spacing: .02em; }
body.mfc-b2 .b2c__title {
	grid-column: 1; grid-row: 2; align-self: center; font: 500 clamp(16px, 6.4cqi, 46px)/1.08 var(--bv2-sans); letter-spacing: -.02em;
	color: #fff; text-wrap: balance; display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden;
}
body.mfc-b2 .b2c__plot { grid-column: 2; grid-row: 2; align-self: center; display: block; }
body.mfc-b2 .b2c__chart { display: block; width: 100%; height: auto; overflow: visible; }
body.mfc-b2 .b2c__brand { grid-column: 1 / -1; grid-row: 3; display: inline-flex; align-items: center; gap: .45em; font: 500 clamp(10px, 2.5cqi, 13px)/1 var(--bv2-sans); color: #A7ABB2; }
body.mfc-b2 .b2c__brand svg { width: 1.2em; height: 1.2em; }
/* article page: chart-only cover next to the H1 (the title is the H1) */
body.mfc-b2 .b2c--hero { grid-template-columns: minmax(0, 1fr); border: 1px solid var(--bv2-line); border-radius: var(--b2-rl); padding: 6% 6% 5%; }
body.mfc-b2 .b2c--hero .b2c__plot { grid-column: 1; }

/* the card's own heading sits on the cover now: said once, still the link and the heading for screen readers */
body.mfc-b2 .bv2-card__media { aspect-ratio: auto; background: var(--b2-cover); }
body.mfc-b2 .bv2-card__title, body.mfc-b2 .bv2-feature__title { height: 0; overflow: hidden; margin: -10px 0 0 !important; font-size: 0 !important; line-height: 0 !important; }
body.mfc-b2 .bv2-feature__title { margin-top: -16px !important; }
body.mfc-b2 .bv2-card:focus-within { outline: 2px solid var(--bv2-blue); outline-offset: 2px; }
body.mfc-b2 .bv2-feature__media { background: var(--b2-cover); display: flex; align-items: stretch; }
body.mfc-b2 .bv2-feature__media .b2c { aspect-ratio: auto; min-height: 100%; }
body.mfc-b2 .bv2-feature__media .b2c--feature { aspect-ratio: 16 / 9; }

/* medium widths: the featured article stays two columns, the article cover sits beside the text */
@media (min-width: 768px) and (max-width: 1200px) {
	body.mfc-b2 .bv2-feature { grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); }
	body.mfc-b2 .bv2-feature__body { padding: 28px; gap: 12px; }
	body.mfc-b2 .bv2-feature__text { -webkit-line-clamp: 3; font-size: 15px; }
	body.mfc-b2 .bv2-hero { grid-template-columns: minmax(0, 1fr) minmax(0, 38%); gap: 32px; align-items: center; }
}
@media (min-width: 768px) and (max-width: 1024px) {
	body.mfc-b2 .bv2-related .bv2-card:nth-child(3) { display: none; } /* two columns: no orphan third card */
}
@media (min-width: 1025px) and (max-width: 1200px) {
	body.mfc-b2 .bv2-grid { gap: 20px; }
}
@media (max-width: 767px) {
	body.mfc-b2 .b2c--hero { aspect-ratio: 2 / 1; }
	body.mfc-b2 .b2c--hero .b2c__plot { max-width: 78%; justify-self: end; }
}

/* ---------- closing: "Trade with clear rules on our capital" ends in a dark planet limb, black into the footer ---------- */
body.mfc-b2 main.bv2 { overflow-x: clip; }
body.mfc-b2 .bv2-post { padding-bottom: 0 !important; }
body.mfc-b2 .bv2-cta {
	--cap: 120px; --r: 1500px;
	position: relative; margin: 96px calc(50% - 50vw) 0; padding: 104px 24px calc(var(--cap) + 72px);
	flex-direction: column; align-items: center; justify-content: flex-start; gap: 28px; text-align: center;
	border: 0; border-radius: 0;
	background:
		radial-gradient(40% 90px at 50% calc(100% - var(--cap)), rgba(150, 190, 255, .22), rgba(0, 106, 255, .07) 55%, rgba(0, 106, 255, 0) 100%),
		radial-gradient(circle calc(var(--r) + 110px) at 50% calc(100% - var(--cap) + var(--r)),
			#000 0, #000 calc(var(--r) - 3px), #2f63d8 calc(var(--r) - 1.2px), #dbe8ff calc(var(--r) - .3px), #fff var(--r),
			rgba(140, 180, 255, .85) calc(var(--r) + 1.5px), rgba(0, 106, 255, .38) calc(var(--r) + 12px), rgba(0, 86, 230, .12) calc(var(--r) + 44px),
			rgba(0, 0, 0, 0) calc(var(--r) + 110px)),
		linear-gradient(var(--bv2-bg), var(--bv2-bg) 35%, #000 100%);
}
body.mfc-b2 .bv2-cta > div { align-items: center; max-width: 720px; }
body.mfc-b2 .bv2-cta h2 { font-size: 44px !important; line-height: 1.08 !important; text-wrap: balance; }
body.mfc-b2 .bv2-cta p:not(.bv2-mono) { font-size: 17px; }
body.mfc-b2 .bv2-cta .bv2-btn--primary { box-shadow: inset 0 2px 1px rgba(255,255,255,.18), 0 0 0 1px rgba(0,106,255,.35), 0 10px 30px -6px rgba(0,106,255,.75); }
/* footer: starts black, no top gap (the band already ends black) */
body.mfc-b2 .elementor-31409 .elementor-element-7d84bc9f { padding-top: 8px; }
/* archive: soft run-out into the black footer instead of a step */
body.mfc-b2 .bv2-index { background: linear-gradient(var(--bv2-bg), var(--bv2-bg) calc(100% - 260px), #000 100%); }
@media (max-width: 1024px) {
	body.mfc-b2 .bv2-cta { --cap: 90px; --r: 900px; padding: 88px 24px calc(var(--cap) + 60px); }
	body.mfc-b2 .bv2-cta h2 { font-size: 36px !important; }
}
@media (max-width: 767px) {
	body.mfc-b2 .bv2-cta { --cap: 64px; --r: 520px; margin-top: 64px; padding: 64px 20px calc(var(--cap) + 48px); gap: 22px; }
	body.mfc-b2 .bv2-cta h2 { font-size: 28px !important; }
	body.mfc-b2 .bv2-cta p:not(.bv2-mono) { font-size: 16px; }
}

/* ---------- 1.0.0 (27 Oct): /blog/ article list on a light band (owner pg_blog_dark). Hero + featured article stay dark,
   the standard horizon (BG-v1 flipped, as /about-us/) opens the white band, the footer's own arc closes it. ---------- */
body.mfc-b2-index main.bv2-index { padding-bottom: 0; }
body.mfc-b2-index .bv2-list { position: relative; isolation: isolate; margin-top: 8px; padding: calc(220px + 8px) 0 112px; color: #0A0B0D; }
body.mfc-b2-index .bv2-list::before { content: ""; position: absolute; z-index: -1; top: 218px; bottom: 0; left: calc(50% - 50vw); right: calc(50% - 50vw); background: #fff; }
body.mfc-b2-index .bv2-list::after { content: ""; position: absolute; z-index: -1; top: 0; height: 222px; left: calc(50% - 50vw); right: calc(50% - 50vw); background: url("/wp-content/uploads/2026/01/BG-v1.png") 50% 50% / 100% 100% no-repeat; transform: scaleY(-1); pointer-events: none; }
body.mfc-b2-index .bv2-list .bv2-filter { border-bottom-color: rgba(10, 11, 13, .1); }
body.mfc-b2-index .bv2-list .bv2-mono { color: #5B6270; }
body.mfc-b2-index .bv2-list .bv2-chips a { border-color: rgba(10, 11, 13, .16); color: #2A2F38 !important; background: #fff; }
body.mfc-b2-index .bv2-list .bv2-chips a span { color: #6B7280; }
body.mfc-b2-index .bv2-list .bv2-chips a:hover { border-color: rgba(10, 11, 13, .4); color: #0A0B0D !important; }
body.mfc-b2-index .bv2-list .bv2-chips a[aria-current="page"] { background: #0A0B0D; border-color: #0A0B0D; color: #fff !important; }
body.mfc-b2-index .bv2-list .bv2-chips a[aria-current="page"] span { color: #A3AAB6; }
body.mfc-b2-index .bv2-list .bv2-card { background: #fff; border-color: rgba(10, 11, 13, .1); box-shadow: 0 1px 2px rgba(10, 11, 13, .04); }
body.mfc-b2-index .bv2-list .bv2-card:hover { border-color: rgba(10, 11, 13, .2); box-shadow: 0 12px 28px -16px rgba(10, 11, 13, .25); }
body.mfc-b2-index .bv2-list .bv2-card__media { border-bottom: 0; }
body.mfc-b2-index .bv2-list .bv2-card__text { color: #4B5563; }
body.mfc-b2-index .bv2-list .bv2-card__date { color: #6B7280; }
body.mfc-b2-index .bv2-list .bv2-btn--ghost { border-color: rgba(10, 11, 13, .2); color: #0A0B0D !important; background: #fff; }
body.mfc-b2-index .bv2-list .bv2-btn--ghost:hover { border-color: rgba(10, 11, 13, .45); }
body.mfc-b2-index .bv2-list .bv2-pager a { border-color: rgba(10, 11, 13, .16); color: #2A2F38 !important; background: #fff; }
body.mfc-b2-index .bv2-list .bv2-pager a:hover { border-color: rgba(10, 11, 13, .4); color: #0A0B0D !important; }
body.mfc-b2-index .bv2-list .bv2-pager a[aria-current="page"] { background: #0A0B0D; border-color: #0A0B0D; color: #fff !important; }
body.mfc-b2-index .bv2-list .bv2-pager__gap { color: #6B7280; }
body.mfc-b2-index .bv2-list .bv2-empty { color: #4B5563; }
body.mfc-b2-index .bv2-list .bv2-empty a, body.mfc-b2-index .bv2-list a:not([class]) { color: #0047D6; }
body.mfc-b2-index .bv2-list :focus-visible { outline-color: #006AFF; }
/* the list ends light: the footer keeps its own light -> dark arc (the archive run-out above is for the dark version) */
html body.mfc-b2-index .elementor-31409 .elementor-element-7c0401ec { display: block !important; }
body.mfc-b2-index .elementor-31409 .elementor-element-7d84bc9f { padding-top: 0; }
/* hero black like the horizon's dark edge (blog v2 canvas is #0A0B0D) */
body.mfc-b2-index main.bv2-index { background: #000; }
@media (max-width: 1024px) {
	body.mfc-b2-index .bv2-list { padding-top: calc(180px + 8px); padding-bottom: 88px; }
	body.mfc-b2-index .bv2-list::before { top: 178px; }
	body.mfc-b2-index .bv2-list::after { height: 182px; background-size: cover; background-position: 50% 100%; }
}
@media (max-width: 767px) {
	body.mfc-b2-index .bv2-list { padding-bottom: 72px; }
}
