/**
 * ManPack Blog Filters
 *
 * Measurements taken from the Figma "Explore the blog" section:
 * 1440 container / 50px side padding / 3 x 433px cards / 20px column gap.
 *
 * THEME ISOLATION
 * ---------------
 * Themes style bare `button`, `input`, `a`, `h2`, `h3`, `p`, `img` and
 * `article` aggressively — often with high specificity or !important of their
 * own. So this file:
 *
 *   1. scopes every selector under `.mbf-section` (specificity 0,2,0+),
 *   2. hard-resets every element we output before styling it,
 *   3. marks layout/typography declarations !important so a theme rule cannot
 *      win even at higher specificity.
 *
 * CUSTOMISING
 * -----------
 * The custom properties below are deliberately NOT !important — they are the
 * intended override surface. Beat our specificity from the theme with a
 * `body` prefix:
 *
 *   body .mbf-section { --mbf-accent: #ff5a1f; --mbf-max-width: 1280px; }
 */

/* ------------------------------------------------------ Tokens (override me) */

.mbf-section {
	--mbf-max-width: 1440px;
	--mbf-gutter: 50px;
	--mbf-columns: 3;
	--mbf-gap-x: 20px;
	--mbf-gap-y: 24px;

	--mbf-accent: #0a4dfa;
	--mbf-title: #0d0d17;
	--mbf-body: #6b6b76;
	--mbf-muted: #9c9ca6;
	--mbf-border: #e8e8ec;
	--mbf-card-bg: #ffffff;
	--mbf-card-radius: 16px;
	--mbf-media-radius: 12px;
	--mbf-media-ratio: 3 / 2;
	--mbf-arrow: #212121;
	--mbf-fade: 28px;

	/* Viewport width without the scrollbar. The JS overwrites this inline;
	   100vw is the fallback and includes the scrollbar. */
	--mbf-vw: 100vw;

	--mbf-font: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}

/* --------------------------------------------------------------- Hard reset */

.mbf-section {
	display: block !important;
	box-sizing: border-box !important;
	width: 100% !important;
	max-width: none !important;
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	background: none !important;
	box-shadow: none !important;
	float: none !important;
	clear: both !important;
	font-family: var(--mbf-font) !important;
	font-size: 16px !important;
	line-height: 1.5 !important;
	letter-spacing: normal !important;
	text-align: left !important;
	text-transform: none !important;
	color: var(--mbf-title) !important;
	-webkit-font-smoothing: antialiased;
}

.mbf-section *,
.mbf-section *::before,
.mbf-section *::after {
	box-sizing: border-box !important;
}

/* Strip inherited theme styling from every element the plugin renders. The
   component rules below re-declare what we actually want. */
.mbf-section article,
.mbf-section nav,
.mbf-section div,
.mbf-section span,
.mbf-section p,
.mbf-section h2,
.mbf-section h3,
.mbf-section a,
.mbf-section button,
.mbf-section input,
.mbf-section label,
.mbf-section img,
.mbf-section svg {
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	border-radius: 0 !important;
	background: none !important;
	box-shadow: none !important;
	text-shadow: none !important;
	text-decoration: none !important;
	text-transform: none !important;
	text-align: inherit !important;
	letter-spacing: normal !important;
	font-family: inherit !important;
	font-size: inherit !important;
	font-weight: inherit !important;
	font-style: normal !important;
	line-height: inherit !important;
	color: inherit !important;
	float: none !important;
	min-width: 0 !important;
	min-height: 0 !important;
	max-width: none !important;
	max-height: none !important;
	list-style: none !important;
}

/* Some themes hang decorative bars off heading pseudo-elements. */
.mbf-section h2::before,
.mbf-section h2::after,
.mbf-section h3::before,
.mbf-section h3::after,
.mbf-section a::before,
.mbf-section a::after {
	content: none !important;
	display: none !important;
}

.mbf-section button,
.mbf-section input {
	-webkit-appearance: none !important;
	appearance: none !important;
	outline: none;
	text-indent: 0 !important;
	vertical-align: middle !important;
}

.mbf-section img,
.mbf-section svg {
	display: block !important;
	vertical-align: middle !important;
}

.mbf-section [hidden] {
	display: none !important;
}

/* --------------------------------------------------------------- Container */

/* Break out of a narrower theme wrapper so the section always gets its full
   1440px. Negative side margins pull the block back to the viewport edges;
   .mbf-container then centres the 1440px content inside it. Disable with
   full_width="no" on the shortcode. */
.mbf-section.mbf-section--full {
	width: var(--mbf-vw) !important;
	max-width: var(--mbf-vw) !important;
	margin-left: calc(50% - (var(--mbf-vw) / 2)) !important;
	margin-right: calc(50% - (var(--mbf-vw) / 2)) !important;
}

.mbf-section .mbf-container {
	position: relative !important;
	display: block !important;
	width: 100% !important;
	max-width: var(--mbf-max-width) !important;
	margin: 0 auto !important;
	padding: 0 var(--mbf-gutter) !important;
}

.mbf-section .mbf-visually-hidden {
	position: absolute !important;
	width: 1px !important;
	height: 1px !important;
	margin: -1px !important;
	padding: 0 !important;
	overflow: hidden !important;
	clip: rect(0 0 0 0) !important;
	clip-path: inset(50%) !important;
	white-space: nowrap !important;
	border: 0 !important;
}

/* ----------------------------------------------------------------- Heading */

.mbf-section .mbf-heading {
	display: block !important;
	margin: 0 0 32px !important;
	padding: 0 !important;
	font-family: var(--mbf-font) !important;
	font-size: 40px !important;
	line-height: 1.2 !important;
	font-weight: 600 !important;
	letter-spacing: -1.5px !important;
	color: var(--mbf-title) !important;
	text-align: left !important;
	text-transform: none !important;
}

/* ----------------------------------------------------------------- Toolbar */

.mbf-section .mbf-toolbar {
	display: flex !important;
	flex-direction: row !important;
	align-items: center !important;
	justify-content: space-between !important;
	gap: 24px !important;
	margin: 0 0 40px !important;
}

.mbf-section .mbf-filters {
	position: relative !important;
	flex: 1 1 auto !important;
	min-width: 0 !important;
	max-width: 100% !important;
}

/* The row scrolls horizontally at every size — a site with a lot of
   categories must never wrap onto a second line or squash the pills. */
