/* ==========================================================================
   Bruncell Larsen — site stylesheet (child theme)
   Port of Branding/Bruncell Larsen Design system/components/bundle.css.

   Rules of the road
   - Elementor Site Settings are the source of truth for colour and type.
     Tokens below read Elementor's global CSS variables first and fall back to the
     design-system values, so the site renders correctly either way.
   - Custom Global Color IDs follow the token names with underscores:
     mist, white, muted, highlight, rule_on_dark, green_hover, green_pressed, error,
     cat_<slug>, cat_<slug>_strong (slug with underscores).
   - Elementor puts its kit variables on <body>, so tokens are declared on body.bl,
     not :root (a var() on :root would never see them).
   - Sections marked [Elementor] style Elementor widget markup via the widget's
     "CSS Classes" field. Sections marked [Shortcode] style markup from inc/shortcodes.php.
   ========================================================================== */

/* ---------- 1. Tokens ---------- */
body.bl {
	--bl-brand-green: var(--e-global-color-primary, #32492C);
	--bl-charcoal: var(--e-global-color-secondary, #1D1C1A);
	--bl-text-body: var(--e-global-color-text, #3C3730);
	--bl-ink: var(--e-global-color-accent, #000000);
	--bl-mist: var(--e-global-color-mist, #F8F8F8);
	--bl-white: var(--e-global-color-white, #FFFFFF);
	--bl-text-muted: var(--e-global-color-muted, #727272);
	--bl-highlight: var(--e-global-color-highlight, #E8E8E8);
	--bl-rule: #3C3730;
	--bl-rule-on-dark: var(--e-global-color-rule_on_dark, #3F3E3C);
	--bl-green-hover: var(--e-global-color-green_hover, #253C1F);
	--bl-green-pressed: var(--e-global-color-green_pressed, #1B3116);
	--bl-error: var(--e-global-color-error, #A4262C);
	--bl-tag-on-dark: var(--e-global-color-muted, #727272);
	--bl-focus: var(--bl-brand-green);
	--bl-focus-on-dark: var(--bl-white);

	--bl-cat-industry-news: var(--e-global-color-cat_industry_news, #FFE4DE);
	--bl-cat-operational-performance: var(--e-global-color-cat_operational_performance, #D2EBF0);
	--bl-cat-governance: var(--e-global-color-cat_governance, #E7E1FA);
	--bl-cat-politics-regulations: var(--e-global-color-cat_politics_regulations, #E4C9B0);
	--bl-cat-environment: var(--e-global-color-cat_environment, #D0DBCC);
	--bl-cat-leadership-culture: var(--e-global-color-cat_leadership_culture, #FFEDCB);
	--bl-cat-industry-news-strong: var(--e-global-color-cat_industry_news_strong, #9B4C3C);
	--bl-cat-operational-performance-strong: var(--e-global-color-cat_operational_performance_strong, #006D7F);
	--bl-cat-governance-strong: var(--e-global-color-cat_governance_strong, #6B569C);
	--bl-cat-politics-regulations-strong: var(--e-global-color-cat_politics_regulations_strong, #7E4600);
	--bl-cat-environment-strong: var(--e-global-color-cat_environment_strong, #376523);
	--bl-cat-leadership-culture-strong: var(--e-global-color-cat_leadership_culture_strong, #815D00);

	--bl-font-heading: "IBM Plex Sans", system-ui, sans-serif;
	--bl-font-body: "Recursive", system-ui, sans-serif;
	--bl-fs-h2: var(--e-global-typography-primary-font-size, 34px);
	--bl-fs-h3: var(--e-global-typography-secondary-font-size, 28px);
	--bl-fs-band: 38px;
	--bl-fs-body: var(--e-global-typography-text-font-size, 18px);
	--bl-lh-body: 1.65;
	--bl-fs-eyebrow: 20px;

	--bl-container-max: 1320px;
	--bl-gutter: 40px;
	--bl-reading-column: 730px;
	--bl-section-gap: 96px;
	--bl-grid-gap: 24px;
	--bl-ctl-h: 32px;
	--bl-input-h: 42px;
	--bl-touch: 44px;
	--bl-cat-size: 93px;
	--bl-cat-bar: 30px;
	--bl-hl: 55%;          /* highlighter coverage */
	--bl-wave-lg: 48px;
	--bl-wave-md: 32px;
	--bl-wave-sm: 24px;
	--bl-frame: 8px;
}
@media (max-width: 1024px) {
	body.bl {
		--bl-fs-h2: var(--e-global-typography-primary-font-size, 30px);
		--bl-fs-h3: var(--e-global-typography-secondary-font-size, 24px);
		--bl-fs-band: 32px;
		--bl-gutter: 32px;
		--bl-section-gap: 80px;
		--bl-ctl-h: var(--bl-touch);
	}
}
@media (max-width: 767px) {
	body.bl {
		--bl-fs-h2: var(--e-global-typography-primary-font-size, 26px);
		--bl-fs-h3: var(--e-global-typography-secondary-font-size, 22px);
		--bl-fs-band: 28px;
		--bl-fs-body: var(--e-global-typography-text-font-size, 17px);
		--bl-lh-body: 1.6;
		--bl-fs-eyebrow: 16px;
		--bl-gutter: 20px;
		--bl-section-gap: 64px;
		--bl-cat-size: 72px;
		--bl-wave-lg: 32px;   /* each wave steps down one size on mobile */
		--bl-wave-md: 24px;
	}
}

/* ---------- 2. Base ---------- */
body.bl {
	font-variation-settings: "MONO" 0, "CASL" 0;  /* Recursive Sans Linear */
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
}
body.bl :focus-visible {
	outline: 2px solid var(--bl-focus);
	outline-offset: 2px;
}
body.bl :is(.bl-on-dark, .bl-footer) :focus-visible {
	outline-color: var(--bl-focus-on-dark);
}
.bl-sr {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
}
.bl-icon {
	width: 1.25em;
	height: 1.25em;
	flex: none;
	fill: currentColor;
	display: inline-block;
	vertical-align: middle;
}
.bl-meta {
	font: 400 14px/1.3 var(--bl-font-heading);
	color: var(--bl-text-muted);
}
.bl-eyebrow {
	font: 400 var(--bl-fs-eyebrow)/1.2 var(--bl-font-heading);
	letter-spacing: .02em;
	text-transform: uppercase;
	color: var(--bl-text-muted);
}
.bl-on-dark .bl-meta { color: var(--bl-white); font-weight: 500; }

/* ---------- 3. Tints (one per category) ---------- */
:is(.bl-tint--industry-news, .bl-tag--industry-news, .bl-cattile--industry-news) { --tag-tint: var(--bl-cat-industry-news); }
:is(.bl-tint--operational-performance, .bl-tag--operational-performance, .bl-cattile--operational-performance) { --tag-tint: var(--bl-cat-operational-performance); }
:is(.bl-tint--governance, .bl-tag--governance, .bl-cattile--governance) { --tag-tint: var(--bl-cat-governance); }
:is(.bl-tint--politics-regulations, .bl-tag--politics-regulations, .bl-cattile--politics-regulations) { --tag-tint: var(--bl-cat-politics-regulations); }
:is(.bl-tint--environment, .bl-tag--environment, .bl-cattile--environment) { --tag-tint: var(--bl-cat-environment); }
:is(.bl-tint--leadership-culture, .bl-tag--leadership-culture, .bl-cattile--leadership-culture) { --tag-tint: var(--bl-cat-leadership-culture); }

/* ---------- 4. Tags, labels, back-link [Shortcode + Elementor] ---------- */
.bl-tag {
	display: inline-block;
	padding: 0 6px;
	font: 500 13px/1.2 var(--bl-font-heading);
	letter-spacing: .02em;
	text-transform: uppercase;
	color: var(--bl-ink);
	text-decoration: none;
	white-space: nowrap;
	background: linear-gradient(to top, var(--tag-tint, var(--bl-highlight)) var(--bl-hl), transparent var(--bl-hl));
}
a.bl-tag:hover { color: var(--bl-ink); text-decoration: underline; text-underline-offset: 3px; }
.bl-tag.bl-tag--on-dark { --tag-tint: var(--bl-tag-on-dark); color: var(--bl-white); }
a.bl-tag.bl-tag--on-dark:hover { color: var(--bl-white); }
.bl-tags {
	display: flex;
	flex-wrap: wrap;
	gap: 6px 8px;
	position: relative;
	z-index: 2;                 /* stays clickable above a card's stretched title link */
}

/* "FEATURED ARTICLE" box: add class bl-label-box to a Heading widget */
.bl-label-box:not(.elementor-element),
.bl-label-box .elementor-heading-title {
	display: inline-block;
	padding: 2px 6px;
	background: var(--bl-white);
	color: var(--bl-ink);
	font: 500 13px/1.2 var(--bl-font-heading);
	letter-spacing: .02em;
	text-transform: uppercase;
}

.bl-backlink {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 0 8px;
	min-height: 24px;
	font: 500 13px/1.2 var(--bl-font-heading);
	letter-spacing: .02em;
	text-transform: uppercase;
	color: var(--bl-ink);
	text-decoration: none;
	background: linear-gradient(to top, var(--bl-highlight) var(--bl-hl), transparent var(--bl-hl));
}
.bl-backlink:hover { color: var(--bl-ink); background: var(--bl-highlight); }
.bl-backlink .bl-icon { width: 14px; height: 14px; }

/* ---------- 5. Links & buttons ---------- */
.bl-link {
	color: var(--bl-brand-green);
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 3px;
}
.bl-link:hover { color: var(--bl-ink); text-decoration-thickness: 2px; }
.bl-link--ink {
	color: var(--bl-ink);
	font: 500 16px/1.3 var(--bl-font-heading);
}
.bl-link--ink:hover { color: var(--bl-brand-green); }

/* [Elementor] Button widget. Colours, type and padding come from Site Settings > Buttons;
   this adds the fixed height, states and the variants (CSS class on the Button widget). */
body.bl .elementor-button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: var(--bl-ctl-h);
	border-radius: 0;
	transition: background-color .15s ease, color .15s ease, border-color .15s ease;
}
body.bl .elementor-button:active { background-color: var(--bl-green-pressed); }
body.bl .bl-btn--lg .elementor-button { min-height: max(var(--bl-input-h), var(--bl-ctl-h)); }
body.bl .bl-btn--inverse .elementor-button { background-color: var(--bl-white); color: var(--bl-ink); }
body.bl .bl-btn--inverse .elementor-button:is(:hover, :focus-visible) { background-color: var(--bl-mist); color: var(--bl-ink); }
body.bl .bl-btn--inverse .elementor-button:active { box-shadow: inset 0 0 0 1px var(--bl-ink); }
body.bl .bl-btn--secondary .elementor-button { background-color: transparent; color: var(--bl-ink); border: 1px solid var(--bl-rule); }
body.bl .bl-btn--secondary .elementor-button:is(:hover, :focus-visible) { background-color: var(--bl-mist); color: var(--bl-ink); }
body.bl .bl-btn--ink .elementor-button { background-color: var(--bl-ink); color: var(--bl-white); }
body.bl .bl-btn--ink .elementor-button:is(:hover, :focus-visible) { background-color: var(--bl-charcoal); text-decoration: underline; text-underline-offset: 3px; }
body.bl :is(.bl-btn--inverse, .bl-btn--ink) .elementor-button:focus-visible { outline-color: var(--bl-focus-on-dark); }

/* ---------- 6. Surfaces: wave corners, bands, bleeds, texture ---------- */
/* Wave corners. On a Container: the container. On an Image widget: the image. */
.bl-wave-br:not(.elementor-widget-image), .elementor-widget-image.bl-wave-br img { border-bottom-right-radius: var(--bl-wave-lg); }
.bl-wave-bl:not(.elementor-widget-image), .elementor-widget-image.bl-wave-bl img { border-bottom-left-radius: var(--bl-wave-lg); }
.bl-wave-tr:not(.elementor-widget-image), .elementor-widget-image.bl-wave-tr img { border-top-right-radius: var(--bl-wave-lg); }
.bl-wave-tr-bl:not(.elementor-widget-image), .elementor-widget-image.bl-wave-tr-bl img { border-top-right-radius: var(--bl-wave-lg); border-bottom-left-radius: var(--bl-wave-lg); }
.bl-wave-tl-br:not(.elementor-widget-image), .elementor-widget-image.bl-wave-tl-br img { border-top-left-radius: var(--bl-wave-lg); border-bottom-right-radius: var(--bl-wave-lg); }

/* Full-bleed to the viewport's left edge without changing layout. The shadow is shifted left so it
   stops 64px short of the element's right edge (keeping a right-side wave corner intact), and the clip
   keeps it between the element's top and bottom while letting content overhang to the right.
   Used by the featured panel and the bio portrait panel. */
.bl-bleed-left {
	box-shadow: calc(-100vmax - 64px) 0 0 100vmax var(--bl-bleed, var(--bl-brand-green));
	clip-path: inset(0 -100vmax 0 -100vmax);
}
.bl-bleed-left.bl-bleed--white { --bl-bleed: var(--bl-white); }
@media (max-width: 1024px) {
	.bl-bleed-left.bl-bleed--off-tablet { box-shadow: none; clip-path: none; }
}

/* Texture. Prefer Elementor's own background controls with the pre-faded tiles
   (texture-green-05.webp over Primary, texture-light-03.webp over Mist, repeat, 1200px).
   These classes do the same where a widget can't. */
.bl-textured--green {
	background: url("../img/texture-green-05.webp") repeat 0 0 / 1200px auto, var(--bl-brand-green);
}
.bl-textured--light {
	background: url("../img/texture-light-03.webp") repeat 0 0 / 1200px auto, var(--bl-mist);
}

/* ---------- 7. Header navigation [Elementor Nav Menu widget, class bl-nav, pointer: None] ---------- */
.bl-nav .elementor-nav-menu--main .elementor-item {
	padding: 2px 6px;
	font: 400 16px/1.2 var(--bl-font-heading);
	letter-spacing: .02em;
	text-transform: uppercase;
	color: var(--bl-ink);
}
.bl-nav .elementor-nav-menu--main .elementor-item:is(:hover, :focus-visible, .elementor-item-active) {
	color: var(--bl-ink);
	background: linear-gradient(to top, var(--bl-highlight) var(--bl-hl), transparent var(--bl-hl));
}
.bl-nav .elementor-nav-menu--main .elementor-item.elementor-item-active { font-weight: 500; }

/* Drawer menu inside the Off-Canvas widget (class bl-drawer-nav on its Nav Menu, layout vertical) */
.bl-drawer-nav .elementor-nav-menu li { border-bottom: 1px solid var(--bl-highlight); }
.bl-drawer-nav .elementor-nav-menu .elementor-item {
	min-height: 56px;
	display: flex;
	align-items: center;
	font: 400 20px/1.2 var(--bl-font-heading);
	letter-spacing: .02em;
	text-transform: uppercase;
	color: var(--bl-ink);
}
.bl-drawer-nav .elementor-nav-menu .elementor-item.elementor-item-active { font-weight: 500; }

/* ---------- 8. Article cards [Elementor Loop Item templates] ----------
   Root container of the Loop Item: class bl-card (or bl-hcard / bl-listitem).
   Post Title widget: class bl-card__title. Featured Image widget: class bl-card__media.
   The title link is stretched over the whole card. */
.bl-card,
.bl-hcard,
.bl-listitem { position: relative; }
:is(.bl-card, .bl-hcard, .bl-listitem) :where(.elementor-element) { position: static; }
.bl-card__title a,
.bl-card__title .elementor-heading-title a { color: var(--bl-ink); text-decoration: none; }
.bl-card__title a::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 1;
}
:is(.bl-card, .bl-hcard, .bl-listitem):hover .bl-card__title a {
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 4px;
}
.bl-card__title a:focus-visible { outline: none; }
.bl-card__title a:focus-visible::after { outline: 2px solid var(--bl-focus); outline-offset: 6px; }
.bl-card__media img {
	width: 100%;
	aspect-ratio: 16 / 10;
	object-fit: cover;
	border-radius: 0;
}
.bl-card__date {
	display: flex;
	align-items: center;
	gap: 6px;
}
.bl-card__date .bl-icon { width: 14px; height: 14px; color: var(--bl-text-muted); }
.bl-listitem { border-bottom: 1px solid var(--bl-rule); }
.bl-hcard__excerpt {
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
}
@media (max-width: 767px) {
	.bl-hcard__excerpt { display: none; }
}

/* ---------- 9. Category explorer [Shortcode bl_category_explorer] ---------- */
.bl-cats {
	display: grid;
	grid-template-columns: repeat(6, minmax(0, 1fr));
	gap: var(--bl-grid-gap);
	list-style: none;
	margin: 0;
	padding: 0;
}
.bl-cattile {
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 32px;
	padding-bottom: 8px;
	color: var(--bl-ink);
	text-decoration: none;
}
.bl-cattile__icon {
	position: relative;
	width: 100%;
	height: var(--bl-cat-size);
	display: flex;
	justify-content: center;
	align-items: center;
}
.bl-cattile__icon::before {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	top: 50%;
	height: var(--bl-cat-bar);
	transform: translateY(-50%);
	background: var(--tag-tint);
}
.bl-cattile__circle {
	position: relative;
	width: var(--bl-cat-size);
	height: var(--bl-cat-size);
	border-radius: 50%;
	background: var(--bl-ink);
	color: var(--tag-tint);
	display: flex;
	align-items: center;
	justify-content: center;
	transition: transform .15s ease;
}
.bl-cattile__circle .bl-icon { width: 54%; height: 54%; }
.bl-cattile__label { text-align: center; line-height: 1.4; }
.bl-cattile__label .bl-tag {
	display: inline;
	white-space: normal;
	-webkit-box-decoration-break: clone;
	box-decoration-break: clone;
}
.bl-cattile:hover { color: var(--bl-ink); }
.bl-cattile:hover .bl-tag { text-decoration: underline; text-underline-offset: 3px; }
.bl-cattile:hover .bl-cattile__circle { transform: scale(1.06); }
.bl-cattile:focus-visible { outline-offset: 6px; }
@media (max-width: 1024px) {
	.bl-cats { grid-template-columns: repeat(3, minmax(0, 1fr)); row-gap: 48px; }
}
@media (max-width: 767px) {
	.bl-cats { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 32px; }
	.bl-cattile { gap: 16px; }
}

/* ---------- 10. Category section header [Shortcode bl_category_sechead] ---------- */
.bl-sechead--cat {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 24px;
}
.bl-cat-heading {
	display: inline-block;
	margin: 0;
	padding: 0 10px;
	font: 600 var(--bl-fs-band)/1.2 var(--bl-font-heading);
	text-transform: uppercase;
	color: var(--bl-ink);
	background: linear-gradient(to top, var(--tag-tint, var(--bl-highlight)) var(--bl-hl), transparent var(--bl-hl));
}
@media (max-width: 767px) {
	.bl-sechead--cat { flex-direction: column; align-items: flex-start; gap: 12px; }
}

/* ---------- 11. Archive pills [Shortcode bl_category_pills] ---------- */
.bl-pills {
	display: flex;
	flex-wrap: wrap;
	gap: 8px 16px;
	list-style: none;
	margin: 0;
	padding: 0;
}
.bl-pill {
	--tag-tint: var(--bl-highlight);
	--pill-ink: var(--bl-ink);
	display: inline-flex;
	align-items: center;
	min-height: 32px;
	font: 400 13px/1.2 var(--bl-font-heading);
	letter-spacing: .02em;
	text-transform: uppercase;
	color: var(--pill-ink);
	text-decoration: none;
}
.bl-pill > span {
	padding: 0 6px;
	background: linear-gradient(to top, var(--tag-tint) var(--bl-hl), transparent var(--bl-hl));
}
.bl-pill:hover { color: var(--pill-ink); }
.bl-pill:hover > span { text-decoration: underline; text-underline-offset: 3px; }
.bl-pill[aria-current="page"] { --pill-ink: var(--bl-ink); font-weight: 600; }
.bl-pill[aria-current="page"] > span { background: var(--tag-tint); box-shadow: inset 0 -2px 0 var(--bl-ink); padding-block: 2px; }
.bl-pill--industry-news { --tag-tint: var(--bl-cat-industry-news); --pill-ink: var(--bl-cat-industry-news-strong); }
.bl-pill--operational-performance { --tag-tint: var(--bl-cat-operational-performance); --pill-ink: var(--bl-cat-operational-performance-strong); }
.bl-pill--governance { --tag-tint: var(--bl-cat-governance); --pill-ink: var(--bl-cat-governance-strong); }
.bl-pill--politics-regulations { --tag-tint: var(--bl-cat-politics-regulations); --pill-ink: var(--bl-cat-politics-regulations-strong); }
.bl-pill--environment { --tag-tint: var(--bl-cat-environment); --pill-ink: var(--bl-cat-environment-strong); }
.bl-pill--leadership-culture { --tag-tint: var(--bl-cat-leadership-culture); --pill-ink: var(--bl-cat-leadership-culture-strong); }
@media (max-width: 1024px) {
	.bl-pill { min-height: var(--bl-touch); }
}
@media (max-width: 767px) {
	.bl-pills { flex-wrap: nowrap; overflow-x: auto; padding-bottom: 4px; }
}

/* ---------- 12. Share [Shortcode bl_share] ---------- */
.bl-share {
	position: relative;
	display: flex;
	justify-content: flex-end;
	border-top: 1px solid var(--bl-rule);
}
.bl-share__toggle,
.bl-share__item {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	min-height: var(--bl-touch);
	padding: 0;
	border: 0;
	background: none;
	cursor: pointer;
	font: 500 13px/1.2 var(--bl-font-heading);
	letter-spacing: .02em;
	text-transform: uppercase;
	color: var(--bl-ink);
	text-decoration: none;
}
.bl-share__toggle:hover,
.bl-share__toggle:focus,
.bl-share__item:hover { background: none; color: var(--bl-ink); text-decoration: underline; text-underline-offset: 3px; }
.bl-share .bl-icon { width: 16px; height: 16px; }
.bl-share__menu {
	position: absolute;
	top: 100%;
	right: 0;
	z-index: 20;
	min-width: 220px;
	margin: 0;
	padding: 8px 16px;
	list-style: none;
	background: var(--bl-white);
	border: 1px solid var(--bl-rule);
}
.bl-share__menu[hidden] { display: none; }

/* ---------- 13. Forms [Elementor Form widget, class bl-form; add bl-on-dark on the green band] ---------- */
.bl-form .elementor-field-group .elementor-field-textual {
	min-height: var(--bl-input-h);
	border: 1px solid var(--bl-rule);
	border-radius: 0;
	background: var(--bl-white);
	color: var(--bl-ink);
	font: 400 16px/1.4 var(--bl-font-body);
	font-variation-settings: "MONO" 0, "CASL" 0;
}
.bl-form .elementor-field-textual::placeholder { color: var(--bl-text-muted); opacity: 1; }
.bl-form .elementor-field-textual:hover { border-color: var(--bl-ink); }
.bl-form .elementor-field-textual:focus-visible { outline: 2px solid var(--bl-focus); outline-offset: 0; border-color: var(--bl-focus); }
.bl-form .elementor-error .elementor-field-textual { border: 2px solid var(--bl-error); }
.bl-form .elementor-message { font: 400 14px/1.5 var(--bl-font-body); margin-top: 8px; }
.bl-form .elementor-message-danger,
.bl-form .elementor-error .elementor-message { color: var(--bl-error); }
.bl-form .elementor-message-success { color: var(--bl-brand-green); }
.bl-on-dark.bl-form .elementor-message,
.bl-on-dark .bl-form .elementor-message { color: var(--bl-white); }
/* Inline subscribe rows: input and button share an edge */
.bl-form--inline .elementor-field-group .elementor-field-textual { border: 0; }
.bl-form--inline .elementor-button { min-height: max(var(--bl-input-h), var(--bl-ctl-h)); padding-inline: 36px; }
/* Consent checkbox */
.bl-form .elementor-field-type-acceptance .elementor-field-option {
	display: flex;
	align-items: flex-start;
	gap: 12px;
}
.bl-form .elementor-field-type-acceptance input[type="checkbox"] {
	appearance: none;
	flex: none;
	width: 22px;
	height: 22px;
	margin: 1px 0 0;
	border: 1px solid var(--bl-rule);
	border-radius: 0;
	background: var(--bl-white);
	display: grid;
	place-content: center;
	cursor: pointer;
}
.bl-form .elementor-field-type-acceptance input[type="checkbox"]::after {
	content: "";
	width: 12px;
	height: 7px;
	border: solid var(--bl-white);
	border-width: 0 0 2px 2px;
	transform: translateY(-2px) rotate(-45deg);
	opacity: 0;
}
.bl-form .elementor-field-type-acceptance input[type="checkbox"]:checked { background: var(--bl-brand-green); border-color: var(--bl-brand-green); }
.bl-form .elementor-field-type-acceptance input[type="checkbox"]:checked::after { opacity: 1; }
.bl-on-dark .bl-form .elementor-field-type-acceptance input[type="checkbox"],
.bl-on-dark.bl-form .elementor-field-type-acceptance input[type="checkbox"] { border-color: var(--bl-white); background: transparent; }
.bl-on-dark .bl-form .elementor-field-type-acceptance input[type="checkbox"]:checked,
.bl-on-dark.bl-form .elementor-field-type-acceptance input[type="checkbox"]:checked { background: var(--bl-white); }
.bl-on-dark .bl-form .elementor-field-type-acceptance input[type="checkbox"]:checked::after,
.bl-on-dark.bl-form .elementor-field-type-acceptance input[type="checkbox"]:checked::after { border-color: var(--bl-brand-green); }
.bl-form .elementor-field-type-acceptance label a { color: inherit; text-decoration: underline; }

/* ---------- 14. Footer [Elementor, class bl-footer on the footer's root container] ---------- */
.bl-footer a { color: var(--bl-white); text-decoration: none; }
.bl-footer a:hover { color: var(--bl-white); text-decoration: underline; text-underline-offset: 3px; }

/* ---------- 15. Article prose [Elementor Post Content widget, class bl-prose] ----------
   Styles the block-editor output. Works with and without Elementor's widget-container wrapper. */
.bl-prose {
	max-width: var(--bl-reading-column);
	margin-inline: auto;
	font: 400 var(--bl-fs-body)/var(--bl-lh-body) var(--bl-font-body);
	font-variation-settings: "MONO" 0, "CASL" 0;
	color: var(--bl-text-body);
}
:is(.bl-prose, .bl-prose > .elementor-widget-container) > * { margin-block: 0; }
:is(.bl-prose, .bl-prose > .elementor-widget-container) > * + * { margin-top: 1.1em; }
.bl-prose :is(h2, h3) { color: var(--bl-ink); font-family: var(--bl-font-heading); font-weight: 500; }
.bl-prose h2 { font-size: var(--bl-fs-h2); line-height: 1.2; }
.bl-prose h3 { font-size: var(--bl-fs-h3); line-height: 1.25; }
:is(.bl-prose, .bl-prose > .elementor-widget-container) > h2 { margin-top: 64px; }
:is(.bl-prose, .bl-prose > .elementor-widget-container) > h3 { margin-top: 48px; }
:is(.bl-prose, .bl-prose > .elementor-widget-container) > :is(h2, h3) + * { margin-top: 16px; }
.bl-prose a {
	color: var(--bl-brand-green);
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 3px;
}
.bl-prose a:hover { color: var(--bl-ink); text-decoration-thickness: 2px; }
.bl-prose strong { font-weight: 600; color: var(--bl-ink); }
.bl-prose :is(ul, ol) { padding-left: 1.4em; }
.bl-prose li + li { margin-top: .45em; }
.bl-prose ul li::marker { color: var(--bl-brand-green); }
.bl-prose ol li::marker { font-family: var(--bl-font-heading); font-weight: 600; color: var(--bl-brand-green); }

/* Images: 3:2 at full column width, top-left + bottom-right wave */
.bl-prose figure { margin-block: 32px; margin-inline: 0; }
.bl-prose .wp-block-image img {
	width: 100%;
	height: auto;
	aspect-ratio: 3 / 2;
	object-fit: cover;
	border-top-left-radius: var(--bl-wave-lg);
	border-bottom-right-radius: var(--bl-wave-lg);
}
.bl-prose :is(figcaption, .wp-element-caption) {
	margin-top: 12px;
	font: 400 14px/1.5 var(--bl-font-body);
	color: var(--bl-text-body);
	text-align: left;
}
.bl-prose figcaption cite { font-style: normal; color: var(--bl-text-muted); }

/* Quote */
.bl-prose blockquote,
.bl-prose .wp-block-quote {
	margin-block: 32px;
	margin-inline: 0;
	padding: 8px 0;
	border: 0;
}
.bl-prose blockquote p {
	font: 400 var(--bl-fs-h3)/1.35 var(--bl-font-heading);
	color: var(--bl-ink);
}
.bl-prose blockquote p::before { content: "\201C"; color: var(--bl-brand-green); }
.bl-prose blockquote p::after { content: "\201D"; color: var(--bl-brand-green); }
.bl-prose blockquote cite {
	display: block;
	margin-top: 12px;
	font: 500 14px/1.4 var(--bl-font-heading);
	font-style: normal;
	letter-spacing: .02em;
	text-transform: uppercase;
	color: var(--bl-text-muted);
}

/* Key takeaways (pattern) */
.bl-prose .bl-takeaways {
	margin-block: 32px;
	padding: 32px;
	background: var(--bl-mist);
	border-top: 3px solid var(--bl-brand-green);
}
.bl-prose .bl-takeaways__title {
	margin: 0 0 16px;
	font: 500 13px/1.2 var(--bl-font-heading);
	letter-spacing: .02em;
	text-transform: uppercase;
	color: var(--bl-ink);
}
.bl-prose .bl-takeaways ol { margin: 0; }

/* Table */
.bl-prose .wp-block-table { overflow-x: auto; margin-block: 32px; }
.bl-prose table {
	width: 100%;
	border-collapse: collapse;
	font: 400 15px/1.45 var(--bl-font-body);
	font-variation-settings: "MONO" 0, "CASL" 0;
}
.bl-prose :is(th, thead td) {
	text-align: left;
	font: 500 14px/1.3 var(--bl-font-heading);
	color: var(--bl-ink);
	background: var(--bl-mist);
	padding: 12px 16px;
	border: 0;
	border-bottom: 1px solid var(--bl-rule);
}
.bl-prose td {
	padding: 12px 16px;
	border: 0;
	border-bottom: 1px solid var(--bl-highlight);
	vertical-align: top;
}

/* Sources heading (pattern) + WordPress footnotes */
.bl-prose .bl-sources__title {
	margin-top: 64px;
	padding-top: 24px;
	border-top: 1px solid var(--bl-rule);
	font: 500 13px/1.2 var(--bl-font-heading);
	letter-spacing: .02em;
	text-transform: uppercase;
	color: var(--bl-ink);
}
.bl-prose .wp-block-footnotes {
	margin-top: 16px;
	padding-left: 1.4em;
	font: 400 14px/1.5 var(--bl-font-body);
}
.bl-prose .wp-block-footnotes li + li { margin-top: 8px; }
.bl-prose sup { line-height: 0; }  /* keeps footnote numbers from opening up the line spacing */
.bl-prose sup.fn a,
.bl-prose sup a {
	text-decoration: none;
	font: 600 12px/1 var(--bl-font-heading);
	padding: 0 2px;
}

@media (max-width: 767px) {
	.bl-prose .bl-takeaways { padding: 24px; }
	.bl-prose .wp-block-image { margin-inline: calc(-1 * var(--bl-gutter)); }
	.bl-prose .wp-block-image :is(figcaption, .wp-element-caption) { padding-inline: var(--bl-gutter); }
}

/* ---------- 16. Motion ---------- */
@media (prefers-reduced-motion: reduce) {
	.bl-cattile__circle,
	body.bl .elementor-button { transition: none; }
	.bl-cattile:hover .bl-cattile__circle { transform: none; }
}