.mbf-section .mbf-filters__track {
	display: flex !important;
	flex-direction: row !important;
	flex-wrap: nowrap !important;
	align-items: center !important;
	gap: 8px !important;
	width: 100% !important;
	max-width: 100% !important;
	overflow-x: auto !important;
	overflow-y: hidden !important;
	/* Room for the focus ring, which would otherwise be clipped. */
	padding: 3px 0 !important;
	margin: -3px 0 !important;
	/* Deliberately NOT scroll-behavior:smooth — it would animate every
	   wheel-delta assignment below and feel laggy. */
	overscroll-behavior-x: contain !important;
	-webkit-overflow-scrolling: touch;
	/* Hide the scrollbar; the edge fades signal that it scrolls. */
	scrollbar-width: none !important;
	-ms-overflow-style: none !important;
	--mbf-fade-l: 0px;
	--mbf-fade-r: 0px;
	-webkit-mask-image: linear-gradient(to right, transparent 0, #000 var(--mbf-fade-l), #000 calc(100% - var(--mbf-fade-r)), transparent 100%);
	mask-image: linear-gradient(to right, transparent 0, #000 var(--mbf-fade-l), #000 calc(100% - var(--mbf-fade-r)), transparent 100%);
}

.mbf-section .mbf-filters__track::-webkit-scrollbar {
	display: none !important;
	width: 0 !important;
	height: 0 !important;
}

/* Set by the JS when there is more row than viewport. */
.mbf-section .mbf-filters.is-overflow-start .mbf-filters__track {
	--mbf-fade-l: var(--mbf-fade);
}

.mbf-section .mbf-filters.is-overflow-end .mbf-filters__track {
	--mbf-fade-r: var(--mbf-fade);
}

.mbf-section .mbf-pill {
	/* Never shrink: a squashed pill overlaps its own label. */
	flex: 0 0 auto !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	margin: 0 !important;
	padding: 6px 16px !important;
	min-height: 32px !important;
	width: auto !important;
	border: 0.8px solid var(--mbf-border) !important;
	border-radius: 6px !important;
	background: transparent !important;
	box-shadow: none !important;
	font-family: var(--mbf-font) !important;
	font-size: 14px !important;
	line-height: 1.2 !important;
	font-weight: 500 !important;
	letter-spacing: -0.1px !important;
	text-transform: none !important;
	color: var(--mbf-muted) !important;
	white-space: nowrap !important;
	cursor: pointer !important;
	transition: color 0.18s ease, border-color 0.18s ease, background-color 0.18s ease;
}

.mbf-section .mbf-pill:hover,
.mbf-section .mbf-pill:focus-visible {
	color: var(--mbf-title) !important;
	border-color: #cfcfd6 !important;
	background: transparent !important;
}

.mbf-section .mbf-pill:focus-visible {
	outline: 2px solid var(--mbf-accent) !important;
	outline-offset: 2px !important;
}

.mbf-section .mbf-pill.is-active,
.mbf-section .mbf-pill.is-active:hover,
.mbf-section .mbf-pill.is-active:focus-visible {
	background: var(--mbf-accent) !important;
	border-color: var(--mbf-accent) !important;
	color: #ffffff !important;
	font-weight: 600 !important;
}

/* ------------------------------------------------------------------ Search */

.mbf-section .mbf-search {
	position: relative !important;
	display: block !important;
	flex: 0 0 auto !important;
	width: 240px !important;
	max-width: 100% !important;
}

.mbf-section .mbf-search__icon {
	position: absolute !important;
	top: 50% !important;
	left: 12px !important;
	transform: translateY(-50%) !important;
	width: 14px !important;
	height: 14px !important;
	color: var(--mbf-muted) !important;
	pointer-events: none !important;
}

.mbf-section .mbf-search__input {
	display: block !important;
	width: 100% !important;
	max-width: 100% !important;
	height: 32px !important;
	min-height: 0 !important;
	margin: 0 !important;
	padding: 0 30px 0 32px !important;
	border: 0.8px solid var(--mbf-border) !important;
	border-radius: 6px !important;
	background: transparent !important;
	background-image: none !important;
	box-shadow: none !important;
	font-family: var(--mbf-font) !important;
	font-size: 13px !important;
	line-height: 1.4 !important;
	font-weight: 400 !important;
	letter-spacing: normal !important;
	text-transform: none !important;
	color: var(--mbf-title) !important;
	transition: border-color 0.18s ease;
}

.mbf-section .mbf-search__input::placeholder {
	color: var(--mbf-muted) !important;
	opacity: 1 !important;
	font-size: 13px !important;
	text-transform: none !important;
}

.mbf-section .mbf-search__input:focus {
	outline: none !important;
	border-color: var(--mbf-accent) !important;
	box-shadow: none !important;
	background: transparent !important;
}

.mbf-section .mbf-search__input::-webkit-search-cancel-button,
.mbf-section .mbf-search__input::-webkit-search-decoration {
	-webkit-appearance: none !important;
	appearance: none !important;
}

.mbf-section .mbf-search__clear {
	position: absolute !important;
	top: 50% !important;
	right: 6px !important;
	transform: translateY(-50%) !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	width: 20px !important;
	height: 20px !important;
	min-height: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	border-radius: 50% !important;
	background: transparent !important;
	color: var(--mbf-muted) !important;
	font-family: var(--mbf-font) !important;
	font-size: 16px !important;
	line-height: 1 !important;
	cursor: pointer !important;
}

.mbf-section .mbf-search__clear:hover {
	color: var(--mbf-title) !important;
}

/* -------------------------------------------------------------------- Grid */

.mbf-section .mbf-results {
	position: relative !important;
	display: block !important;
	transition: opacity 0.2s ease;
}

.mbf-section .mbf-results.is-loading {
	opacity: 0.35 !important;
	pointer-events: none !important;
}

.mbf-section .mbf-grid {
	display: grid !important;
	grid-template-columns: repeat(var(--mbf-columns, 3), minmax(0, 1fr)) !important;
	column-gap: var(--mbf-gap-x) !important;
	row-gap: var(--mbf-gap-y) !important;
	margin: 0 !important;
	padding: 0 !important;
	list-style: none !important;
}

/* -------------------------------------------------------------------- Card */

.mbf-section .mbf-card {
	display: flex !important;
	flex-direction: column !important;
	min-width: 0 !important;
	margin: 0 !important;
	padding: 0 !important;
	background: var(--mbf-card-bg) !important;
	border: 1px solid var(--mbf-border) !important;
	border-radius: var(--mbf-card-radius) !important;
	overflow: hidden !important;
	transition: transform 0.22s ease, box-shadow 0.22s ease, border-color 0.22s ease;
}

.mbf-section .mbf-card:hover {
	transform: translateY(-2px);
	border-color: #dcdce3 !important;
	box-shadow: 0 12px 32px rgba(13, 13, 23, 0.07) !important;
}

.mbf-section .mbf-card__link,
.mbf-section .mbf-card__link:link,
.mbf-section .mbf-card__link:visited,
.mbf-section .mbf-card__link:hover,
.mbf-section .mbf-card__link:focus,
.mbf-section .mbf-card__link:active {
	display: flex !important;
	flex-direction: column !important;
	width: 100% !important;
	height: 100% !important;
	margin: 0 !important;
	padding: 12px 12px 20px !important;
	border: 0 !important;
	background: none !important;
	box-shadow: none !important;
	color: inherit !important;
	text-decoration: none !important;
}

.mbf-section .mbf-card__link:focus-visible {
	outline: 2px solid var(--mbf-accent) !important;
	outline-offset: 2px !important;
	border-radius: var(--mbf-card-radius) !important;
}

.mbf-section .mbf-card__media {
	position: relative !important;
	display: block !important;
	width: 100% !important;
	aspect-ratio: var(--mbf-media-ratio) !important;
	margin: 0 !important;
	padding: 0 !important;
	overflow: hidden !important;
	border-radius: var(--mbf-media-radius) !important;
	background: #eef2ff !important;
}

/* Fallback for browsers without aspect-ratio. */
@supports not (aspect-ratio: 3 / 2) {
	.mbf-section .mbf-card__media {
		height: 0 !important;
		padding-bottom: 66.66% !important;
	}
}

.mbf-section .mbf-card__media img {
	position: absolute !important;
	top: 0 !important;
	left: 0 !important;
	right: 0 !important;
	bottom: 0 !important;
	display: block !important;
	width: 100% !important;
	max-width: 100% !important;
	/* Themes commonly ship `img { height: auto !important }`. */
	height: 100% !important;
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	border-radius: inherit !important;
	box-shadow: none !important;
	object-fit: cover !important;
	transition: transform 0.4s ease;
}

.mbf-section .mbf-card:hover .mbf-card__media img {
	transform: scale(1.03);
}

/* Placeholder used when a post has no featured image. */
.mbf-section .mbf-card__media--placeholder {
	background-color: #2f6bff !important;
	background-image:
		radial-gradient(120% 120% at 78% 92%, #38e1f5 0%, rgba(56, 225, 245, 0) 55%),
		radial-gradient(120% 110% at 92% 12%, #b9dcff 0%, rgba(185, 220, 255, 0) 60%),
		linear-gradient(135deg, #2f5cff 0%, #6ea6ff 42%, #d8ecff 72%, #7fe4f7 100%) !important;
}

.mbf-section .mbf-card__body {
	display: flex !important;
	flex-direction: column !important;
	flex: 1 1 auto !important;
	margin: 0 !important;
	padding: 20px 8px 0 !important;
}

.mbf-section .mbf-card__category {
	display: block !important;
	margin: 0 0 10px !important;
	padding: 0 !important;
	font-family: var(--mbf-font) !important;
	font-size: 13px !important;
	line-height: 1.2 !important;
	font-weight: 700 !important;
	letter-spacing: 0.06em !important;
	text-transform: uppercase !important;
	color: var(--mbf-accent) !important;
}

.mbf-section .mbf-card__head {
	display: flex !important;
	flex-direction: row !important;
	align-items: center !important;
	gap: 16px !important;
	margin: 0 0 12px !important;
	padding: 0 !important;
}

.mbf-section .mbf-card__title {
	flex: 1 1 auto !important;
	min-width: 0 !important;
	margin: 0 !important;
	padding: 0 !important;
	font-family: var(--mbf-font) !important;
	font-size: 24px !important;
	line-height: 34px !important;
	font-weight: 600 !important;
	letter-spacing: -1px !important;
	text-transform: none !important;
	color: var(--mbf-title) !important;
	overflow-wrap: break-word !important;
	word-wrap: break-word !important;

	/* Always exactly two lines. */
	display: -webkit-box !important;
	-webkit-line-clamp: 2 !important;
	line-clamp: 2 !important;
	-webkit-box-orient: vertical !important;
	overflow: hidden !important;
	min-height: 68px !important; /* 2 x 34px */
}

.mbf-section .mbf-card__arrow {
	flex: 0 0 auto !important;
	width: 24px !important;
	height: 24px !important;
	margin: 0 !important;
	color: var(--mbf-arrow) !important;
	transition: transform 0.22s ease;
}

.mbf-section .mbf-card:hover .mbf-card__arrow {
	transform: translate(3px, -3px);
}

.mbf-section .mbf-card__excerpt {
	margin: 0 !important;
	padding: 0 !important;
	font-family: var(--mbf-font) !important;
	font-size: 16px !important;
	line-height: 26px !important;
	font-weight: 400 !important;
	letter-spacing: -0.1px !important;
	text-transform: none !important;
	color: var(--mbf-body) !important;

	/* Always exactly two lines. */
	display: -webkit-box !important;
	-webkit-line-clamp: 2 !important;
	line-clamp: 2 !important;
	-webkit-box-orient: vertical !important;
	overflow: hidden !important;
	min-height: 52px !important; /* 2 x 26px */
}

/* -------------------------------------------------------------- Pagination */

.mbf-section .mbf-pagination {
	display: flex !important;
	flex-direction: row !important;
	flex-wrap: wrap !important;
	align-items: center !important;
	justify-content: center !important;
	gap: 8px !important;
	margin: 48px 0 0 !important;
	padding: 0 !important;
	border: 0 !important;
	background: none !important;
}

.mbf-section .mbf-page {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	min-width: 32px !important;
	width: auto !important;
	height: 32px !important;
	min-height: 0 !important;
	margin: 0 !important;
	padding: 0 10px !important;
	border: 0 !important;
	border-radius: 6px !important;
	background: transparent !important;
	box-shadow: none !important;
	font-family: var(--mbf-font) !important;
	font-size: 14px !important;
	line-height: 1 !important;
	font-weight: 500 !important;
	letter-spacing: normal !important;
	text-transform: none !important;
	color: var(--mbf-muted) !important;
	cursor: pointer !important;
	transition: color 0.18s ease, background-color 0.18s ease;
}

.mbf-section .mbf-page:hover:not([disabled]):not(.mbf-page--dots) {
	color: var(--mbf-title) !important;
	background: rgba(13, 13, 23, 0.04) !important;
}

.mbf-section .mbf-page:focus-visible {
	outline: 2px solid var(--mbf-accent) !important;
	outline-offset: 2px !important;
}

.mbf-section .mbf-page.is-current {
	color: var(--mbf-title) !important;
	font-weight: 600 !important;
}

.mbf-section .mbf-page[disabled] {
	opacity: 0.45 !important;
	cursor: default !important;
}

.mbf-section .mbf-page--dots {
	cursor: default !important;
	background: none !important;
}

.mbf-section .mbf-page--prev,
.mbf-section .mbf-page--next {
	padding: 0 12px !important;
}

/* --------------------------------------------------------- Empty + spinner */

.mbf-section .mbf-empty {
	display: block !important;
	padding: 64px 0 !important;
	text-align: center !important;
}

.mbf-section .mbf-empty__title {
	margin: 0 0 8px !important;
	font-family: var(--mbf-font) !important;
	font-size: 20px !important;
	line-height: 1.4 !important;
	font-weight: 600 !important;
	letter-spacing: -0.4px !important;
	color: var(--mbf-title) !important;
	text-align: center !important;
}

.mbf-section .mbf-empty__text {
	margin: 0 !important;
	font-family: var(--mbf-font) !important;
	font-size: 15px !important;
	line-height: 1.6 !important;
	color: var(--mbf-body) !important;
	text-align: center !important;
}

.mbf-section .mbf-spinner {
	position: absolute !important;
	top: 50% !important;
	left: 50% !important;
	transform: translate(-50%, -50%) !important;
	display: none !important;
	pointer-events: none !important;
	z-index: 2 !important;
}

.mbf-section.is-loading .mbf-spinner {
	display: block !important;
}

.mbf-section .mbf-spinner span {
	display: block !important;
	width: 28px !important;
	height: 28px !important;
	border: 2px solid rgba(10, 77, 250, 0.18) !important;
	border-top-color: var(--mbf-accent) !important;
	border-radius: 50% !important;
	animation: mbf-spin 0.7s linear infinite !important;
}

@keyframes mbf-spin {
	to {
		transform: rotate(360deg);
	}
}

/* -------------------------------------------------------------- Responsive */

@media (max-width: 1200px) {
	.mbf-section {
		--mbf-gutter: 32px;
	}
}

@media (max-width: 1024px) {
	/* Set the track list directly: the shortcode writes --mbf-columns as an
	   inline style, which would otherwise win over a custom property here. */
	.mbf-section .mbf-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
	}

	.mbf-section .mbf-heading {
		font-size: 34px !important;
		letter-spacing: -1px !important;
	}
}

/* Toolbar stacks before the grid does — a 240px search box plus the pill row
   stops fitting on one line well above the single-column breakpoint. */
@media (max-width: 900px) {
	/* Mobile order from the design: search first, then the category row. */
	.mbf-section .mbf-toolbar {
		flex-direction: column !important;
		align-items: stretch !important;
		gap: 14px !important;
		margin-bottom: 24px !important;
	}

	.mbf-section .mbf-search {
		order: -1 !important;
		width: 100% !important;
	}

	.mbf-section .mbf-search__input {
		height: 38px !important;
		font-size: 14px !important;
	}

	/* Let the row run edge to edge instead of stopping at the gutter. */
	.mbf-section .mbf-filters {
		width: auto !important;
		max-width: none !important;
		margin: 0 calc(var(--mbf-gutter) * -1) !important;
	}

	.mbf-section .mbf-filters__track {
		padding: 3px var(--mbf-gutter) !important;
	}
}

@media (max-width: 640px) {
	.mbf-section {
		--mbf-gutter: 20px;
		--mbf-gap-y: 20px;
	}

	.mbf-section .mbf-grid {
		grid-template-columns: minmax(0, 1fr) !important;
	}

	.mbf-section .mbf-heading {
		margin-bottom: 20px !important;
		font-size: 28px !important;
		letter-spacing: -0.8px !important;
	}

	.mbf-section .mbf-card__title {
		font-size: 22px !important;
		line-height: 30px !important;
		letter-spacing: -0.8px !important;
		min-height: 60px !important;
	}

	.mbf-section .mbf-card__excerpt {
		font-size: 15px !important;
		line-height: 24px !important;
		min-height: 48px !important;
	}

	.mbf-section .mbf-pagination {
		margin-top: 32px !important;
	}
}

@media (prefers-reduced-motion: reduce) {
	.mbf-section *,
	.mbf-section *::before,
	.mbf-section *::after {
		transition-duration: 0.01ms !important;
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
	}
}

/* ==========================================================================
   Featured slider — [manpack_featured]
   Card: 1340 content / 16px padding / two 640px columns / 28px gap.
   Type: title 38-46 at -1.5px, excerpt 16-24 (mobile title 32-40 at -2px).
   Same isolation strategy as above: scoped, hard-reset, !important.
   ========================================================================== */

.mbfs-section {
	--mbfs-max-width: 1440px;
	--mbfs-gutter: 50px;
	--mbfs-gap: 28px;
	--mbfs-pad: 16px;

	--mbfs-accent: #0a4dfa;
	--mbfs-title: #0d0d17;
	--mbfs-body: #6b6b76;
	--mbfs-card-bg: #ffffff;
	--mbfs-card-radius: 20px;
	--mbfs-media-radius: 12px;
	--mbfs-media-ratio: 3 / 2;
	--mbfs-media-ratio-m: 4 / 5;
	--mbfs-shadow: 0 18px 48px rgba(13, 13, 23, 0.06);

	--mbfs-title-size: 38px;
	--mbfs-title-lh: 46px;
	--mbfs-title-ls: -1.5px;
	--mbfs-title-lines: 2;
	--mbfs-title-lines-m: 3;

	--mbfs-excerpt-size: 16px;
	--mbfs-excerpt-lh: 24px;
	--mbfs-excerpt-lines: 4;
	--mbfs-excerpt-lines-m: 6;

	--mbfs-dot: #cfd3dc;
	--mbfs-dot-active: #0a4dfa;
	--mbfs-fade-speed: 0.6s;

	--mbfs-vw: 100vw;

	--mbfs-font: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}

/* --------------------------------------------------------------- Hard reset */

.mbfs-section {
	display: block !important;
	box-sizing: border-box !important;
	width: 100% !important;
	max-width: none !important;
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	background: none !important;
	box-shadow: none !important;
	float: none !important;
	clear: both !important;
	font-family: var(--mbfs-font) !important;
	font-size: 16px !important;
	line-height: 1.5 !important;
	letter-spacing: normal !important;
	text-align: left !important;
	text-transform: none !important;
	color: var(--mbfs-title) !important;
	-webkit-font-smoothing: antialiased;
}

.mbfs-section *,
.mbfs-section *::before,
.mbfs-section *::after {
	box-sizing: border-box !important;
}

.mbfs-section div,
.mbfs-section span,
.mbfs-section p,
.mbfs-section h2,
.mbfs-section h3,
.mbfs-section a,
.mbfs-section button,
.mbfs-section img {
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	border-radius: 0 !important;
	background: none !important;
	box-shadow: none !important;
	text-shadow: none !important;
	text-decoration: none !important;
	text-transform: none !important;
	text-align: inherit !important;
	letter-spacing: normal !important;
	font-family: inherit !important;
	font-size: inherit !important;
	font-weight: inherit !important;
	font-style: normal !important;
	line-height: inherit !important;
	color: inherit !important;
	float: none !important;
	min-width: 0 !important;
	min-height: 0 !important;
	max-width: none !important;
	max-height: none !important;
	list-style: none !important;
}

.mbfs-section h2::before,
.mbfs-section h2::after,
.mbfs-section h3::before,
.mbfs-section h3::after,
.mbfs-section a::before,
.mbfs-section a::after {
	content: none !important;
	display: none !important;
}

.mbfs-section button {
	-webkit-appearance: none !important;
	appearance: none !important;
	outline: none;
	cursor: pointer !important;
}

.mbfs-section img {
	display: block !important;
	vertical-align: middle !important;
}

/* --------------------------------------------------------------- Container */

.mbfs-section.mbfs-section--full {
	width: var(--mbfs-vw) !important;
	max-width: var(--mbfs-vw) !important;
	margin-left: calc(50% - (var(--mbfs-vw) / 2)) !important;
	margin-right: calc(50% - (var(--mbfs-vw) / 2)) !important;
}

.mbfs-section .mbfs-container {
	position: relative !important;
	display: block !important;
	width: 100% !important;
	max-width: var(--mbfs-max-width) !important;
	margin: 0 auto !important;
	padding: 0 var(--mbfs-gutter) !important;
}

/* ------------------------------------------------------------------- Track */

/* All slides share one grid cell, so the track is as tall as the tallest
   slide and nothing jumps when they cross-fade. */
.mbfs-section .mbfs-track {
	display: grid !important;
	grid-template-columns: minmax(0, 1fr) !important;
	position: relative !important;
	/* Vertical page scrolling still works; horizontal gestures come to us,
	   which is what makes the drag reliable on touch devices. */
	touch-action: pan-y !important;
}

.mbfs-section .mbfs-slide {
	grid-column: 1 !important;
	grid-row: 1 !important;
	opacity: 0 !important;
	visibility: hidden !important;
	pointer-events: none !important;
	transition: opacity var(--mbfs-fade-speed) ease, transform var(--mbfs-fade-speed) ease, visibility 0s linear var(--mbfs-fade-speed) !important;
}

.mbfs-section .mbfs-slide.is-active {
	opacity: 1 !important;
	visibility: visible !important;
	pointer-events: auto !important;
	transition: opacity var(--mbfs-fade-speed) ease, transform var(--mbfs-fade-speed) ease, visibility 0s !important;
	z-index: 1 !important;
}

/* While a finger is down the slide must track it exactly — no easing. */
.mbfs-section .mbfs-track.is-dragging .mbfs-slide {
	transition: none !important;
}

.mbfs-section .mbfs-track.is-dragging,
.mbfs-section .mbfs-track.is-dragging .mbfs-slide__link {
	-webkit-user-select: none !important;
	user-select: none !important;
}

/* -------------------------------------------------------------------- Card */

.mbfs-section .mbfs-slide__link,
.mbfs-section .mbfs-slide__link:link,
.mbfs-section .mbfs-slide__link:visited,
.mbfs-section .mbfs-slide__link:hover,
.mbfs-section .mbfs-slide__link:focus,
.mbfs-section .mbfs-slide__link:active {
	display: grid !important;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
	align-items: center !important;
	gap: var(--mbfs-gap) !important;
	width: 100% !important;
	/* Fill the track so a short slide's card matches the tallest one. */
	height: 100% !important;
	margin: 0 !important;
	padding: var(--mbfs-pad) !important;
	border: 0 !important;
	border-radius: var(--mbfs-card-radius) !important;
	background: var(--mbfs-card-bg) !important;
	box-shadow: var(--mbfs-shadow) !important;
	color: inherit !important;
	text-decoration: none !important;
}

.mbfs-section .mbfs-slide__link:focus-visible {
	outline: 2px solid var(--mbfs-accent) !important;
	outline-offset: 3px !important;
}

.mbfs-section .mbfs-slide__media {
	position: relative !important;
	display: block !important;
	width: 100% !important;
	aspect-ratio: var(--mbfs-media-ratio) !important;
	margin: 0 !important;
	padding: 0 !important;
	overflow: hidden !important;
	border-radius: var(--mbfs-media-radius) !important;
	background: #eef2ff !important;
}

@supports not (aspect-ratio: 3 / 2) {
	.mbfs-section .mbfs-slide__media {
		height: 0 !important;
		padding-bottom: 66.66% !important;
	}
}

.mbfs-section .mbfs-slide__media img {
	position: absolute !important;
	top: 0 !important;
	left: 0 !important;
	right: 0 !important;
	bottom: 0 !important;
	display: block !important;
	width: 100% !important;
	max-width: 100% !important;
	height: 100% !important;
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	border-radius: inherit !important;
	box-shadow: none !important;
	object-fit: cover !important;
}

.mbfs-section .mbfs-slide__media--placeholder {
	background-color: #2f6bff !important;
	background-image:
		radial-gradient(120% 120% at 78% 92%, #38e1f5 0%, rgba(56, 225, 245, 0) 55%),
		radial-gradient(120% 110% at 92% 12%, #b9dcff 0%, rgba(185, 220, 255, 0) 60%),
		linear-gradient(135deg, #2f5cff 0%, #6ea6ff 42%, #d8ecff 72%, #7fe4f7 100%) !important;
}

.mbfs-section .mbfs-slide__body {
	display: block !important;
	min-width: 0 !important;
	padding: 0 !important;
}

/* transparent="yes": no card panel at all, so nothing is inset from the
   container edges either. The vars are set inline by the shortcode. */
.mbfs-section.mbfs-section--bare .mbfs-slide__body {
	padding: 0 !important;
}

/* ---------------------------------------------------------------- Meta row */

.mbfs-section .mbfs-meta {
	display: flex !important;
	flex-direction: row !important;
	flex-wrap: wrap !important;
	align-items: center !important;
	gap: 16px !important;
	margin: 0 0 20px !important;
}

.mbfs-section .mbfs-badge {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	height: 28px !important;
	padding: 0 12px !important;
	border-radius: 6px !important;
	background: var(--mbfs-accent) !important;
	font-family: var(--mbfs-font) !important;
	font-size: 14px !important;
	line-height: 1 !important;
	font-weight: 600 !important;
	letter-spacing: 0.02em !important;
	text-transform: uppercase !important;
	color: #ffffff !important;
	white-space: nowrap !important;
}

.mbfs-section .mbfs-category {
	display: inline-block !important;
	font-family: var(--mbfs-font) !important;
	font-size: 14px !important;
	line-height: 1.2 !important;
	font-weight: 700 !important;
	letter-spacing: 0.06em !important;
	text-transform: uppercase !important;
	color: var(--mbfs-accent) !important;
}

/* --------------------------------------------------------------- Type */

.mbfs-section .mbfs-title {
	margin: 0 0 16px !important;
	padding: 0 !important;
	overflow-wrap: break-word !important;
	word-wrap: break-word !important;
	font-family: var(--mbfs-font) !important;
	font-size: var(--mbfs-title-size) !important;
	line-height: var(--mbfs-title-lh) !important;
	font-weight: 600 !important;
	letter-spacing: var(--mbfs-title-ls) !important;
	text-transform: none !important;
	color: var(--mbfs-title) !important;

	display: -webkit-box !important;
	-webkit-line-clamp: var(--mbfs-title-lines) !important;
	line-clamp: var(--mbfs-title-lines) !important;
	-webkit-box-orient: vertical !important;
	overflow: hidden !important;
	/* No min-height: slides already share one grid cell, so the track is as
	   tall as the tallest slide. Reserving line heights here would leave a
	   gap under short titles. */
}

.mbfs-section .mbfs-excerpt {
	margin: 0 !important;
	padding: 0 !important;
	overflow-wrap: break-word !important;
	word-wrap: break-word !important;
	font-family: var(--mbfs-font) !important;
	font-size: var(--mbfs-excerpt-size) !important;
	line-height: var(--mbfs-excerpt-lh) !important;
	font-weight: 400 !important;
	letter-spacing: normal !important;
	text-transform: none !important;
	color: var(--mbfs-body) !important;

	display: -webkit-box !important;
	-webkit-line-clamp: var(--mbfs-excerpt-lines) !important;
	line-clamp: var(--mbfs-excerpt-lines) !important;
	-webkit-box-orient: vertical !important;
	overflow: hidden !important;
}

/* -------------------------------------------------------------------- Dots */

.mbfs-section .mbfs-dots {
	display: flex !important;
	flex-direction: row !important;
	align-items: center !important;
	justify-content: center !important;
	gap: 8px !important;
	margin: 24px 0 0 !important;
	padding: 0 !important;
}

.mbfs-section .mbfs-dot {
	display: block !important;
	width: 8px !important;
	height: 8px !important;
	min-height: 0 !important;
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	border-radius: 50% !important;
	background: var(--mbfs-dot) !important;
	box-shadow: none !important;
	font-size: 0 !important;
	line-height: 0 !important;
	cursor: pointer !important;
	transition: background-color 0.25s ease, transform 0.25s ease;
}

.mbfs-section .mbfs-dot:hover {
	background: #b3b8c4 !important;
}

.mbfs-section .mbfs-dot.is-active {
	background: var(--mbfs-dot-active) !important;
	transform: scale(1.15);
}

.mbfs-section .mbfs-dot:focus-visible {
	outline: 2px solid var(--mbfs-accent) !important;
	outline-offset: 3px !important;
}

/* -------------------------------------------------------------- Responsive */

@media (max-width: 1200px) {
	.mbfs-section {
		--mbfs-gutter: 32px;
		--mbfs-title-size: 32px;
		--mbfs-title-lh: 40px;
	}
}

@media (max-width: 900px) {
	.mbfs-section {
		--mbfs-gutter: 20px;
		--mbfs-pad: 12px;
		--mbfs-gap: 12px;
		--mbfs-title-size: 32px;
		--mbfs-title-lh: 40px;
		--mbfs-title-ls: -2px;
	}

	/* Stack: image above, copy below. */
	.mbfs-section .mbfs-slide__link,
	.mbfs-section .mbfs-slide__link:link,
	.mbfs-section .mbfs-slide__link:visited,
	.mbfs-section .mbfs-slide__link:hover,
	.mbfs-section .mbfs-slide__link:focus,
	.mbfs-section .mbfs-slide__link:active {
		grid-template-columns: minmax(0, 1fr) !important;
		align-items: start !important;
		/* Rows would otherwise stretch to fill the tallest slide's height and
		   open a gap between the image and the copy on a short slide. */
		align-content: start !important;
	}

	.mbfs-section .mbfs-slide__media {
		aspect-ratio: var(--mbfs-media-ratio-m) !important;
	}

	.mbfs-section .mbfs-slide__body {
		padding: 0 4px 8px !important;
	}

	.mbfs-section .mbfs-meta {
		gap: 12px !important;
		margin-bottom: 12px !important;
	}

	.mbfs-section .mbfs-badge {
		height: 24px !important;
		padding: 0 10px !important;
		font-size: 12px !important;
	}

	.mbfs-section .mbfs-category {
		font-size: 12px !important;
	}

	.mbfs-section .mbfs-title {
		-webkit-line-clamp: var(--mbfs-title-lines-m) !important;
		line-clamp: var(--mbfs-title-lines-m) !important;
		margin-bottom: 12px !important;
	}

	.mbfs-section .mbfs-excerpt {
		-webkit-line-clamp: var(--mbfs-excerpt-lines-m) !important;
		line-clamp: var(--mbfs-excerpt-lines-m) !important;
	}
}

@media (prefers-reduced-motion: reduce) {
	.mbfs-section .mbfs-slide {
		transition: none !important;
	}

	.mbfs-section .mbfs-dot {
		transition: none !important;
	}
}

/* ==========================================================================
   Single post layout — [manpack_blog_details]
   Sticky panel (author / contents / share) + article body.
   The panel is isolated like the other sections; the article body is styled
   with a lighter touch so blocks, embeds and galleries keep working.
   ========================================================================== */

.mbfd-section {
	--mbfd-max-width: 1440px;
	/* No side padding: the Elementor/theme container already supplies it.
	   Raise --mbfd-gutter if you need the section to add its own. */
	--mbfd-gutter: 0px;
	--mbfd-sidebar: 400px;
	--mbfd-gap: 52px;
	--mbfd-panel-gap: 24px;
	--mbfd-offset: 24px;

	--mbfd-accent: #0a4dfa;
	--mbfd-title: #0d0d17;
	--mbfd-body: #6b6b76;
	--mbfd-border: #e8e8ec;
	--mbfd-panel-bg: #ffffff;
	--mbfd-authorbox-bg: #f8f8fe;
	--mbfd-panel-radius: 30px;
	--mbfd-panel-pad: 32px 48px;
	--mbfd-shadow: 0 0 8px rgba(165, 168, 243, 0.25);

	--mbfd-text-size: 16px;
	--mbfd-text-lh: 24px;
	--mbfd-h2-size: 32px;
	--mbfd-h2-lh: 42px;
	--mbfd-h3-size: 24px;
	--mbfd-h3-lh: 32px;

	--mbfd-vw: 100vw;
	--mbfd-font: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;

	display: block !important;
	box-sizing: border-box !important;
	width: 100% !important;
	max-width: none !important;
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	background: none !important;
	font-family: var(--mbfd-font) !important;
	color: var(--mbfd-title) !important;
	-webkit-font-smoothing: antialiased;
}

.mbfd-section *,
.mbfd-section *::before,
.mbfd-section *::after {
	box-sizing: border-box !important;
}

/* Hard reset for the chrome only — panel, tags, author box, popup. The
   article body (.mbfd-entry) is deliberately excluded: resetting rendered
   post content would break blocks, embeds and galleries.

   :where() keeps the element part at zero specificity, so these rules sit at
   0,2,0 — high enough to beat theme rules on bare elements, and equal to the
   component rules below, which win on source order. */
.mbfd-section .mbfd-panel :where(div, span, p, h2, h3, a, nav, ul, li, img, svg, button),
.mbfd-section .mbfd-tags :where(a, span),
.mbfd-section .mbfd-authorbox :where(div, span, p, a, img, svg),
.mbfd-section .mbfd-toc-fab :where(span, svg),
.mbfd-modal .mbfd-modal__panel :where(div, span, h2, nav, ul, li, a, button, svg) {
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	border-radius: 0 !important;
	background: none !important;
	box-shadow: none !important;
	text-shadow: none !important;
	text-decoration: none !important;
	text-transform: none !important;
	text-align: left !important;
	letter-spacing: normal !important;
	font-family: inherit !important;
	font-size: inherit !important;
	font-weight: inherit !important;
	font-style: normal !important;
	line-height: inherit !important;
	color: inherit !important;
	float: none !important;
	min-width: 0 !important;
	min-height: 0 !important;
	max-width: none !important;
	max-height: none !important;
	list-style: none !important;
	text-indent: 0 !important;
}

/* Themes hang decorative bars and counters off these. */
.mbfd-section .mbfd-panel :where(h2, h3, a, li)::before,
.mbfd-section .mbfd-panel :where(h2, h3, a, li)::after,
.mbfd-section .mbfd-authorbox :where(span, a)::before,
.mbfd-section .mbfd-authorbox :where(span, a)::after,
.mbfd-modal .mbfd-modal__panel :where(h2, a, li)::before,
.mbfd-modal .mbfd-modal__panel :where(h2, a, li)::after {
	content: none !important;
	display: none !important;
}

.mbfd-section .mbfd-panel :where(button),
.mbfd-section :where(.mbfd-toc-fab),
.mbfd-modal .mbfd-modal__panel :where(button) {
	-webkit-appearance: none !important;
	appearance: none !important;
	text-indent: 0 !important;
	vertical-align: middle !important;
}

.mbfd-section .mbfd-panel :where(img),
.mbfd-section .mbfd-authorbox :where(img) {
	display: block !important;
	vertical-align: middle !important;
	width: auto;
	height: auto;
}

/* Inline icons carry their size in attributes, which a theme rule on bare
   `svg` overrides — so state it in CSS too. */
.mbfd-section .mbfd-toc-fab svg {
	flex: 0 0 auto !important;
	width: 18px !important;
	height: 18px !important;
}

.mbfd-section .mbfd-authorbox__linkedin img,
.mbfd-section .mbfd-authorbox__linkedin svg {
	flex: 0 0 auto !important;
	display: block !important;
	width: 24px !important;
	height: 25px !important;
	max-width: none !important;
	margin: 0 !important;
	border: 0 !important;
	border-radius: 0 !important;
	box-shadow: none !important;
}

.mbfd-section [hidden],
.mbfd-modal[hidden] {
	display: none !important;
}

/* Belt and braces: a full-viewport fixed layer must never intercept clicks
   while it is closed, even if something strips the hidden attribute. */
.mbfd-modal:not(.is-open) {
	pointer-events: none !important;
}

.mbfd-modal.is-open {
	pointer-events: auto !important;
}

.mbfd-section.mbfd-section--full {
	width: var(--mbfd-vw) !important;
	max-width: var(--mbfd-vw) !important;
	margin-left: calc(50% - (var(--mbfd-vw) / 2)) !important;
	margin-right: calc(50% - (var(--mbfd-vw) / 2)) !important;
}

.mbfd-section .mbfd-container {
	width: 100% !important;
	max-width: var(--mbfd-max-width) !important;
	margin: 0 auto !important;
	padding: 0 var(--mbfd-gutter) !important;
}

/* Structural elements restate width/max-width explicitly: a theme rule on
   bare `div` would otherwise collapse the whole layout. */
.mbfd-section .mbfd-layout {
	display: grid !important;
	grid-template-columns: var(--mbfd-sidebar) minmax(0, 1fr) !important;
	gap: var(--mbfd-gap) !important;
	align-items: start !important;
	width: 100% !important;
	max-width: none !important;
	margin: 0 !important;
	padding: 0 !important;
	float: none !important;
}

.mbfd-section.mbfd-section--sidebar-right .mbfd-layout {
	grid-template-columns: minmax(0, 1fr) var(--mbfd-sidebar) !important;
}

.mbfd-section.mbfd-section--sidebar-right .mbfd-sidebar {
	order: 2 !important;
}

.mbfd-section.mbfd-section--no-sidebar .mbfd-layout {
	grid-template-columns: minmax(0, 1fr) !important;
}

/* ------------------------------------------------------------ Sticky panel */

.mbfd-section .mbfd-sidebar {
	position: -webkit-sticky !important;
	position: sticky !important;
	top: var(--mbfd-offset) !important;
	align-self: start !important;
	min-width: 0 !important;
	width: auto !important;
	max-width: none !important;
	margin: 0 !important;
	padding: 0 !important;
	float: none !important;
}

.mbfd-section .mbfd-panel {
	display: flex !important;
	flex-direction: column !important;
	gap: var(--mbfd-panel-gap) !important;
	width: auto !important;
	max-width: none !important;
	float: none !important;
	margin: 0 !important;
	padding: var(--mbfd-panel-pad) !important;
	border: 0 !important;
	border-radius: var(--mbfd-panel-radius) !important;
	background: var(--mbfd-panel-bg) !important;
	box-shadow: var(--mbfd-shadow) !important;
	max-height: calc(100vh - (var(--mbfd-offset) * 2)) !important;
	overflow-y: auto !important;
	scrollbar-width: thin !important;
}

.mbfd-section .mbfd-divider {
	display: block !important;
	height: 1px !important;
	flex: 0 0 auto !important;
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	background: var(--mbfd-border) !important;
}

.mbfd-section .mbfd-panel__title {
	display: block !important;
	margin: 0 0 16px !important;
	padding: 0 !important;
	font-family: var(--mbfd-font) !important;
	font-size: 18px !important;
	line-height: 30px !important;
	font-weight: 600 !important;
	color: var(--mbfd-title) !important;
	text-align: left !important;
	letter-spacing: normal !important;
}

.mbfd-section .mbfd-panel__title--toc {
	text-transform: uppercase !important;
	letter-spacing: 0.04em !important;
}

.mbfd-section .mbfd-panel__title::before,
.mbfd-section .mbfd-panel__title::after {
	content: none !important;
	display: none !important;
}

/* ----------------------------------------------------------------- Author */

.mbfd-section .mbfd-author {
	display: flex !important;
	flex-direction: row !important;
	align-items: center !important;
	gap: 16px !important;
	margin: 0 !important;
	padding: 0 !important;
}

.mbfd-section .mbfd-author__avatar {
	display: block !important;
	flex: 0 0 auto !important;
	width: 61px !important;
	height: 61px !important;
	max-width: none !important;
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	border-radius: 50% !important;
	object-fit: cover !important;
	box-shadow: none !important;
}

.mbfd-section .mbfd-author__meta {
	display: flex !important;
	flex-direction: column !important;
	gap: 2px !important;
	min-width: 0 !important;
}

.mbfd-section .mbfd-author__name {
	font-size: 20px !important;
	line-height: 28px !important;
	font-weight: 600 !important;
	letter-spacing: -0.2px !important;
	color: var(--mbfd-title) !important;
}

.mbfd-section .mbfd-author__role {
	font-size: 15px !important;
	line-height: 22px !important;
	font-weight: 400 !important;
	color: var(--mbfd-body) !important;
}

/* -------------------------------------------------------- Table of contents */

.mbfd-section .mbfd-toc__list {
	display: flex !important;
	flex-direction: column !important;
	gap: 16px !important;
	margin: 0 !important;
	padding: 0 !important;
	list-style: none !important;
}

.mbfd-section .mbfd-toc__item {
	margin: 0 !important;
	padding: 0 !important;
	list-style: none !important;
}

.mbfd-section .mbfd-toc__item::before,
.mbfd-section .mbfd-toc__item::marker {
	content: none !important;
}

/* Indent by depth relative to the shallowest heading in the post, so a post
   written entirely in h5 is not indented at all. */
.mbfd-section .mbfd-toc__item--d1 .mbfd-toc__link {
	padding-left: 24px !important;
}

.mbfd-section .mbfd-toc__item--d2 .mbfd-toc__link {
	padding-left: 34px !important;
}

.mbfd-section .mbfd-toc__item--d3 .mbfd-toc__link {
	padding-left: 44px !important;
}

/* The active marker sits outside the text, so every label stays aligned. */
.mbfd-section .mbfd-toc__link,
.mbfd-section .mbfd-toc__link:link,
.mbfd-section .mbfd-toc__link:visited {
	display: block !important;
	margin-left: -13px !important;
	padding: 0 0 0 11px !important;
	border: 0 !important;
	border-left: 2px solid transparent !important;
	border-radius: 0 !important;
	background: none !important;
	box-shadow: none !important;
	font-family: var(--mbfd-font) !important;
	font-size: 16px !important;
	line-height: 24px !important;
	font-weight: 400 !important;
	letter-spacing: normal !important;
	text-transform: none !important;
	text-decoration: none !important;
	color: var(--mbfd-body) !important;
	transition: color 0.18s ease, border-color 0.18s ease;
}

.mbfd-section .mbfd-toc__link:hover {
	color: var(--mbfd-title) !important;
}

.mbfd-section .mbfd-toc__link.is-active {
	color: var(--mbfd-accent) !important;
	font-weight: 600 !important;
	border-left-color: var(--mbfd-accent) !important;
}

.mbfd-section .mbfd-toc__link:focus-visible {
	outline: 2px solid var(--mbfd-accent) !important;
	outline-offset: 2px !important;
}

/* ------------------------------------------------------------------ Share */

.mbfd-section .mbfd-share__links {
	display: flex !important;
	flex-direction: row !important;
	align-items: center !important;
	gap: 12px !important;
}

.mbfd-section .mbfd-share__link,
.mbfd-section .mbfd-share__link:link,
.mbfd-section .mbfd-share__link:visited {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	width: 24px !important;
	height: 24px !important;
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	background: none !important;
	box-shadow: none !important;
	text-decoration: none !important;
	transition: transform 0.18s ease, opacity 0.18s ease;
}

.mbfd-section .mbfd-share__link:hover {
	transform: translateY(-2px);
	opacity: 0.9;
}

.mbfd-section .mbfd-share__link img {
	display: block !important;
	width: 24px !important;
	height: 24px !important;
	max-width: none !important;
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	border-radius: 0 !important;
	box-shadow: none !important;
}

/* ------------------------------------------------------------ Article body */

.mbfd-section .mbfd-content {
	min-width: 0 !important;
	width: auto !important;
	max-width: none !important;
	margin: 0 !important;
	padding: 0 !important;
	float: none !important;
}

.mbfd-section .mbfd-entry {
	width: auto !important;
	max-width: none !important;
	margin: 0 !important;
	padding: 0 !important;
	float: none !important;
	font-family: var(--mbfd-font) !important;
	font-size: var(--mbfd-text-size) !important;
	line-height: var(--mbfd-text-lh) !important;
	color: var(--mbfd-body) !important;
	text-align: left !important;
}

.mbfd-section .mbfd-entry > *:first-child {
	margin-top: 0 !important;
}

.mbfd-section .mbfd-entry > *:last-child {
	margin-bottom: 0 !important;
}

.mbfd-section .mbfd-entry p,
.mbfd-section .mbfd-entry li {
	font-family: var(--mbfd-font) !important;
	font-size: var(--mbfd-text-size) !important;
	line-height: var(--mbfd-text-lh) !important;
	color: var(--mbfd-body) !important;
}

.mbfd-section .mbfd-entry p {
	margin: 0 0 24px !important;
}

/* Every heading level clears the sticky offset when the ToC jumps to it —
   including ones a page builder rendered. */
.mbfd-section .mbfd-entry h1,
.mbfd-section .mbfd-entry h2,
.mbfd-section .mbfd-entry h3,
.mbfd-section .mbfd-entry h4,
.mbfd-section .mbfd-entry h5,
.mbfd-section .mbfd-entry h6 {
	scroll-margin-top: calc(var(--mbfd-offset) + 24px) !important;
}

/* Typography is applied only to headings the builder has NOT styled, so an
   Elementor heading widget keeps the look it was designed with. */
.mbfd-section .mbfd-entry h2:not([class*="elementor-"]),
.mbfd-section .mbfd-entry h3:not([class*="elementor-"]),
.mbfd-section .mbfd-entry h4:not([class*="elementor-"]) {
	font-family: var(--mbfd-font) !important;
	font-weight: 600 !important;
	color: var(--mbfd-title) !important;
	text-transform: none !important;
}

.mbfd-section .mbfd-entry h2:not([class*="elementor-"]) {
	margin: 40px 0 20px !important;
	font-size: var(--mbfd-h2-size) !important;
	line-height: var(--mbfd-h2-lh) !important;
	letter-spacing: -0.8px !important;
}

.mbfd-section .mbfd-entry h3:not([class*="elementor-"]) {
	margin: 32px 0 16px !important;
	font-size: var(--mbfd-h3-size) !important;
	line-height: var(--mbfd-h3-lh) !important;
	letter-spacing: -0.4px !important;
}

.mbfd-section .mbfd-entry h4:not([class*="elementor-"]) {
	margin: 28px 0 14px !important;
	font-size: 20px !important;
	line-height: 28px !important;
}

.mbfd-section .mbfd-entry h2::before,
.mbfd-section .mbfd-entry h2::after,
.mbfd-section .mbfd-entry h3::before,
.mbfd-section .mbfd-entry h3::after {
	content: none !important;
	display: none !important;
}

.mbfd-section .mbfd-entry a {
	color: var(--mbfd-accent) !important;
	text-decoration: underline !important;
	text-underline-offset: 2px !important;
}

.mbfd-section .mbfd-entry img,
.mbfd-section .mbfd-entry iframe,
.mbfd-section .mbfd-entry video {
	max-width: 100% !important;
	height: auto !important;
	border-radius: 12px !important;
}

/* Neutralise theme borders/margins on content media — but never on an image
   the editor deliberately styled or aligned. */
.mbfd-section .mbfd-entry img:not([style*="border"]):not([class*="has-border"]) {
	border: 0 !important;
	box-shadow: none !important;
}

.mbfd-section .mbfd-entry img:not([class*="align"]):not([style*="margin"]) {
	margin: 0 !important;
}

.mbfd-section .mbfd-entry figure {
	margin: 32px 0 !important;
}

.mbfd-section .mbfd-entry ul,
.mbfd-section .mbfd-entry ol {
	margin: 0 0 24px !important;
	padding-left: 22px !important;
}

/* Restore markers themes strip, and undo justified body text — but leave
   deliberately aligned blocks (has-text-align-*) alone. */
.mbfd-section .mbfd-entry ul {
	list-style: disc !important;
}

.mbfd-section .mbfd-entry ol {
	list-style: decimal !important;
}

.mbfd-section .mbfd-entry p:not([class*="has-text-align"]),
.mbfd-section .mbfd-entry li:not([class*="has-text-align"]),
.mbfd-section .mbfd-entry h2:not([class*="has-text-align"]):not([class*="elementor-"]),
.mbfd-section .mbfd-entry h3:not([class*="has-text-align"]):not([class*="elementor-"]),
.mbfd-section .mbfd-entry h4:not([class*="has-text-align"]):not([class*="elementor-"]) {
	text-align: left !important;
}

.mbfd-section .mbfd-entry li {
	margin: 0 0 8px !important;
}

.mbfd-section .mbfd-entry blockquote {
	margin: 32px 0 !important;
	padding: 4px 0 4px 20px !important;
	border-left: 3px solid var(--mbfd-accent) !important;
	font-style: normal !important;
}

/* ------------------------------------------------------------------- Tags */

.mbfd-section .mbfd-tags {
	display: flex !important;
	flex-wrap: wrap !important;
	gap: 8px !important;
	margin: 40px 0 0 !important;
	padding: 24px 0 0 !important;
	border-top: 1px solid var(--mbfd-border) !important;
}

.mbfd-section .mbfd-tag {
	display: inline-flex !important;
	align-items: center !important;
	margin: 0 !important;
	padding: 5px 14px !important;
	border: 1px solid var(--mbfd-border) !important;
	border-radius: 999px !important;
	background: none !important;
	box-shadow: none !important;
	font-family: var(--mbfd-font) !important;
	font-size: 13px !important;
	line-height: 20px !important;
	font-weight: 500 !important;
	text-decoration: none !important;
	text-transform: none !important;
	color: var(--mbfd-body) !important;
	/* Labels, not links. */
	cursor: default !important;
	white-space: nowrap !important;
}



/* ------------------------------------------------------------- Author box */

.mbfd-section .mbfd-authorbox {
	display: flex !important;
	flex-direction: row !important;
	align-items: flex-start !important;
	gap: 18px !important;
	margin: 32px 0 0 !important;
	padding: 32px !important;
	border: 0 !important;
	border-radius: 30px !important;
	background: var(--mbfd-authorbox-bg) !important;
}

.mbfd-section .mbfd-authorbox__avatar {
	display: block !important;
	flex: 0 0 auto !important;
	width: 80px !important;
	height: 80px !important;
	max-width: none !important;
	margin: 0 !important;
	border-radius: 50% !important;
	object-fit: cover !important;
}

.mbfd-section .mbfd-authorbox__body {
	min-width: 0 !important;
}

.mbfd-section .mbfd-authorbox__head {
	display: flex !important;
	align-items: center !important;
	gap: 10px !important;
	margin: 0 0 10px !important;
}

.mbfd-section .mbfd-authorbox__name {
	font-size: 20px !important;
	line-height: 28px !important;
	font-weight: 600 !important;
	color: var(--mbfd-title) !important;
}

.mbfd-section .mbfd-authorbox__linkedin {
	display: inline-flex !important;
	align-items: center !important;
	flex: 0 0 auto !important;
	width: 24px !important;
	height: 25px !important;
	background: none !important;
	box-shadow: none !important;
	text-decoration: none !important;
}

.mbfd-section .mbfd-authorbox__bio {
	margin: 0 !important;
	font-size: 16px !important;
	line-height: 24px !important;
	color: var(--mbfd-body) !important;
}

/* --------------------------------------------------- Mobile ToC (popup) */

.mbfd-section .mbfd-toc-fab {
	display: none !important;
	position: fixed !important;
	left: 50% !important;
	bottom: 20px !important;
	transform: translateX(-50%) !important;
	z-index: 99990 !important;
	align-items: center !important;
	gap: 8px !important;
	/* Themes size bare buttons hard — restate every box property. */
	width: auto !important;
	max-width: calc(100% - 40px) !important;
	height: auto !important;
	min-width: 0 !important;
	min-height: 0 !important;
	margin: 0 !important;
	padding: 11px 20px !important;
	border: 0 !important;
	border-radius: 999px !important;
	background: var(--mbfd-accent) !important;
	box-shadow: 0 10px 28px rgba(10, 77, 250, 0.32) !important;
	font-family: var(--mbfd-font) !important;
	font-size: 14px !important;
	line-height: 1 !important;
	font-weight: 600 !important;
	letter-spacing: normal !important;
	text-transform: none !important;
	color: #ffffff !important;
	cursor: pointer !important;
	-webkit-appearance: none !important;
	appearance: none !important;
}

.mbfd-modal {
	position: fixed !important;
	inset: 0 !important;
	z-index: 99991 !important;
	display: block !important;
}

.mbfd-modal[hidden] {
	display: none !important;
}

/* Belt and braces: a full-viewport fixed layer must never intercept clicks
   while it is closed, even if something strips the hidden attribute. */
.mbfd-modal:not(.is-open) {
	pointer-events: none !important;
}

.mbfd-modal.is-open {
	pointer-events: auto !important;
}

.mbfd-modal .mbfd-modal__backdrop {
	position: absolute !important;
	inset: 0 !important;
	background: rgba(13, 13, 23, 0.45) !important;
	opacity: 0;
	transition: opacity 0.24s ease;
}

.mbfd-modal .mbfd-modal__panel {
	position: absolute !important;
	left: 0 !important;
	right: 0 !important;
	bottom: 0 !important;
	max-height: 78vh !important;
	display: flex !important;
	flex-direction: column !important;
	padding: 8px 20px 24px !important;
	border-radius: 20px 20px 0 0 !important;
	background: #ffffff !important;
	transform: translateY(100%);
	transition: transform 0.28s cubic-bezier(0.22, 1, 0.36, 1);
}

.mbfd-modal.is-open .mbfd-modal__backdrop {
	opacity: 1;
}

.mbfd-modal.is-open .mbfd-modal__panel {
	transform: translateY(0);
}

.mbfd-modal .mbfd-modal__head {
	display: flex !important;
	align-items: center !important;
	justify-content: space-between !important;
	gap: 16px !important;
	padding: 12px 0 8px !important;
}

.mbfd-modal .mbfd-modal__title {
	margin: 0 !important;
	font-family: var(--mbfd-font, "Inter", sans-serif) !important;
	font-size: 16px !important;
	line-height: 24px !important;
	font-weight: 600 !important;
	text-transform: uppercase !important;
	letter-spacing: 0.04em !important;
	color: #0d0d17 !important;
}

.mbfd-modal .mbfd-modal__close {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	width: 32px !important;
	height: 32px !important;
	min-width: 0 !important;
	min-height: 0 !important;
	max-width: none !important;
	flex: 0 0 auto !important;
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	border-radius: 50% !important;
	background: #f2f2f6 !important;
	font-size: 20px !important;
	line-height: 1 !important;
	color: #0d0d17 !important;
	cursor: pointer !important;
	-webkit-appearance: none !important;
	appearance: none !important;
}

.mbfd-modal .mbfd-modal__body {
	overflow-y: auto !important;
	padding: 8px 0 !important;
	-webkit-overflow-scrolling: touch;
}

/* The modal is outside .mbfd-section, so restate the link styling. */
.mbfd-modal .mbfd-toc__list {
	display: flex !important;
	flex-direction: column !important;
	gap: 18px !important;
	margin: 0 !important;
	padding: 0 !important;
	list-style: none !important;
}

.mbfd-modal .mbfd-toc__item {
	margin: 0 !important;
	padding: 0 !important;
	list-style: none !important;
}

.mbfd-modal .mbfd-toc__item--d1 .mbfd-toc__link {
	padding-left: 24px !important;
}

.mbfd-modal .mbfd-toc__item--d2 .mbfd-toc__link {
	padding-left: 34px !important;
}

.mbfd-modal .mbfd-toc__item--d3 .mbfd-toc__link {
	padding-left: 44px !important;
}

.mbfd-modal .mbfd-toc__link,
.mbfd-modal .mbfd-toc__link:link,
.mbfd-modal .mbfd-toc__link:visited {
	display: block !important;
	margin: 0 !important;
	padding: 0 0 0 11px !important;
	border: 0 !important;
	border-left: 2px solid transparent !important;
	background: none !important;
	box-shadow: none !important;
	font-family: var(--mbfd-font, "Inter", sans-serif) !important;
	font-size: 16px !important;
	line-height: 24px !important;
	font-weight: 400 !important;
	text-decoration: none !important;
	text-transform: none !important;
	color: #6b6b76 !important;
}

.mbfd-modal .mbfd-toc__link.is-active {
	color: #0a4dfa !important;
	font-weight: 600 !important;
	border-left-color: #0a4dfa !important;
}

/* -------------------------------------------------------------- Responsive */

@media (max-width: 1200px) {
	.mbfd-section {
		--mbfd-sidebar: 340px;
		--mbfd-gap: 36px;
		--mbfd-panel-pad: 28px 28px;
	}
}

@media (max-width: 900px) {
	.mbfd-section {
		--mbfd-panel-pad: 24px 20px;
		--mbfd-h2-size: 26px;
		--mbfd-h2-lh: 34px;
		--mbfd-h3-size: 21px;
		--mbfd-h3-lh: 29px;
	}

	.mbfd-section .mbfd-layout {
		grid-template-columns: minmax(0, 1fr) !important;
		gap: 24px !important;
	}

	/* Panel stops being sticky, drops below the article, and the ToC moves
	   into the popup. */
	.mbfd-section .mbfd-content {
		order: 1 !important;
	}

	.mbfd-section .mbfd-sidebar,
	.mbfd-section.mbfd-section--sidebar-right .mbfd-sidebar {
		position: static !important;
		order: 2 !important;
	}

	.mbfd-section .mbfd-panel {
		max-height: none !important;
		overflow: visible !important;
	}

	.mbfd-section .mbfd-toc,
	.mbfd-section .mbfd-toc + .mbfd-divider {
		display: none !important;
	}

	.mbfd-section .mbfd-toc-fab {
		display: inline-flex !important;
	}

	.mbfd-section .mbfd-authorbox {
		flex-direction: column !important;
		gap: 14px !important;
		padding: 24px !important;
	}
}

@media (prefers-reduced-motion: reduce) {
	.mbfd-modal .mbfd-modal__panel,
	.mbfd-modal .mbfd-modal__backdrop,
	.mbfd-section .mbfd-share__link,
	.mbfd-section .mbfd-toc__link {
		transition: none !important;
	}
}

/* ==========================================================================
   Article footer — [manpack_article_footer]
   Rating card + previous/next navigation, shown only on the gated categories.
   Same isolation strategy as the other sections.
   ========================================================================== */

.mbfr-section {
	--mbfr-card-bg: #f8f8fe;
	--mbfr-card-radius: 24px;
	--mbfr-card-pad: 32px 24px;
	--mbfr-title: #6b6b76;
	--mbfr-nav: #9f9cab;
	--mbfr-nav-hover: #0d0d17;
	--mbfr-accent: #0a4dfa;
	--mbfr-face-size: 24px;
	--mbfr-font: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;

	display: block !important;
	box-sizing: border-box !important;
	width: 100% !important;
	max-width: none !important;
	margin: 40px 0 0 !important;
	padding: 0 !important;
	border: 0 !important;
	background: none !important;
	font-family: var(--mbfr-font) !important;
	text-align: left !important;
}

.mbfr-section *,
.mbfr-section *::before,
.mbfr-section *::after {
	box-sizing: border-box !important;
}

/* Chrome reset: themes style bare p, button, a and svg hard. */
.mbfr-section :where(div, p, span, a, button, nav, svg) {
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	border-radius: 0 !important;
	background: none !important;
	box-shadow: none !important;
	text-shadow: none !important;
	text-decoration: none !important;
	text-transform: none !important;
	letter-spacing: normal !important;
	font-family: inherit !important;
	font-size: inherit !important;
	font-weight: inherit !important;
	font-style: normal !important;
	line-height: inherit !important;
	color: inherit !important;
	float: none !important;
	min-width: 0 !important;
	min-height: 0 !important;
	max-width: none !important;
	max-height: none !important;
	list-style: none !important;
}

.mbfr-section :where(p, a, button)::before,
.mbfr-section :where(p, a, button)::after {
	content: none !important;
	display: none !important;
}

.mbfr-section :where(button) {
	-webkit-appearance: none !important;
	appearance: none !important;
	cursor: pointer !important;
	text-indent: 0 !important;
}

.mbfr-section [hidden] {
	display: none !important;
}

/* ------------------------------------------------------------ Rating card */

.mbfr-section .mbfr-rating {
	display: block !important;
	width: 100% !important;
	max-width: none !important;
	margin: 0 !important;
	padding: var(--mbfr-card-pad) !important;
	border: 0 !important;
	border-radius: var(--mbfr-card-radius) !important;
	background: var(--mbfr-card-bg) !important;
	text-align: center !important;
}

.mbfr-section .mbfr-rating__title {
	margin: 0 0 14px !important;
	font-family: var(--mbfr-font) !important;
	font-size: 16px !important;
	line-height: 24px !important;
	font-weight: 400 !important;
	color: var(--mbfr-title) !important;
	text-align: center !important;
}

.mbfr-section .mbfr-rating__faces {
	display: flex !important;
	flex-direction: row !important;
	flex-wrap: wrap !important;
	align-items: center !important;
	justify-content: center !important;
	gap: 14px !important;
}

.mbfr-section .mbfr-face {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	width: auto !important;
	height: auto !important;
	min-width: 0 !important;
	min-height: 0 !important;
	margin: 0 !important;
	padding: 4px !important;
	border: 0 !important;
	border-radius: 50% !important;
	background: none !important;
	box-shadow: none !important;
	font-size: var(--mbfr-face-size) !important;
	line-height: 1 !important;
	cursor: pointer !important;
	transition: transform 0.18s ease, opacity 0.18s ease;
}

.mbfr-section .mbfr-face span {
	font-size: var(--mbfr-face-size) !important;
	line-height: 1 !important;
	/* Colour emoji regardless of the theme's font stack. */
	font-family: "Apple Color Emoji", "Segoe UI Emoji", "Noto Color Emoji", sans-serif !important;
}

.mbfr-section .mbfr-face:hover {
	transform: scale(1.18);
}

.mbfr-section .mbfr-face:focus-visible {
	outline: 2px solid var(--mbfr-accent) !important;
	outline-offset: 2px !important;
}

.mbfr-section .mbfr-face.is-selected {
	transform: scale(1.22);
}

/* Once a vote is in, the rest fade back. */
.mbfr-section .mbfr-rating.is-voted .mbfr-face {
	cursor: default !important;
	pointer-events: none !important;
}

.mbfr-section .mbfr-rating.is-voted .mbfr-face:not(.is-selected) {
	opacity: 0.35 !important;
}

.mbfr-section .mbfr-rating__thanks {
	margin: 14px 0 0 !important;
	font-family: var(--mbfr-font) !important;
	font-size: 15px !important;
	line-height: 22px !important;
	font-weight: 500 !important;
	color: var(--mbfr-accent) !important;
	text-align: center !important;
}

/* ------------------------------------------------------------- Navigation */

.mbfr-section .mbfr-nav {
	display: flex !important;
	flex-direction: row !important;
	align-items: center !important;
	justify-content: space-between !important;
	gap: 24px !important;
	margin: 32px 0 0 !important;
	padding: 0 !important;
	border: 0 !important;
	background: none !important;
}

.mbfr-section .mbfr-nav__link,
.mbfr-section .mbfr-nav__link:link,
.mbfr-section .mbfr-nav__link:visited {
	display: inline-flex !important;
	align-items: center !important;
	gap: 8px !important;
	max-width: 48% !important;
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	background: none !important;
	box-shadow: none !important;
	font-family: var(--mbfr-font) !important;
	font-size: 16px !important;
	line-height: 20px !important;
	font-weight: 500 !important;
	text-decoration: none !important;
	color: var(--mbfr-nav) !important;
	transition: color 0.18s ease;
}

.mbfr-section .mbfr-nav__link:hover {
	color: var(--mbfr-nav-hover) !important;
}

.mbfr-section .mbfr-nav__link:focus-visible {
	outline: 2px solid var(--mbfr-accent) !important;
	outline-offset: 3px !important;
	border-radius: 4px !important;
}

.mbfr-section .mbfr-nav__link--next {
	text-align: right !important;
}

.mbfr-section .mbfr-nav__icon {
	display: block !important;
	flex: 0 0 auto !important;
	width: 8px !important;
	height: 14px !important;
	max-width: none !important;
	color: currentColor !important;
}

/* One line, ellipsised — an article title can be long. */
.mbfr-section .mbfr-nav__text {
	overflow: hidden !important;
	text-overflow: ellipsis !important;
	white-space: nowrap !important;
}

.mbfr-section .mbfr-nav__spacer {
	display: block !important;
	width: 1px !important;
	height: 1px !important;
}

/* -------------------------------------------------------------- Responsive */

@media (max-width: 640px) {
	.mbfr-section {
		--mbfr-card-pad: 24px 16px;
		--mbfr-face-size: 22px;
	}

	.mbfr-section .mbfr-nav {
		gap: 16px !important;
		margin-top: 24px !important;
	}

	.mbfr-section .mbfr-nav__link,
	.mbfr-section .mbfr-nav__link:link,
	.mbfr-section .mbfr-nav__link:visited {
		font-size: 15px !important;
		max-width: 47% !important;
	}
}

@media (prefers-reduced-motion: reduce) {
	.mbfr-section .mbfr-face {
		transition: none !important;
	}

	.mbfr-section .mbfr-face:hover,
	.mbfr-section .mbfr-face.is-selected {
		transform: none !important;
	}
}