/*
Theme Name: Climarq
Theme URI: https://climarq.io
Description: Divi child theme for climarq.io. Carries the Climarq Brand Guidelines v2.0 design tokens (colour ramps, type scale, fonts) as CSS custom properties so every layout, module and Divi preset resolves against one source of truth.
Author: Climarq
Author URI: https://climarq.io
Template: Divi
Version: 2.6.1
Requires PHP: 7.4
License: GNU General Public License v2
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: climarq
*/

/* ==========================================================================
   Brand Guidelines v2.0 — design tokens
   --------------------------------------------------------------------------
   Mirrors the token set the product frontends compile from
   (climarq-platform-frontend/tailwind.config.ts). Base values and tints are
   exact per the guidelines; intermediate ramp shades are derived.

   Consume these — never retype a hex. Divi Theme Options and the global
   presets are configured to point at the same values.
   ========================================================================== */

:root {
	/* -- Ink (primary brand / text) ------------------------------------- */
	--cq-ink-50: #e6eaf0;
	--cq-ink-100: #c4cddb;
	--cq-ink-200: #9faec4;
	--cq-ink-300: #7b90ad;
	--cq-ink-400: #567295;
	--cq-ink-500: #33547b;
	--cq-ink-600: #1f3f62;
	--cq-ink-700: #163152;
	--cq-ink-800: #0f2a47;
	--cq-ink-900: #0a2540;
	--cq-ink: var(--cq-ink-900);
	--cq-ink-tint: var(--cq-ink-50);

	/* -- Climate Green (primary action) --------------------------------- */
	--cq-green-50: #e6f7f1;
	--cq-green-100: #c4ecdd;
	--cq-green-200: #9fe0c7;
	--cq-green-300: #74d2ad;
	--cq-green-400: #4bc392;
	--cq-green-500: #1fa971;
	--cq-green-600: #1a9163;
	--cq-green-700: #157653;
	--cq-green-800: #105c41;
	--cq-green-900: #0b402e;
	--cq-green: var(--cq-green-500);
	--cq-green-tint: var(--cq-green-50);

	/* -- Teal ------------------------------------------------------------ */
	--cq-teal-50: #e5f8f5;
	--cq-teal-100: #c2efe9;
	--cq-teal-200: #9be5db;
	--cq-teal-300: #6fd9cc;
	--cq-teal-400: #4bccbd;
	--cq-teal-500: #2dbfb0;
	--cq-teal-600: #26a295;
	--cq-teal-700: #1f8479;
	--cq-teal-800: #18655d;
	--cq-teal-900: #114641;
	--cq-teal: var(--cq-teal-500);
	--cq-teal-tint: var(--cq-teal-50);

	/* -- Intelligence Blue (sky) ----------------------------------------- */
	--cq-sky-50: #ebf3fe;
	--cq-sky-100: #d6e6fd;
	--cq-sky-200: #aeccfb;
	--cq-sky-300: #85b2f9;
	--cq-sky-400: #5e9af8;
	--cq-sky-500: #3b82f6;
	--cq-sky-600: #2d6fe0;
	--cq-sky-700: #2457b5;
	--cq-sky-800: #1c4189;
	--cq-sky-900: #142c5c;
	--cq-sky: var(--cq-sky-500);
	--cq-sky-tint: var(--cq-sky-50);

	/* -- Semantic (exact) ------------------------------------------------ */
	--cq-success: #1fa971;
	--cq-warning: #f59e0b;
	--cq-error: #ef4444;
	--cq-info: #3b82f6;

	/* -- Brand mark gradient (Green -> Teal -> Sky) ---------------------- */
	--cq-gradient-brand: linear-gradient(
		45deg,
		var(--cq-green) 0%,
		var(--cq-teal) 50%,
		var(--cq-sky) 100%
	);

	/* -- Typefaces ------------------------------------------------------- */
	--cq-font-sans: "Poppins", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
	--cq-font-mono: "JetBrains Mono", ui-monospace, "SFMono-Regular", monospace;

	/* -- Type scale (Brand Guidelines v2.0 §04) --------------------------
	   `body` (16px/1.6) and `label` (12px, +0.05em, 500) are exact;
	   the remaining sizes are derived.                                     */
	--cq-text-display: 3rem;
	--cq-leading-display: 1.1;
	--cq-tracking-display: -0.02em;

	--cq-text-h1: 2.25rem;
	--cq-leading-h1: 1.2;
	--cq-tracking-h1: -0.01em;

	--cq-text-h2: 1.875rem;
	--cq-leading-h2: 1.25;

	--cq-text-h3: 1.5rem;
	--cq-leading-h3: 1.3;

	--cq-text-h4: 1.25rem;
	--cq-leading-h4: 1.4;

	--cq-text-body-lg: 1.125rem;
	--cq-text-body: 1rem;
	--cq-text-body-sm: 0.875rem;
	--cq-leading-body: 1.6;
	--cq-leading-body-sm: 1.5;

	--cq-text-label: 0.75rem;
	--cq-leading-label: 1.4;
	--cq-tracking-label: 0.05em;

	--cq-text-code: 0.875rem;
	--cq-leading-code: 1.5;

	/* -- Weights --------------------------------------------------------- */
	--cq-weight-regular: 400;
	--cq-weight-medium: 500;
	--cq-weight-semibold: 600;

	/* -- Icons (Brand Guidelines v2.0 §06) ------------------------------- */
	--cq-icon-stroke: 1.5;

	/* -- Logo ------------------------------------------------------------ */
	--cq-logo-min-height: 32px;
}

/* ==========================================================================
   Header CTAs (Architecture v2 §4)
   --------------------------------------------------------------------------
   The Primary menu carries two custom-link items pointing at the app:
   "Sign in" (.menu-item-signin) and "Get started" (.menu-item-cta). The CTA
   item is styled as a solid Climate Green button; Divi's nav baseline padding
   is compensated so the button sits vertically centred in the 66px bar.
   ========================================================================== */

#top-menu li.menu-item-cta > a {
	background: var(--cq-green);
	color: #ffffff !important;
	border-radius: 8px;
	padding: 10px 20px !important;
	font-weight: 500;
	transition: background 0.2s ease;
}

#top-menu li.menu-item-cta > a:hover {
	background: var(--cq-green-600);
	opacity: 1;
}

/* Pull the button up so its box centres on the nav line despite Divi's
   baseline-align padding on menu anchors. */
#top-menu li.menu-item-cta {
	margin-top: -10px;
}

#top-menu li.menu-item-signin > a {
	font-weight: 500;
}

/* ==========================================================================
   Hero verb rotator (Glaricx-hero treatment, 2026-08-11)
   --------------------------------------------------------------------------
   The H1 is the static category claim; this line beneath it cycles the
   ecosystem verbs in Climate Green. Pure CSS — the words are stacked in an
   inline grid and fade/rise on a shared keyframe cycle (7 words x 2.2s).
   The Divi text module carrying it has module_class="cq-verb-rotator".
   ========================================================================== */

.cq-verb-rotator p {
	font-weight: 600;
	color: var(--cq-green);
	line-height: 1.2;
}

.cq-words {
	display: inline-grid;
	text-align: left;
	vertical-align: top;
}

.cq-words > span {
	grid-area: 1 / 1;
	opacity: 0;
	animation: cq-word-cycle 15.4s infinite;
	will-change: opacity, transform;
}

.cq-words > span:nth-child(1) { animation-delay: 0s; }
.cq-words > span:nth-child(2) { animation-delay: 2.2s; }
.cq-words > span:nth-child(3) { animation-delay: 4.4s; }
.cq-words > span:nth-child(4) { animation-delay: 6.6s; }
.cq-words > span:nth-child(5) { animation-delay: 8.8s; }
.cq-words > span:nth-child(6) { animation-delay: 11s; }
.cq-words > span:nth-child(7) { animation-delay: 13.2s; }

/* Windows overlap slightly (out by 16%, next in by ~14.5%) so a verb is ALWAYS
   on screen — no blank "built to _" frame between words. The ±translateY makes
   the brief crossfade read as a vertical conveyor rather than a pile-up. */
@keyframes cq-word-cycle {
	0%    { opacity: 0; transform: translateY(0.3em); }
	1.5%  { opacity: 1; transform: translateY(0); }
	13.5% { opacity: 1; transform: translateY(0); }
	16%   { opacity: 0; transform: translateY(-0.3em); }
	100%  { opacity: 0; }
}

@media (prefers-reduced-motion: reduce) {
	.cq-words > span { animation: none; }
	.cq-words > span:first-child { opacity: 1; }
}

/* ==========================================================================
   Audience cards (§8 "Who it's for") — narrow 1/5 columns
   --------------------------------------------------------------------------
   At 19px the single long word "Manufacturing" broke mid-word. Smaller title
   + no mid-word breaking keeps every card title whole on one line.
   ========================================================================== */

#cq-audiences .et_pb_blurb .et_pb_module_header {
	font-size: 16px !important;
	line-height: 1.3;
	overflow-wrap: normal;
	word-break: normal;
	hyphens: none;
}

/* ==========================================================================
   Homepage design system (v3 — consistency pass)
   --------------------------------------------------------------------------
   One card language for every content section: equal-height white cards,
   1px ink-50 border, 12px radius, uniform padding. Rows carrying cards get
   the .cq-cards class; flex makes every card in a row the same height
   regardless of copy length.
   ========================================================================== */

/* Equal heights need flex at ROW level — Divi floats its columns, so column-
   level flex alone lets each column size to its own content. */
@media (min-width: 981px) {
	.et_pb_row.cq-cards {
		display: flex;
		align-items: stretch;
	}
	.et_pb_row.cq-cards::after {
		display: none;
	}
}

.cq-cards .et_pb_column {
	display: flex;
	flex-direction: column;
}

.cq-cards .et_pb_blurb {
	flex: 1;
	display: flex;
	background: #ffffff;
	border: 1px solid var(--cq-ink-50);
	border-radius: 12px;
	padding: 26px 26px 24px !important;
	margin-bottom: 0 !important;
	box-shadow: 0 1px 2px rgba(10, 37, 64, 0.04);
}

.cq-cards .et_pb_blurb_content {
	display: flex;
	flex-direction: column;
}

.cq-cards .et_pb_blurb .et_pb_module_header {
	margin-bottom: 8px;
}

/* Card icons (brand line-icon set): compact, left-aligned above the title. */
.cq-cards .et_pb_main_blurb_image {
	margin-bottom: 12px;
	text-align: left;
	line-height: 0;
}
.cq-cards .et_pb_main_blurb_image img {
	width: 38px;
	height: 38px;
}

/* Divi's waypoint system renders images at opacity:0 until scroll JS fires —
   for small card icons that means invisible icons on slow JS/no JS. They are
   decorative and animation is off; force them visible unconditionally. */
.et_pb_main_blurb_image img.et-waypoint {
	opacity: 1 !important;
}

/* ==========================================================================
   Homepage v4 additions
   ========================================================================== */

/* Credibility strip: credential tiles — logo-weight designed emblems.
   (Third-party logos themselves are trademark-restricted: ISO, GHG Protocol,
   agency crests etc. require licences/status we don't hold yet.) */
.cq-creds p {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 12px;
	margin: 0;
}
.cq-creds .cq-cred {
	display: inline-flex;
	flex-direction: column;
	align-items: center;
	gap: 2px;
	min-width: 128px;
	border: 1px solid var(--cq-ink-50);
	border-top: 3px solid var(--cq-ink-200);
	border-radius: 10px;
	padding: 12px 18px 10px;
	background: #ffffff;
	box-shadow: 0 1px 2px rgba(10, 37, 64, 0.04);
}
.cq-creds .cq-cred b {
	font-weight: 600;
	font-size: 14.5px;
	color: var(--cq-ink);
	letter-spacing: 0.01em;
	white-space: nowrap;
}
.cq-creds .cq-cred i {
	font-style: normal;
	font-weight: 500;
	font-size: 10px;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--cq-ink-300);
	white-space: nowrap;
}
.cq-creds .cq-cred:nth-child(3n+1) { border-top-color: var(--cq-green); }
.cq-creds .cq-cred:nth-child(3n+2) { border-top-color: var(--cq-teal); }
.cq-creds .cq-cred:nth-child(3n)   { border-top-color: var(--cq-sky); }
.cq-creds .cq-cred--lead {
	background: var(--cq-green-tint);
	border-color: var(--cq-green-100);
	border-top-color: var(--cq-green);
}

/* Foundations logo strip (section 2): a seamless rotating marquee with arrow nav.
   JS wraps .cq-ls-track in .cq-ls-viewport and translates it; the viewport fades
   logos at both edges so none is ever hard-cut. Without JS the track itself just
   scrolls horizontally (the fallback rules below). */
.cq-logo-scroll {
	display: flex;
	align-items: center;
	gap: 14px;
}
.cq-ls-viewport {
	flex: 1;
	overflow: hidden;
	-webkit-mask-image: linear-gradient(90deg, transparent 0, #000 7%, #000 93%, transparent 100%);
	        mask-image: linear-gradient(90deg, transparent 0, #000 7%, #000 93%, transparent 100%);
}
.cq-ls-track {
	display: flex;
	align-items: center;
	gap: 60px;
	width: max-content;
	padding: 10px 0;
	min-height: 104px;
	will-change: transform;
}
/* No-JS fallback: track is a direct child of .cq-logo-scroll -> make it scroll. */
.cq-logo-scroll > .cq-ls-track {
	width: auto;
	flex: 1;
	overflow-x: auto;
	justify-content: safe center;
	scrollbar-width: none;
}
.cq-ls-track::-webkit-scrollbar { display: none; }
/* Real framework logos: readable size, natural width (no forced round tiles). */
.cq-ls-track img {
	height: 64px;
	width: auto;
	max-width: 220px;
	object-fit: contain;
	flex: 0 0 auto;
}
.cq-ls-btn {
	flex: 0 0 auto;
	width: 40px;
	height: 40px;
	border-radius: 50%;
	border: 1.5px solid var(--cq-ink-100);
	background: #ffffff;
	color: var(--cq-ink-500);
	font-size: 17px;
	line-height: 1;
	cursor: pointer;
	transition: border-color 0.15s ease, color 0.15s ease;
}
.cq-ls-btn:hover,
.cq-ls-btn:focus-visible {
	border-color: var(--cq-green);
	color: var(--cq-green-700);
	outline: none;
}
.cq-ls-btn:focus-visible {
	outline: 2px solid var(--cq-sky);
	outline-offset: 2px;
}

/* ==========================================================================
   Homepage v6 (approved v5.1 mockup) — native-module treatments
   ========================================================================== */

/* Hero qualitative badges: 3 horizontal icon blurbs under the hero copy. */
.cq-quals .et_pb_blurb {
	background: none;
	border: none;
	box-shadow: none;
	padding: 0 !important;
}
.cq-quals .et_pb_blurb .et_pb_module_header {
	font-size: 13.5px !important;
	margin-bottom: 2px;
}
.cq-quals .et_pb_blurb .et_pb_blurb_description {
	font-size: 12.5px;
}
.cq-quals .et_pb_main_blurb_image img {
	width: 28px !important;
	height: 28px !important;
}
.cq-quals-row {
	border-top: 1px solid var(--cq-ink-50);
	padding-top: 22px !important;
}

/* Green checklist (product section): a plain UL in a text module. */
.cq-checklist ul {
	list-style: none;
	padding: 0;
	margin: 0;
	display: flex;
	flex-direction: column;
	gap: 11px;
}
.cq-checklist li {
	padding-left: 30px;
	position: relative;
	font-size: 14.5px;
	color: var(--cq-ink-500);
	line-height: 1.5;
}
/* Check chips: the tick sits in a tinted circle, not as a bare glyph. */
.cq-checklist li::before {
	content: "\2713";
	position: absolute;
	left: 0;
	top: 1px;
	width: 19px;
	height: 19px;
	border-radius: 50%;
	background: var(--cq-green-tint);
	color: var(--cq-green-700);
	font-size: 11px;
	font-weight: 700;
	display: flex;
	align-items: center;
	justify-content: center;
}

/* Lifecycle medallions: 6-column blurb row. */
.cq-life {
	counter-reset: cq-life;
}
.cq-life .et_pb_blurb {
	background: none;
	border: none;
	box-shadow: none;
	text-align: center;
	padding: 0 6px !important;
	position: relative;
}
.cq-life .et_pb_main_blurb_image {
	text-align: center;
	margin-bottom: 12px;
}
.cq-life .et_pb_main_blurb_image .et_pb_image_wrap {
	width: 80px;
	height: 80px;
	border-radius: 50%;
	background: #ffffff;
	border: 1.5px solid var(--cq-ink-50);
	box-shadow: 0 6px 18px -8px rgba(10, 37, 64, 0.18);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	transition: transform 0.25s ease, box-shadow 0.25s ease,
		background-color 0.25s ease, background-image 0.25s ease,
		border-color 0.25s ease;
}
.cq-life .et_pb_main_blurb_image img {
	width: 32px !important;
	height: 32px !important;
	transition: filter 0.25s ease;
}
/* Hover: the medallion fills with the brand gradient, the icon goes white and
   the circle lifts — same hover language as the Why Climarq rows. */
.cq-life .et_pb_blurb:hover .et_pb_main_blurb_image .et_pb_image_wrap {
	background-image: linear-gradient(135deg, var(--cq-green), var(--cq-teal));
	border-color: transparent;
	transform: translateY(-4px);
	box-shadow: 0 14px 26px -10px rgba(31, 169, 113, 0.45);
}
.cq-life .et_pb_blurb:hover .et_pb_main_blurb_image img {
	filter: brightness(0) invert(1);
}
/* Step number: a badge pill perched on the medallion's top-right edge instead
   of stray grey text under the icon. */
.cq-life .et_pb_blurb .et_pb_module_header::before {
	counter-increment: cq-life;
	content: "0" counter(cq-life);
	position: absolute;
	top: -4px;
	left: calc(50% + 22px);
	background: #ffffff;
	border: 1px solid var(--cq-green-100, #BFE8D6);
	border-radius: 999px;
	padding: 2px 7px;
	font-size: 10px;
	letter-spacing: 0.08em;
	color: var(--cq-green-700);
	font-weight: 600;
	line-height: 1.4;
	transition: background-color 0.25s ease, background-image 0.25s ease, color 0.25s ease;
}
.cq-life .et_pb_blurb:hover .et_pb_module_header::before {
	background-image: linear-gradient(135deg, var(--cq-green), var(--cq-teal));
	border-color: transparent;
	color: #ffffff;
}
.cq-life .et_pb_blurb .et_pb_module_header {
	font-size: 15.5px !important;
	text-align: center;
	transition: color 0.25s ease;
}
.cq-life .et_pb_blurb:hover .et_pb_module_header {
	color: var(--cq-green-700) !important;
}
.cq-life .et_pb_blurb .et_pb_blurb_description {
	font-size: 12px;
	line-height: 1.45;
	max-width: 170px;
	margin: 0 auto;
	text-align: center;
}
/* Connector arrows between lifecycle columns (desktop only). */
@media (min-width: 981px) {
	.cq-life .et_pb_column:not(:last-child)::after {
		content: "\2192";
		position: absolute;
		right: -7px;
		top: 32px;
		color: var(--cq-ink-300);
		font-size: 17px;
		transition: color 0.25s ease, transform 0.25s ease;
	}
	.cq-life .et_pb_column:not(:last-child):hover::after {
		color: var(--cq-green);
		transform: translateX(3px);
	}
	.cq-life .et_pb_column {
		position: relative;
	}
}

/* WHY NOW stats band: deep ink->teal gradient backdrop, count-up figures in
   the brand gradient, hairline rules between columns, kicker in a frosted
   panel. Overrides use !important where Divi compiles per-module colours. */
.cq-stats-sec.et_pb_section {
	background-color: #0A2540 !important;
	background-image: linear-gradient(135deg, #0A2540 0%, #0E3A54 55%, #14514B 100%) !important;
}
.cq-stats-sec h2 {
	color: #ffffff !important;
}
.cq-stats-sec h2 span {
	color: #3ED6A5 !important;
}
.cq-stats-sec .et_pb_text p {
	color: #B9C7DA;
}
.cq-stats-sec .et_pb_text:first-of-type p {
	color: #3ED6A5; /* eyebrow */
}
.cq-stats .et_pb_number_counter .title {
	color: #A8B8CC !important;
}
@media (min-width: 981px) {
	.cq-stats .et_pb_column:not(:first-child) {
		border-left: 1px solid rgba(255, 255, 255, 0.14);
		padding-left: 26px;
	}
}
.cq-stats .et_pb_number_counter {
	text-align: left;
	margin-bottom: 0 !important;
}
.cq-stats .et_pb_number_counter .percent {
	background-image: linear-gradient(90deg, #2FCB8C, #3ED6C5);
	-webkit-background-clip: text;
	        background-clip: text;
	-webkit-text-fill-color: transparent;
	color: var(--cq-green);
	line-height: 1.1;
}
.cq-stats .et_pb_number_counter .percent p {
	line-height: 1.1 !important;
}
/* Approx / suffix marks around the animated value. */
.cq-stat-approx .percent-value::before {
	content: "~";
}
.cq-stat-plus .percent p::after {
	content: "+";
	-webkit-text-fill-color: #3ED6C5;
}
.cq-stat-x .percent p::after {
	content: "\00d7";
	-webkit-text-fill-color: #3ED6C5;
}
.cq-stats .et_pb_number_counter .title {
	margin-top: 8px;
	max-width: 240px;
}
.cq-stats-kicker {
	background: rgba(255, 255, 255, 0.07);
	border: 1px solid rgba(255, 255, 255, 0.12);
	border-radius: 12px;
	padding: 18px 26px !important;
}
.cq-stats-kicker p {
	color: #EAF1F8 !important;
}
.cq-stats-sec .et_pb_text:last-of-type p {
	color: #6E87A5; /* sources footnote */
}

/* Capability cards: gradient panels — soft green washing into deep ink, white
   line icon top-left, white title, light copy (Mehul's reference, 2026-09-08).
   Hover lifts the card and deepens the shadow. */
/* Tight rows: Divi gives rows ~27px of vertical padding by default — pull the
   capability rows together so the grid reads as one block. */
.et_pb_row.cq-caps {
	padding-top: 10px !important;
	padding-bottom: 10px !important;
}
.cq-caps .et_pb_blurb {
	background: linear-gradient(160deg, #98D2B6 0%, #3F9488 52%, #123B54 100%);
	border: none;
	border-radius: 14px;
	padding: 22px 22px 20px !important;
	transition: transform 0.25s ease, box-shadow 0.25s ease;
}
.cq-caps .et_pb_blurb:hover {
	transform: translateY(-4px);
	box-shadow: 0 18px 36px -14px rgba(10, 37, 64, 0.40);
}
.cq-caps .et_pb_blurb .et_pb_main_blurb_image {
	text-align: left;
	margin-bottom: 10px;
	line-height: 0;
}
.cq-caps .et_pb_blurb .et_pb_main_blurb_image .et_pb_image_wrap {
	background: none;
	padding: 0;
	display: inline-block;
	width: auto;
}
.cq-caps .et_pb_blurb .et_pb_main_blurb_image img {
	width: 34px !important;
	height: 34px !important;
	filter: brightness(0) invert(1);
	opacity: 0.95;
}
.cq-caps .et_pb_blurb .et_pb_module_header {
	font-size: 19px !important;
	margin-bottom: 6px;
	padding-bottom: 0 !important;
}
.cq-caps .et_pb_blurb .et_pb_blurb_description {
	font-size: 13.5px;
	line-height: 1.55;
}
.cq-caps .et_pb_blurb .et_pb_blurb_description p {
	margin-bottom: 0;
	padding-bottom: 0;
}
/* The trailing "->" link: white, nudges right on card hover. */
.cq-caps .et_pb_blurb_description a {
	color: #ffffff;
	text-decoration: none;
	font-weight: 600;
	display: inline-block;
	transition: transform 0.2s ease;
}
.cq-caps .et_pb_blurb:hover .et_pb_blurb_description a {
	transform: translateX(3px);
}
.cq-caps .et_pb_blurb .et_pb_module_header {
	font-size: 14.5px !important;
	margin-bottom: 3px;
}
.cq-caps .et_pb_blurb .et_pb_blurb_description {
	font-size: 12.5px;
}

/* Industry cards: full-bleed image tops. */
.cq-ind .et_pb_blurb {
	padding: 0 !important;
	overflow: hidden;
}
.cq-ind .et_pb_main_blurb_image {
	margin: 0;
	line-height: 0;
}
.cq-ind .et_pb_main_blurb_image img {
	width: 100% !important;
	height: 96px !important;
	object-fit: cover;
}
.cq-ind .et_pb_blurb_container {
	padding: 12px 14px 14px;
}
.cq-ind .et_pb_blurb .et_pb_module_header {
	font-size: 13px !important;
	line-height: 1.3;
}
.cq-ind .et_pb_blurb .et_pb_blurb_description {
	font-size: 11px;
}
.cq-ind .et_pb_blurb_description a {
	color: var(--cq-green-700);
	font-weight: 600;
	text-decoration: none;
}

/* --------------------------------------------------------------------------
   Final CTA band. The band is deliberately shallow — it sits at the foot of a
   long page, so it earns only as much height as its content needs.
   -------------------------------------------------------------------------- */
.cq-band .et_pb_row {
	padding-top: 10px !important;
	padding-bottom: 10px !important;
}

/* The outcome list sits beside the copy, set off by a hairline rule and
   centred against it. Flexing the row is what lets the rule run the full
   height of the copy rather than only as deep as the list itself. */
.cq-band .et_pb_row {
	display: flex;
	flex-wrap: wrap;
	align-items: stretch;
}
/* Divi's float clearfix would otherwise become a phantom flex item. */
.cq-band .et_pb_row::before,
.cq-band .et_pb_row::after {
	display: none;
}
.cq-band .et_pb_row > .et_pb_column {
	float: none;
	box-sizing: border-box;
}
.cq-band .et_pb_row > .et_pb_column:last-child {
	display: flex;
	flex-direction: column;
	justify-content: center;
	border-left: 1px solid rgba(255, 255, 255, 0.16);
	padding-left: 38px;
}
@media (max-width: 980px) {
	/* Columns stack here, so a left-hand rule would read as a stray mark. */
	.cq-band .et_pb_row > .et_pb_column:last-child {
		border-left: 0;
		padding-left: 0;
	}
}
/* Divi pads headings for body copy that follows; here the sub-line carries
   its own top margin, so the extra padding just opens a gap. */
.cq-band h2 {
	padding-bottom: 0 !important;
}

/* Band blurbs. NOTE: cq-bandlist is on the blurb itself, not a wrapper —
   a descendant selector here matches nothing. */
.et_pb_blurb.cq-bandlist {
	background: none;
	border: none;
	box-shadow: none;
	padding: 0 !important;
	margin-bottom: 16px !important;
}
.et_pb_blurb.cq-bandlist:last-child {
	margin-bottom: 0 !important;
}
.cq-bandlist .et_pb_main_blurb_image img {
	width: 24px !important;
	height: 24px !important;
}
.cq-bandlist .et_pb_module_header {
	font-size: 14.5px !important;
	color: #E6EAF0 !important;
	font-weight: 400;
	padding-bottom: 0 !important;
}

/* Footer: label-style headings for the 4-column sitemap. */
#footer-widgets .footer-widget {
	line-height: 1.4;
}

/* ==========================================================================
   Ecosystem page (/ecosystem/) — unique components
   ========================================================================== */

/* Immersive ecosystem hero: full-bleed dark band over the night-Earth, the
   module constellation drawn live on a canvas behind the centred headline. */
.cq-ecohero.et_pb_section {
	position: relative;
	overflow: hidden;
	min-height: 520px;
	display: flex;
	flex-direction: column;
	justify-content: center;
}
.cq-ecohero > canvas {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	display: block;
	z-index: 1;
	pointer-events: auto;
}
.cq-ecohero .et_pb_row {
	position: relative;
	z-index: 2;
}
.cq-ecohero .et_pb_column { text-align: center; }
@media (max-width: 980px) {
	.cq-ecohero.et_pb_section { min-height: 440px; }
	.cq-ecohero > canvas { opacity: 0.5; }
}

/* ==========================================================================
   ESG & Sustainability page — components unique to this page
   ========================================================================== */

/* Strata: the reporting stack — the disclosure at the top resting on source
   data at the bottom, with a rail showing the trace back down. */
.cq-strata {
	position: relative;
	max-width: 430px;
	margin: 0 auto;
	padding-left: 30px;
}
.cq-strata::before {
	content: "";
	position: absolute;
	left: 9px;
	top: 14px;
	bottom: 46px;
	width: 2px;
	border-radius: 2px;
	background: linear-gradient(180deg, var(--cq-sky), var(--cq-teal), var(--cq-green));
}
.cq-strata-tier {
	position: relative;
	display: flex;
	align-items: center;
	gap: 12px;
	background: #ffffff;
	border: 1px solid var(--cq-ink-50);
	border-radius: 12px;
	padding: 12px 15px;
	margin-bottom: 10px;
	box-shadow: 0 4px 14px -8px rgba(10, 37, 64, 0.18);
	transition: transform 0.22s ease, box-shadow 0.22s ease, border-color 0.22s ease;
}
.cq-strata-tier:hover {
	transform: translateX(5px);
	border-color: var(--cq-green-300, #7ED9B4);
	box-shadow: 0 10px 22px -10px rgba(10, 37, 64, 0.22);
}
.cq-strata-tier::before {
	content: "";
	position: absolute;
	left: -25px;
	top: 50%;
	width: 10px;
	height: 10px;
	margin-top: -5px;
	border-radius: 50%;
	background: #ffffff;
	border: 2px solid var(--cq-teal);
}
.cq-strata-tier.t-top::before { border-color: var(--cq-sky); }
.cq-strata-tier.t-base::before { border-color: var(--cq-green); }
.cq-strata-tier .ic {
	flex: 0 0 34px;
	width: 34px;
	height: 34px;
	border-radius: 9px;
	background: var(--cq-green-tint);
	display: flex;
	align-items: center;
	justify-content: center;
}
.cq-strata-tier.t-top .ic { background: #EAF2FE; }
.cq-strata-tier .ic img { width: 18px; height: 18px; }
.cq-strata-tier b { display: block; font-size: 13.5px; color: var(--cq-ink); line-height: 1.3; }
.cq-strata-tier span { display: block; font-size: 11.5px; color: var(--cq-ink-500); line-height: 1.45; margin-top: 1px; }
.cq-strata-cap {
	margin-top: 10px;
	font-size: 12px;
	color: var(--cq-ink-300);
	font-style: italic;
	text-align: center;
}

/* ==========================================================================
   Carbon Accounting page — built to the approved mockup
   ========================================================================== */

/* Product window: the Carbon Accounting view of the app. */
.cq-ca-app {
	display: flex;
	border-radius: 14px;
	overflow: hidden;
	border: 1px solid rgba(10, 37, 64, 0.1);
	box-shadow: 0 26px 52px -22px rgba(10, 37, 64, 0.4), 0 3px 10px rgba(10, 37, 64, 0.06);
	background: #ffffff;
	max-width: 620px;
}
.cq-ca-side { flex: 0 0 108px; background: #0E2C4A; padding: 13px 9px; }
.cq-ca-side .lg { color: #ffffff; font-weight: 600; font-size: 11.5px; margin-bottom: 12px; padding-left: 6px; }
.cq-ca-side i {
	display: block;
	font-style: normal;
	font-size: 9.5px;
	color: #8FA6C0;
	padding: 5px 7px;
	border-radius: 6px;
	margin-bottom: 1px;
	line-height: 1.4;
}
.cq-ca-side i.on { background: rgba(255, 255, 255, 0.12); color: #ffffff; font-weight: 600; }
.cq-ca-main { flex: 1; padding: 11px; background: #F6F9FC; min-width: 0; }
.cq-ca-top { display: flex; justify-content: space-between; align-items: center; margin-bottom: 9px; gap: 6px; }
.cq-ca-top b { font-size: 12px; color: var(--cq-ink); }
.cq-ca-pill {
	font-size: 8.5px;
	color: var(--cq-ink-500);
	background: #ffffff;
	border: 1px solid var(--cq-ink-50);
	border-radius: 5px;
	padding: 3px 7px;
	white-space: nowrap;
}
.cq-ca-stats { display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px; }
.cq-ca-stat { background: #ffffff; border: 1px solid var(--cq-ink-50); border-radius: 8px; padding: 7px 8px; }
.cq-ca-stat em { display: block; font-style: normal; font-size: 8px; color: var(--cq-ink-300); letter-spacing: 0.04em; }
.cq-ca-stat b { display: block; font-size: 13px; color: var(--cq-ink); line-height: 1.25; margin-top: 1px; }
.cq-ca-stat span { display: block; font-size: 8px; color: var(--cq-ink-300); }
.cq-ca-charts { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; margin-top: 6px; }
.cq-ca-card { background: #ffffff; border: 1px solid var(--cq-ink-50); border-radius: 8px; padding: 8px; }
.cq-ca-card em { display: block; font-style: normal; font-size: 8.5px; color: var(--cq-ink-300); margin-bottom: 6px; }
.cq-ca-donutwrap { display: flex; align-items: center; gap: 8px; }
.cq-donut {
	position: relative;
	width: 62px;
	height: 62px;
	flex: 0 0 62px;
	border-radius: 50%;
	background: conic-gradient(var(--cq-green) 0 18%, var(--cq-teal) 18% 49%, var(--cq-sky) 49% 100%);
}
.cq-donut::after {
	content: "";
	position: absolute;
	inset: 26%;
	background: #ffffff;
	border-radius: 50%;
}
.cq-donut-lg span { display: flex; align-items: center; gap: 4px; font-size: 8px; color: var(--cq-ink-500); margin-bottom: 3px; }
.cq-donut-lg i { width: 7px; height: 7px; border-radius: 2px; display: inline-block; }
.cq-bars { display: flex; align-items: flex-end; gap: 4px; height: 62px; }
.cq-bars span { flex: 1; border-radius: 3px 3px 0 0; background: linear-gradient(180deg, var(--cq-teal), var(--cq-green)); }

/* Five-step foundation flow: activity -> classification -> factor -> calc -> result */
.cq-flow5 { display: flex; align-items: flex-start; justify-content: center; gap: 6px; flex-wrap: wrap; }
.cq-flow5-step { flex: 1 1 118px; max-width: 150px; text-align: center; }
.cq-flow5-step .b {
	width: 54px;
	height: 54px;
	margin: 0 auto 9px;
	border-radius: 50%;
	background: var(--cq-green-tint);
	border: 1px solid rgba(31, 169, 113, 0.22);
	display: flex;
	align-items: center;
	justify-content: center;
	transition: 0.25s ease;
}
.cq-flow5-step .b img { width: 22px; height: 22px; transition: filter 0.25s ease; }
.cq-flow5-step:hover .b { background-image: linear-gradient(135deg, var(--cq-green), var(--cq-teal)); border-color: transparent; transform: translateY(-3px); }
.cq-flow5-step:hover .b img { filter: brightness(0) invert(1); }
.cq-flow5-step b { display: block; font-size: 13px; color: var(--cq-ink); }
.cq-flow5-step span { display: block; font-size: 11px; color: var(--cq-ink-500); line-height: 1.4; margin-top: 2px; }
.cq-flow5-step u { display: block; text-decoration: none; font-size: 11.5px; font-weight: 600; color: var(--cq-green-700); margin-top: 3px; }
.cq-flow5-ar { flex: 0 0 auto; color: var(--cq-ink-300); font-size: 16px; padding-top: 18px; }
@media (max-width: 780px) { .cq-flow5-ar { display: none; } }

/* Eight-dimension accounting model grid */
.cq-mgrid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; }
@media (max-width: 980px) { .cq-mgrid { grid-template-columns: repeat(2, 1fr); } }
.cq-mgrid div {
	background: #ffffff;
	border: 1px solid var(--cq-ink-50);
	border-radius: 11px;
	padding: 12px 11px;
	transition: 0.22s ease;
}
.cq-mgrid div:hover { border-color: var(--cq-green-300, #7ED9B4); transform: translateY(-2px); box-shadow: 0 8px 20px -12px rgba(10, 37, 64, 0.2); }
.cq-mgrid img { width: 18px; height: 18px; margin-bottom: 7px; }
.cq-mgrid b { display: block; font-size: 12.5px; color: var(--cq-ink); }
.cq-mgrid span { display: block; font-size: 10.5px; color: var(--cq-ink-300); margin-top: 1px; }

/* Emission factor detail card + capability rows */
.cq-fcard { background: #ffffff; border: 1px solid var(--cq-ink-50); border-radius: 12px; padding: 14px; box-shadow: 0 10px 26px -18px rgba(10, 37, 64, 0.3); }
.cq-fcard > em { display: block; font-style: normal; font-size: 9.5px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--cq-ink-300); }
.cq-fcard > b { display: block; font-size: 14.5px; color: var(--cq-ink); margin: 2px 0 10px; }
.cq-fcard dl { display: grid; grid-template-columns: auto 1fr; gap: 6px 14px; margin: 0; font-size: 11.5px; }
.cq-fcard dt { color: var(--cq-ink-300); }
.cq-fcard dd { margin: 0; color: var(--cq-ink); font-weight: 600; text-align: right; }
.cq-fcard .tag { display: inline-block; background: var(--cq-green-tint); color: var(--cq-green-700); border-radius: 999px; padding: 1px 7px; font-size: 9.5px; font-weight: 600; margin-left: 5px; }
.cq-ffeat { list-style: none; margin: 0; padding: 0; }
.cq-ffeat li { display: flex; gap: 11px; align-items: flex-start; margin-bottom: 13px; }
.cq-ffeat li:last-child { margin-bottom: 0; }
.cq-ffeat .ic { flex: 0 0 32px; width: 32px; height: 32px; border-radius: 9px; background: var(--cq-green-tint); display: flex; align-items: center; justify-content: center; }
.cq-ffeat .ic img { width: 17px; height: 17px; }
.cq-ffeat b { display: block; font-size: 13px; color: var(--cq-ink); }
.cq-ffeat span { display: block; font-size: 11.5px; color: var(--cq-ink-500); line-height: 1.4; }

/* Three scope cards */
.cq-scope3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
@media (max-width: 980px) { .cq-scope3 { grid-template-columns: 1fr; } }
.cq-scope3 > div { border-radius: 14px; padding: 18px; border: 1px solid var(--cq-ink-50); }
.cq-scope3 .s1 { background: #EFF9F4; }
.cq-scope3 .s2 { background: #EEF4FD; }
.cq-scope3 .s3 { background: #F0F9F7; }
.cq-scope3 .hd { display: flex; align-items: center; gap: 10px; margin-bottom: 12px; }
.cq-scope3 .hd .ic { width: 38px; height: 38px; border-radius: 10px; background: #ffffff; display: flex; align-items: center; justify-content: center; flex: 0 0 38px; }
.cq-scope3 .hd .ic img { width: 20px; height: 20px; }
.cq-scope3 .hd b { display: block; font-size: 16px; color: var(--cq-ink); }
.cq-scope3 .hd span { display: block; font-size: 11.5px; color: var(--cq-ink-500); }
.cq-scope3 ul { list-style: none; margin: 0; padding: 0; }
.cq-scope3 li { position: relative; padding-left: 17px; font-size: 12.5px; color: var(--cq-ink-500); margin-bottom: 6px; line-height: 1.45; }
.cq-scope3 li::before { content: ""; position: absolute; left: 0; top: 7px; width: 6px; height: 6px; border-radius: 50%; background: var(--cq-green); opacity: 0.8; }
.cq-scope3 .sub { margin-top: 12px; background: #ffffff; border-radius: 9px; padding: 10px 12px; }
.cq-scope3 .sub em { display: block; font-style: normal; font-size: 10.5px; font-weight: 600; color: var(--cq-ink); margin-bottom: 5px; }

/* Organisational boundary tree */
.cq-tree { text-align: center; }
.cq-tree .lvl { display: flex; justify-content: center; gap: 10px; flex-wrap: wrap; }
.cq-tree .nd {
	background: #ffffff;
	border: 1.5px solid var(--cq-ink-50);
	border-radius: 9px;
	padding: 8px 14px;
	font-size: 11.5px;
	font-weight: 600;
	color: var(--cq-ink);
}
.cq-tree .nd.root { background: var(--cq-green-tint); border-color: rgba(31, 169, 113, 0.35); }
.cq-tree .nd small { display: block; font-weight: 400; font-size: 9.5px; color: var(--cq-ink-300); }
.cq-tree .cn { height: 16px; position: relative; }
.cq-tree .cn::before { content: ""; position: absolute; left: 50%; top: 0; bottom: 0; width: 1.5px; background: var(--cq-ink-100); }

/* Calculation example + pipeline rail */
.cq-calceg { background: #ffffff; border: 1px solid var(--cq-ink-50); border-radius: 12px; padding: 16px; text-align: center; box-shadow: 0 10px 26px -18px rgba(10, 37, 64, 0.3); }
.cq-calceg em { display: block; font-style: normal; font-size: 9.5px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--cq-ink-300); margin-bottom: 10px; }
.cq-calceg b { display: block; font-size: 15px; color: var(--cq-ink); line-height: 1.6; }
.cq-calceg i { display: block; font-style: normal; font-size: 15px; color: var(--cq-ink-300); }
.cq-calceg .fin { color: var(--cq-green-700); font-size: 17px; margin-top: 4px; }
.cq-crail { list-style: none; margin: 0; padding: 0; }
.cq-crail li {
	background: #ffffff;
	border: 1px solid var(--cq-ink-50);
	border-radius: 8px;
	padding: 8px 12px;
	font-size: 11.5px;
	font-weight: 600;
	color: var(--cq-ink);
	margin-bottom: 6px;
	text-align: center;
}
.cq-crail li:last-child { margin-bottom: 0; background: var(--cq-green-tint); border-color: rgba(31, 169, 113, 0.3); color: var(--cq-green-700); }

/* Multi-gas row */
.cq-gas { text-align: center; }
.cq-gas .row { display: flex; justify-content: center; gap: 8px; flex-wrap: wrap; margin-bottom: 12px; }
.cq-gas .g {
	width: 54px;
	background: #ffffff;
	border: 1px solid var(--cq-ink-50);
	border-radius: 10px;
	padding: 9px 4px;
	font-size: 11px;
	font-weight: 600;
	color: var(--cq-ink);
}
.cq-gas .g img { width: 17px; height: 17px; display: block; margin: 0 auto 4px; }
.cq-gas .gwp { display: inline-block; background: var(--cq-green-tint); border: 1px solid rgba(31, 169, 113, 0.3); border-radius: 999px; padding: 7px 18px; font-size: 12px; font-weight: 600; color: var(--cq-green-700); }
.cq-gas .arw { color: var(--cq-ink-300); font-size: 15px; margin: 6px 0; }
.cq-gas .out { display: inline-block; background: var(--cq-ink); color: #ffffff; border-radius: 9px; padding: 8px 20px; font-size: 13px; font-weight: 600; }

/* Reporting period table */
.cq-ptable { width: 100%; border-collapse: collapse; font-size: 11.5px; background: #ffffff; border-radius: 10px; overflow: hidden; border: 1px solid var(--cq-ink-50); }
.cq-ptable th { background: #F4F7FB; color: var(--cq-ink-300); font-weight: 600; font-size: 10px; letter-spacing: 0.05em; text-transform: uppercase; padding: 9px 10px; text-align: left; }
.cq-ptable td { padding: 9px 10px; border-top: 1px solid var(--cq-ink-50); color: var(--cq-ink); }
.cq-ptable .ok { background: var(--cq-green-tint); color: var(--cq-green-700); border-radius: 999px; padding: 2px 9px; font-size: 10px; font-weight: 600; }
.cq-ptable .wip { background: #EAF2FE; color: #2563EB; border-radius: 999px; padding: 2px 9px; font-size: 10px; font-weight: 600; }

/* Data validation status cards */
.cq-valid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.cq-valid > div { background: #ffffff; border: 1px solid var(--cq-ink-50); border-radius: 11px; padding: 12px; display: flex; gap: 10px; align-items: flex-start; }
.cq-valid .dot { flex: 0 0 26px; width: 26px; height: 26px; border-radius: 8px; display: flex; align-items: center; justify-content: center; font-size: 13px; font-weight: 700; }
.cq-valid .warn .dot { background: #FFF4D6; color: #8A6D1A; }
.cq-valid .good .dot { background: var(--cq-green-tint); color: var(--cq-green-700); }
.cq-valid b { display: block; font-size: 12.5px; color: var(--cq-ink); line-height: 1.3; }
.cq-valid span { display: block; font-size: 11px; color: var(--cq-ink-500); margin-top: 1px; }

/* Calculation traceability */
.cq-trace { display: flex; gap: 16px; align-items: flex-start; background: #ffffff; border: 1px solid var(--cq-ink-50); border-radius: 12px; padding: 16px; box-shadow: 0 10px 26px -18px rgba(10, 37, 64, 0.3); }
@media (max-width: 620px) { .cq-trace { flex-direction: column; } }
.cq-trace .res { flex: 0 0 128px; background: var(--cq-green-tint); border-radius: 10px; padding: 14px 10px; text-align: center; }
.cq-trace .res em { display: block; font-style: normal; font-size: 9.5px; color: var(--cq-ink-300); text-transform: uppercase; letter-spacing: 0.06em; }
.cq-trace .res b { display: block; font-size: 20px; color: var(--cq-green-700); line-height: 1.15; margin-top: 4px; }
.cq-trace .res span { display: block; font-size: 11px; color: var(--cq-ink-500); }
.cq-trace ul { list-style: none; margin: 0; padding: 0; flex: 1; }
.cq-trace li { position: relative; padding-left: 16px; font-size: 11.5px; color: var(--cq-ink-500); margin-bottom: 5px; line-height: 1.45; }
.cq-trace li::before { content: ""; position: absolute; left: 0; top: 6px; width: 6px; height: 6px; border-radius: 50%; background: var(--cq-teal); }
.cq-trace li b { color: var(--cq-ink); font-weight: 600; }

/* Downstream outputs flow */
.cq-outputs { display: flex; align-items: flex-start; justify-content: space-between; gap: 4px; flex-wrap: wrap; }
.cq-outputs .o { flex: 1 1 90px; text-align: center; }
.cq-outputs .o .b { width: 42px; height: 42px; margin: 0 auto 7px; border-radius: 11px; background: var(--cq-green-tint); display: flex; align-items: center; justify-content: center; transition: 0.22s ease; }
.cq-outputs .o .b img { width: 19px; height: 19px; transition: filter 0.22s ease; }
.cq-outputs .o:hover .b { background-image: linear-gradient(135deg, var(--cq-green), var(--cq-teal)); }
.cq-outputs .o:hover .b img { filter: brightness(0) invert(1); }
.cq-outputs .o span { font-size: 11px; font-weight: 600; color: var(--cq-ink); line-height: 1.3; display: block; }
.cq-outputs .ar { flex: 0 0 auto; color: var(--cq-ink-300); font-size: 13px; padding-top: 13px; }
@media (max-width: 780px) { .cq-outputs .ar { display: none; } }

/* Two-column checklist (enterprise section) */
.cq-check2 { column-count: 2; column-gap: 26px; }
@media (max-width: 620px) { .cq-check2 { column-count: 1; } }
.cq-check2 ul { list-style: none; margin: 0; padding: 0; }
.cq-check2 li { position: relative; padding-left: 27px; font-size: 13.5px; color: var(--cq-ink-500); margin-bottom: 11px; line-height: 1.45; break-inside: avoid; }
.cq-check2 li::before {
	content: "\2713";
	position: absolute;
	left: 0;
	top: 1px;
	width: 18px;
	height: 18px;
	border-radius: 50%;
	background: var(--cq-green-tint);
	color: var(--cq-green-700);
	font-size: 10px;
	font-weight: 700;
	display: flex;
	align-items: center;
	justify-content: center;
}

/* Assessment intro badges (Quick / Practical / Confidential). */
.cq-marks { display: flex; gap: 30px; flex-wrap: wrap; }
.cq-marks > div { display: flex; align-items: center; gap: 11px; }
.cq-marks .ic {
	width: 42px; height: 42px; flex: 0 0 42px; border-radius: 50%;
	background: var(--cq-green-tint); display: flex; align-items: center; justify-content: center;
}
.cq-marks .ic img { width: 20px !important; height: 20px !important; max-width: 20px; display: block; }
.cq-marks b { display: block; font-size: 13.5px; color: var(--cq-ink); line-height: 1.3; }
.cq-marks em { display: block; font-style: normal; font-size: 12px; color: var(--cq-ink-300); line-height: 1.3; }

/* ==========================================================================
   Arc hero visual — one large disc anchored to the SECTION, so it fills the
   band from top to bottom, is clipped by the section (never adding height),
   and runs off the right edge leaving only its left arc visible.
   ========================================================================== */
.cq-quiz-intro.et_pb_section { position: relative; overflow: hidden; min-height: 470px; display: flex; align-items: center; }
/* `display: flex` above outranks the browser's [hidden] { display: none }, so
   hiding the welcome screen left an empty band. Make hidden win. */
.cq-quiz-intro[hidden], .et_pb_section[hidden], [hidden] { display: none !important; }
/* row/column must not become the containing block, or the disc would be
   trapped in the column and leave gaps above and below */
.cq-quiz-intro .et_pb_row,
.cq-quiz-intro .et_pb_column,
.cq-quiz-intro .et_pb_module,
.cq-quiz-intro .et_pb_text_inner { position: static !important; overflow: visible !important; }
/* the copy column sits above the disc; the visual column stays static so the
   disc's percentages still resolve against the section */
.cq-quiz-intro .et_pb_column:first-child {
	position: relative !important;
	z-index: 3;
}

.cq-arc { position: static; }

/* pale ring hugging the photograph's left arc */
.cq-arc::before {
	content: "";
	position: absolute;
	top: 50%;
	left: 45%;
	transform: translateY(-50%);
	width: 800px;
	aspect-ratio: 1 / 1;
	border-radius: 50%;
	background: linear-gradient(135deg, rgba(31, 169, 113, 0.14), rgba(59, 130, 246, 0.07) 52%, rgba(255, 255, 255, 0) 70%);
	z-index: 0;
}
.cq-arc-img {
	position: absolute;
	top: 50%;
	left: 47%;
	transform: translateY(-50%);
	width: 780px;
	aspect-ratio: 1 / 1;
	border-radius: 50%;
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
	z-index: 1;
}
.cq-arc-card {
	position: absolute;
	left: 56%;
	bottom: 15%;
	z-index: 3;
	width: 252px;
	background: #ffffff;
	border-radius: 14px;
	padding: 17px 19px;
	box-shadow: 0 20px 44px -20px rgba(10, 37, 64, 0.42);
}
.cq-arc-card .ic {
	width: 38px;
	height: 38px;
	border-radius: 11px;
	background: var(--cq-green-tint);
	display: flex;
	align-items: center;
	justify-content: center;
	margin-bottom: 11px;
}
.cq-arc-card .ic img { width: 19px; height: 19px; display: block; }
.cq-arc-card p {
	margin: 0;
	font-size: 14.5px;
	font-weight: 600;
	color: var(--cq-ink);
	line-height: 1.45;
}
@media (max-width: 1080px) {
	.cq-arc-card { left: 50%; width: 230px; }
}
@media (max-width: 980px) {
	.cq-quiz-intro .et_pb_column { position: relative !important; }
	.cq-arc { position: relative; height: 280px; }
	.cq-arc::before, .cq-arc-img { position: absolute; left: -8%; width: 116%; }
	.cq-arc-card { left: 50%; transform: translateX(-50%); bottom: -4%; width: 240px; }
}

/* Section-to-section transition on the assessment page. */
.cq-fade-out { opacity: 0; transform: translateY(-8px); transition: opacity 0.32s ease, transform 0.32s ease; }
.cq-fade-in { animation: cq-fade-in 0.38s ease both; }
@keyframes cq-fade-in { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) {
	.cq-fade-out, .cq-fade-in { transition: none; animation: none; }
}

/* ==========================================================================
   Insights (knowledge listing) — components unique to this page
   ========================================================================== */

/* Hero: the photograph is a section background that runs off the right edge of
   the page at full hero height (as in the approved design), with the copy on a
   white-to-transparent wash over it and the pull-quote sitting on the image. */
.cq-ins-hero.et_pb_section {
	position: relative;
	overflow: hidden;
	background-position: right center !important;
	background-size: cover !important;
}
/* Keep the left half clean white so the headline, search and chips sit on
   paper, with the photograph confined to the right (as in the design). */
.cq-ins-hero.et_pb_section::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 1;
	background: linear-gradient(90deg,
		#ffffff 0%, #ffffff 34%,
		rgba(255, 255, 255, 0.92) 44%,
		rgba(255, 255, 255, 0.45) 56%,
		rgba(255, 255, 255, 0.08) 68%,
		rgba(255, 255, 255, 0) 78%);
}
/* the quote belongs on the bright sky at the top, not the dark treeline */
.cq-ins-hero .et_pb_column:last-child { align-self: flex-start; }
.cq-ins-hero h1 { max-width: 12ch; }
.cq-ins-hero .et_pb_row { position: relative; z-index: 2; }
@media (min-width: 981px) {
	.cq-ins-hero.et_pb_section { min-height: 470px; display: flex; align-items: center; }
}
/* Section heading with "View all insights" opposite it, on one line.
   Flex rather than float: wpautop wraps the link in its own <p>, which a
   float cannot pull back up beside the heading. */
.cq-latest-head .et_pb_text_inner {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 24px;
	flex-wrap: wrap;
}
.cq-latest-head .et_pb_text_inner h2,
.cq-latest-head .et_pb_text_inner p { margin: 0 !important; padding: 0 !important; }
.cq-viewall {
	font-size: 13.5px;
	font-weight: 600;
	color: var(--cq-green-700) !important;
	text-decoration: none;
	white-space: nowrap;
	transition: transform 0.2s ease, color 0.2s ease;
	display: inline-block;
}
.cq-viewall:hover { color: var(--cq-green) !important; transform: translateX(3px); }

.cq-ins-quote { position: relative; padding: 0 0 0 6px; }
.cq-ins-quote .q { position: relative; max-width: 280px; }
.cq-ins-quote .mark { font-size: 34px; line-height: 1; color: var(--cq-green); font-weight: 700; }
.cq-ins-quote .ln {
	font-size: 19px;
	font-weight: 600;
	color: var(--cq-ink);
	line-height: 1.35;
	margin-top: 2px;
}
.cq-ins-quote .rule { width: 46px; height: 3px; border-radius: 2px; background: var(--cq-green); margin-top: 14px; }

/* Search + category pills. */
.cq-ins-search { position: relative; max-width: 430px; }
.cq-ins-search input[type="search"],
.cq-ins-search input[type="text"] {
	width: 100%;
	border: 1px solid var(--cq-ink-50);
	border-radius: 999px;
	padding: 13px 54px 13px 20px !important;
	font-size: 13.5px;
	color: var(--cq-ink);
	background: #ffffff;
	box-shadow: 0 4px 14px -10px rgba(10, 37, 64, 0.3);
}
.cq-ins-search input:focus { outline: none; border-color: var(--cq-green); }
.cq-ins-search button {
	position: absolute;
	right: 5px;
	top: 50%;
	transform: translateY(-50%);
	width: 38px;
	height: 38px;
	border: none;
	border-radius: 50%;
	background: var(--cq-ink);
	color: #ffffff;
	cursor: pointer;
	font-size: 14px;
	line-height: 1;
	transition: background-color 0.2s ease;
}
.cq-ins-search button:hover { background: var(--cq-green); }
.cq-ins-search button svg { width: 16px; height: 16px; display: block; margin: 0 auto; }
.cq-pills { display: flex; flex-wrap: wrap; gap: 9px; margin-top: 20px; }
.cq-pills a {
	display: inline-block;
	border: 1px solid var(--cq-ink-50);
	background: #ffffff;
	border-radius: 999px;
	padding: 8px 17px;
	font-size: 12.5px;
	font-weight: 600;
	color: var(--cq-ink-500);
	text-decoration: none;
	transition: 0.18s ease;
}
.cq-pills a:hover { border-color: var(--cq-green); color: var(--cq-green-700); }
.cq-pills a.on { background: var(--cq-green); border-color: var(--cq-green); color: #ffffff; }

/* Featured insight: copy left, large image card right. */
.cq-feat {
	position: relative;
	display: block;
	aspect-ratio: 16 / 9;
	min-height: 280px;
	border-radius: 14px;
	overflow: hidden;
	text-decoration: none;
	background-color: #0F2A47;
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
}
.cq-feat::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, rgba(10, 37, 64, 0) 32%, rgba(8, 28, 51, 0.86) 100%);
}
.cq-feat .in { position: absolute; left: 0; right: 0; bottom: 0; padding: 22px 24px; z-index: 2; }
.cq-feat .chip {
	display: inline-block;
	background: rgba(255, 255, 255, 0.92);
	color: var(--cq-ink);
	border-radius: 999px;
	padding: 4px 12px;
	font-size: 10px;
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	margin-bottom: 10px;
}
.cq-feat .t { display: block; color: #ffffff; font-size: 22px; font-weight: 600; line-height: 1.3; }
.cq-feat .meta { display: block; color: #C4D2E2; font-size: 12px; margin-top: 7px; }
.cq-feat:hover .t { text-decoration: underline; text-underline-offset: 3px; }

/* Featured write-up beside the card (rendered by [cq_featured_text]). */
.cq-feat-eyebrow {
	font-size: 10.5px;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	font-weight: 600;
	color: var(--cq-green-700);
	margin: 0 0 10px;
}
.cq-feat-h { font-size: 27px; font-weight: 600; color: var(--cq-ink); line-height: 1.28; margin: 0 0 12px; }
.cq-feat-x { font-size: 14.5px; color: var(--cq-ink-500); line-height: 1.6; margin: 0 0 20px; }
.cq-feat-btn {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	background: var(--cq-green);
	color: #ffffff !important;
	border-radius: 8px;
	padding: 12px 24px;
	font-size: 14px;
	font-weight: 600;
	text-decoration: none;
	transition: background-image 0.25s ease;
}
.cq-feat-btn:hover { background-image: linear-gradient(90deg, var(--cq-green), var(--cq-teal)); }

/* Category chip laid over listing thumbnails. The label itself is injected
   per category by climarq_category_chip_css(); this is the chip's styling. */
.cq-blogfeed .entry-featured-image-url { position: relative; }
.cq-blogfeed .entry-featured-image-url::after {
	position: absolute;
	top: 12px;
	left: 12px;
	z-index: 2;
	background: rgba(255, 255, 255, 0.94);
	color: var(--cq-ink);
	border-radius: 999px;
	padding: 4px 11px;
	font-size: 9.5px;
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	box-shadow: 0 2px 8px rgba(10, 37, 64, 0.16);
	pointer-events: none;
}

/* ==========================================================================
   Single insight article (single.php) - applies to every post automatically
   ========================================================================== */
.cq-art { background: #ffffff; }
.cq-art-wrap-wide { width: 94%; max-width: 1220px; margin: 0 auto; }

/* breadcrumb */
.cq-crumb { padding: 14px 0 0; font-size: 12.5px; color: var(--cq-ink-300); }
.cq-crumb a { color: var(--cq-ink-300) !important; text-decoration: none; }
.cq-crumb a:hover { color: var(--cq-green-700) !important; }
.cq-crumb span { margin: 0 7px; opacity: 0.6; }
.cq-crumb em { font-style: normal; color: var(--cq-ink-500); }

/* hero */
.cq-art-head { background: linear-gradient(160deg, #F2FAF6 0%, #FFFFFF 82%); padding: 22px 0 34px; }
.cq-art-headgrid { display: grid; grid-template-columns: 1fr 1fr; gap: 44px; align-items: center; }
@media (max-width: 980px) { .cq-art-headgrid { grid-template-columns: 1fr; gap: 26px; } }
.cq-art-eyebrow {
	font-size: 11px; letter-spacing: 0.16em; text-transform: uppercase;
	font-weight: 600; color: var(--cq-green-700); margin: 0 0 12px;
}
.cq-art-title { font-size: 40px; font-weight: 600; color: var(--cq-ink); line-height: 1.16; margin: 0; }
.cq-art-title span { color: var(--cq-green); }
@media (max-width: 780px) { .cq-art-title { font-size: 28px; } }
.cq-art-meta { font-size: 13px; color: var(--cq-ink-300); margin: 14px 0 0; }
.cq-art-standfirst { font-size: 15.5px; line-height: 1.65; color: var(--cq-ink-500); margin: 14px 0 0; max-width: 52ch; }
.cq-author { display: flex; align-items: center; gap: 12px; margin-top: 22px; }
.cq-author img, .cq-author .ini {
	width: 46px; height: 46px; border-radius: 50%; flex: 0 0 46px;
	object-fit: cover; display: flex; align-items: center; justify-content: center;
	background: var(--cq-green-tint); color: var(--cq-green-700); font-weight: 700; font-size: 17px;
}
.cq-author b { display: block; font-size: 13.5px; color: var(--cq-ink); }
.cq-author span { display: block; font-size: 12px; color: var(--cq-ink-300); }
.cq-art-hero { position: relative; }
.cq-art-hero img { width: 100%; height: auto; display: block; border-radius: 14px; box-shadow: 0 20px 44px -24px rgba(10, 37, 64, 0.4); }
.cq-art-pull {
	position: absolute; right: -6px; bottom: 22px; max-width: 270px;
	background: #ffffff; border-radius: 12px; padding: 15px 17px;
	font-size: 13.5px; line-height: 1.5; color: var(--cq-ink);
	box-shadow: 0 14px 34px -16px rgba(10, 37, 64, 0.4);
}
.cq-art-pull .m { display: block; font-size: 22px; line-height: 1; color: var(--cq-green); font-weight: 700; margin-bottom: 4px; }
@media (max-width: 980px) { .cq-art-pull { position: static; margin-top: 12px; max-width: none; } }

/* body + sidebar */
.cq-art-main { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: 46px; padding: 34px 0 54px; align-items: start; }
@media (max-width: 1080px) { .cq-art-main { grid-template-columns: 1fr; gap: 30px; } }
.cq-art-body p { font-size: 16px; line-height: 1.75; color: var(--cq-ink-500); margin: 0 0 20px; }
.cq-art-body h2 { font-size: 25px; font-weight: 600; color: var(--cq-ink); line-height: 1.3; margin: 34px 0 12px; scroll-margin-top: 90px; }
.cq-art-body h2:first-child { margin-top: 0; }
.cq-art-body h3 { font-size: 19px; font-weight: 600; color: var(--cq-ink); margin: 26px 0 10px; }
.cq-art-body ul, .cq-art-body ol { margin: 0 0 20px 20px; }
.cq-art-body li { font-size: 16px; line-height: 1.7; color: var(--cq-ink-500); margin-bottom: 8px; }
.cq-art-body strong { color: var(--cq-ink); font-weight: 600; }
.cq-art-body a { color: var(--cq-green-700); text-decoration: underline; text-underline-offset: 2px; }
.cq-art-body img { max-width: 100%; height: auto; border-radius: 12px; }

/* in-article blocks (shortcodes) */
.cq-callout {
	display: flex; gap: 12px; background: var(--cq-green-tint);
	border-left: 3px solid var(--cq-green); border-radius: 0 12px 12px 0;
	padding: 16px 20px; margin: 26px 0; font-size: 15.5px; font-weight: 500; color: var(--cq-ink);
}
.cq-callout span { font-size: 20px; line-height: 1; color: var(--cq-green); font-weight: 700; }
.cq-tip {
	display: flex; gap: 13px; background: #F1F8F5; border: 1px solid rgba(31, 169, 113, 0.2);
	border-radius: 12px; padding: 16px 18px; margin: 26px 0;
}
.cq-tip .ic { flex: 0 0 34px; width: 34px; height: 34px; border-radius: 9px; background: #ffffff; display: flex; align-items: center; justify-content: center; }
.cq-tip .ic img { width: 18px; height: 18px; }
.cq-tip b { display: block; font-size: 14.5px; color: var(--cq-ink); margin-bottom: 2px; }
.cq-tip span { font-size: 13.5px; color: var(--cq-ink-500); line-height: 1.55; }
.cq-points { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin: 26px 0; }
@media (max-width: 780px) { .cq-points { grid-template-columns: repeat(2, 1fr); } }
.cq-points > div { background: #ffffff; border: 1px solid var(--cq-ink-50); border-radius: 12px; padding: 16px 12px; text-align: center; }
.cq-points .ic { width: 38px; height: 38px; margin: 0 auto 8px; border-radius: 50%; background: var(--cq-green-tint); display: flex; align-items: center; justify-content: center; }
.cq-points .ic img { width: 19px; height: 19px; }
.cq-points b { font-size: 13px; color: var(--cq-ink); line-height: 1.35; }
.cq-steps { display: flex; align-items: flex-start; gap: 6px; margin: 26px 0; flex-wrap: wrap; }
.cq-steps .st { flex: 1 1 110px; text-align: center; }
.cq-steps .n {
	width: 42px; height: 42px; margin: 0 auto 9px; border-radius: 50%;
	background: var(--cq-green-tint); color: var(--cq-green-700); font-weight: 700; font-size: 16px;
	display: flex; align-items: center; justify-content: center;
}
.cq-steps b { display: block; font-size: 13.5px; color: var(--cq-ink); line-height: 1.3; }
.cq-steps span { display: block; font-size: 11.5px; color: var(--cq-ink-500); line-height: 1.45; margin-top: 3px; }
.cq-steps .ar { color: var(--cq-ink-300); padding-top: 12px; }
@media (max-width: 780px) { .cq-steps .ar { display: none; } }

/* sidebar */
.cq-art-side { position: sticky; top: 90px; display: flex; flex-direction: column; gap: 18px; }
@media (max-width: 1080px) { .cq-art-side { position: static; } }
.cq-side-box, .cq-share, .cq-side-tags {
	background: #ffffff; border: 1px solid var(--cq-ink-50); border-radius: 14px; padding: 18px 20px;
}
.cq-side-box h2, .cq-share h2, .cq-side-tags h2 { font-size: 15.5px; font-weight: 600; color: var(--cq-ink); margin: 0 0 14px; }
.cq-toc { list-style: none; margin: 0; padding: 0; }
.cq-toc li { display: flex; gap: 12px; align-items: baseline; padding: 9px 0; border-bottom: 1px solid var(--cq-ink-50); }
.cq-toc li:last-child { border-bottom: 0; padding-bottom: 0; }
.cq-toc span { font-size: 11.5px; font-weight: 700; color: var(--cq-green); flex: 0 0 20px; }
.cq-toc a { font-size: 13.5px; color: var(--cq-ink-500) !important; text-decoration: none; line-height: 1.45; }
.cq-toc a:hover { color: var(--cq-green-700) !important; }
.cq-rel { list-style: none; margin: 0; padding: 0; }
.cq-rel li { display: flex; gap: 12px; padding: 11px 0; border-bottom: 1px solid var(--cq-ink-50); }
.cq-rel li:last-child { border-bottom: 0; padding-bottom: 0; }
.cq-rel-img { flex: 0 0 74px; height: 58px; border-radius: 9px; background: #EEF3F8 center / cover no-repeat; display: block; }
.cq-rel-t { display: block; font-size: 13px; font-weight: 600; color: var(--cq-ink) !important; text-decoration: none; line-height: 1.35; }
.cq-rel-t:hover { color: var(--cq-green-700) !important; }
.cq-rel-m { display: block; font-size: 11px; color: var(--cq-ink-300); margin-top: 4px; }
.cq-side-cta { background: linear-gradient(135deg, #EDF9F3, #E9F2FC); border: 1px solid rgba(31, 169, 113, 0.2); border-radius: 14px; padding: 20px; }
.cq-side-cta .eyebrow { font-size: 10px; letter-spacing: 0.14em; text-transform: uppercase; font-weight: 600; color: var(--cq-green-700); margin: 0 0 8px; }
.cq-side-cta h2 { font-size: 19px; font-weight: 600; color: var(--cq-ink); line-height: 1.3; margin: 0 0 8px; }
.cq-side-cta p { font-size: 13px; color: var(--cq-ink-500); line-height: 1.55; margin: 0 0 16px; }
.cq-side-cta .btn {
	display: block; text-align: center; background: var(--cq-green); color: #ffffff !important;
	border-radius: 9px; padding: 12px 18px; font-size: 13.5px; font-weight: 600; text-decoration: none;
	transition: background-image 0.25s ease;
}
.cq-side-cta .btn:hover { background-image: linear-gradient(90deg, var(--cq-green), var(--cq-teal)); }
.cq-share > div { display: flex; gap: 10px; }
.cq-share a, .cq-share button {
	width: 38px; height: 38px; border-radius: 50%; border: 1px solid var(--cq-ink-50);
	background: #ffffff; color: var(--cq-ink-500); display: flex; align-items: center; justify-content: center;
	cursor: pointer; transition: 0.2s ease; padding: 0;
}
.cq-share a:hover, .cq-share button:hover { border-color: var(--cq-green); color: var(--cq-green-700); }
.cq-share svg { width: 16px; height: 16px; }
.cq-share .copied { border-color: var(--cq-green); color: var(--cq-green-700); }
.cq-tags { display: flex; flex-wrap: wrap; gap: 8px; }
.cq-tags a {
	background: #F4F7FB; border: 1px solid var(--cq-ink-50); border-radius: 999px;
	padding: 6px 13px; font-size: 12px; font-weight: 500; color: var(--cq-ink-500) !important; text-decoration: none;
}
.cq-tags a:hover { border-color: var(--cq-green); color: var(--cq-green-700) !important; }
/* Divi's default single-post furniture is replaced by the above.
   Scoped to #main-content on purpose: Divi uses .container for the header and
   the footer as well, so an unscoped override widened both. */
.single-post #sidebar, .single-post .et_post_meta_wrapper { display: none; }
.single-post #main-content #left-area { width: 100% !important; padding-right: 0 !important; }
.single-post #main-content > .container,
.single-post #main-content #content-area {
	width: 100% !important;
	max-width: none !important;
	padding: 0 !important;
}

/* Article grid (own markup, so search + chips can filter it in place). */
.cq-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; }
@media (max-width: 980px) { .cq-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 640px) { .cq-grid { grid-template-columns: 1fr; } }
.cq-card {
	display: flex;
	flex-direction: column;
	background: #ffffff;
	border: 1px solid var(--cq-ink-50);
	border-radius: 12px;
	overflow: hidden;
	box-shadow: 0 1px 2px rgba(10, 37, 64, 0.04);
	transition: transform 0.25s ease, box-shadow 0.25s ease;
}
.cq-card[hidden] { display: none; }
.cq-card:hover { transform: translateY(-3px); box-shadow: 0 12px 26px rgba(10, 37, 64, 0.1); }
.cq-card-img {
	position: relative;
	display: block;
	aspect-ratio: 16 / 10;
	background: #EEF3F8 center / cover no-repeat;
}
.cq-card-chip {
	position: absolute;
	top: 12px;
	left: 12px;
	background: rgba(255, 255, 255, 0.95);
	color: var(--cq-ink);
	border-radius: 999px;
	padding: 4px 11px;
	font-size: 9.5px;
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	box-shadow: 0 2px 8px rgba(10, 37, 64, 0.16);
}
.cq-card-body { padding: 16px 18px 18px; display: flex; flex-direction: column; flex: 1; }
.cq-card-title {
	font-size: 16.5px;
	font-weight: 600;
	color: var(--cq-ink) !important;
	line-height: 1.35;
	text-decoration: none;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	min-height: 2.7em;
}
.cq-card:hover .cq-card-title { color: var(--cq-green-700) !important; }
.cq-card-meta { font-size: 12px; color: var(--cq-ink-300); margin: 7px 0 8px; }
.cq-card p {
	font-size: 13.5px;
	color: var(--cq-ink-500);
	line-height: 1.55;
	margin: 0 0 12px;
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
}
.cq-card-more {
	margin-top: auto;
	font-size: 13px;
	font-weight: 600;
	color: var(--cq-sky, #3B82F6) !important;
	text-decoration: none;
	transition: transform 0.2s ease, color 0.2s ease;
	display: inline-block;
}
.cq-card:hover .cq-card-more { color: #2563EB !important; transform: translateX(2px); }
.cq-grid-empty { text-align: center; color: var(--cq-ink-300); font-size: 14px; padding: 26px 0 6px; }
.cq-grid-empty[hidden] { display: none; }
/* Chips are buttons now (they filter, they do not navigate). */
.cq-pills button {
	font-family: inherit;
	cursor: pointer;
	border: 1px solid var(--cq-ink-50);
	background: #ffffff;
	border-radius: 999px;
	padding: 8px 17px;
	font-size: 12.5px;
	font-weight: 600;
	color: var(--cq-ink-500);
	transition: 0.18s ease;
}
.cq-pills button:hover { border-color: var(--cq-green); color: var(--cq-green-700); }
.cq-pills button.on { background: var(--cq-green); border-color: var(--cq-green); color: #ffffff; }
.screen-reader-text {
	position: absolute !important;
	width: 1px; height: 1px;
	overflow: hidden; clip: rect(1px, 1px, 1px, 1px);
	white-space: nowrap;
}

/* Newsletter block: one compact row — message left, form right. */
.cq-news {
	position: relative;
	overflow: hidden;
	background: linear-gradient(120deg, #EFF9F4 0%, #EDF4FB 100%);
	border: 1px solid rgba(31, 169, 113, 0.18);
	border-radius: 16px;
	padding: 26px 32px;
	display: flex;
	align-items: center;
	gap: 40px;
}
.cq-news-txt { flex: 1.15; min-width: 0; }
.cq-news-form { flex: 1; min-width: 260px; }
.cq-news em {
	display: block;
	font-style: normal;
	font-size: 10.5px;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--cq-green-700);
	font-weight: 600;
}
.cq-news b { display: block; font-size: 23px; font-weight: 600; color: var(--cq-ink); margin: 7px 0 6px; line-height: 1.28; }
.cq-news p { font-size: 13.5px; color: var(--cq-ink-500); margin: 0; line-height: 1.5; }
.cq-news form { display: flex; gap: 10px; flex-wrap: wrap; margin: 0; }
.cq-news input[type="email"] {
	flex: 1 1 200px;
	border: 1px solid var(--cq-ink-50);
	border-radius: 9px;
	padding: 13px 16px !important;
	font-size: 13.5px;
	background: #ffffff;
	color: var(--cq-ink);
}
.cq-news input[type="email"]:focus { outline: none; border-color: var(--cq-green); }
.cq-news .sub {
	border: none;
	border-radius: 9px;
	padding: 13px 26px;
	background: var(--cq-green);
	color: #ffffff;
	font-size: 13.5px;
	font-weight: 600;
	cursor: pointer;
	white-space: nowrap;
	transition: background-image 0.2s ease;
}
.cq-news .sub:hover { background-image: linear-gradient(90deg, var(--cq-green), var(--cq-teal)); }
.cq-news small { display: block; font-size: 11px; line-height: 1.55; color: var(--cq-ink-300); margin-top: 9px; max-width: 44ch; }
.cq-news small a { color: var(--cq-ink-500); text-decoration: underline; }
.cq-news small a:hover { color: var(--cq-green-700); }
.cq-news .done {
	background: var(--cq-green-tint);
	border: 1px solid rgba(31, 169, 113, 0.3);
	color: var(--cq-green-700);
	border-radius: 9px;
	padding: 13px 18px;
	font-size: 13px;
	font-weight: 600;
}
.cq-news .done.warn { background: #FFF4D6; border-color: #F0DFA6; color: #8A6D1A; }
.cq-news-plane {
	position: absolute;
	top: 16px;
	right: 22px;
	width: 54px;
	height: 54px;
	color: rgba(31, 169, 113, 0.28);
	pointer-events: none;
}
@media (max-width: 860px) {
	.cq-news { flex-direction: column; align-items: stretch; gap: 18px; padding: 22px; }
	.cq-news b { font-size: 20px; }
	.cq-news-plane { display: none; }
}


/* ==========================================================================
   Compliance & Disclosures page — components unique to this page
   ========================================================================== */

/* Framework tiles: real logos with name + sublabel. */
.cq-fwtiles {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 14px;
}
@media (max-width: 980px) { .cq-fwtiles { grid-template-columns: repeat(2, 1fr); } }
.cq-fwtiles > div {
	background: #ffffff;
	border: 1px solid var(--cq-ink-50);
	border-radius: 12px;
	padding: 18px 14px 14px;
	text-align: center;
	transition: transform 0.22s ease, box-shadow 0.22s ease, border-color 0.22s ease;
}
.cq-fwtiles > div:hover {
	transform: translateY(-3px);
	border-color: var(--cq-green-300, #7ED9B4);
	box-shadow: 0 10px 24px rgba(10, 37, 64, 0.1);
}
.cq-fwtiles img { height: 44px; width: auto; max-width: 130px; object-fit: contain; margin: 0 auto 10px; display: block; }
.cq-fwtiles b { display: block; font-size: 13px; color: var(--cq-ink); }
.cq-fwtiles span { display: block; font-size: 10.5px; color: var(--cq-ink-300); line-height: 1.4; margin-top: 2px; }

/* Key benefits panel beside the process flow. */
.cq-bene {
	background: #ffffff;
	border: 1px solid var(--cq-ink-50);
	border-radius: 14px;
	padding: 20px 22px;
	box-shadow: 0 10px 26px -18px rgba(10, 37, 64, 0.3);
}
.cq-bene > b {
	display: block;
	font-size: 10.5px;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--cq-green-700);
	margin-bottom: 12px;
}
.cq-bene ul { list-style: none; margin: 0; padding: 0; }
.cq-bene li { position: relative; padding-left: 27px; font-size: 13px; color: var(--cq-ink-500); margin-bottom: 10px; line-height: 1.45; }
.cq-bene li:last-child { margin-bottom: 0; }
.cq-bene li::before {
	content: "\2713";
	position: absolute;
	left: 0;
	top: 1px;
	width: 18px;
	height: 18px;
	border-radius: 50%;
	background: var(--cq-green-tint);
	color: var(--cq-green-700);
	font-size: 10px;
	font-weight: 700;
	display: flex;
	align-items: center;
	justify-content: center;
}

/* Comparison table variant: centred check marks. */
.cq-ptable.cq-cmp td { text-align: center; }
.cq-ptable.cq-cmp td:first-child { text-align: left; }
.cq-ptable .yes { color: var(--cq-green-700); font-weight: 700; }
.cq-ptable .dash { color: var(--cq-ink-100); }

/* Framework-aligned report example card. */
.cq-report {
	background: #ffffff;
	border: 1px solid var(--cq-ink-50);
	border-radius: 14px;
	padding: 18px;
	box-shadow: 0 14px 32px -20px rgba(10, 37, 64, 0.35);
}
.cq-report > em {
	display: block;
	font-style: normal;
	font-size: 9.5px;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--cq-ink-300);
	margin-bottom: 3px;
}
.cq-report > b { display: block; font-size: 15px; color: var(--cq-ink); margin-bottom: 12px; }
.cq-report ul { list-style: none; margin: 0; padding: 0; }
.cq-report li {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 10px;
	font-size: 12.5px;
	color: var(--cq-ink);
	padding: 8px 0;
	border-top: 1px solid var(--cq-ink-50);
}
.cq-report .ok { background: var(--cq-green-tint); color: var(--cq-green-700); border-radius: 999px; padding: 2px 10px; font-size: 10px; font-weight: 600; white-space: nowrap; }
.cq-report .wip { background: #EAF2FE; color: #2563EB; border-radius: 999px; padding: 2px 10px; font-size: 10px; font-weight: 600; white-space: nowrap; }
.cq-report .todo { background: #F1F4F8; color: var(--cq-ink-300); border-radius: 999px; padding: 2px 10px; font-size: 10px; font-weight: 600; white-space: nowrap; }

/* Narrow-desktop reflow.
   Divi keeps two columns until 980px, so between ~981px and ~1180px a half
   column is only ~445px wide — too tight for the four-up grids and the
   five-node outputs row. Reflow them before they overflow. */
@media (max-width: 1180px) {
	.cq-ca-stats { grid-template-columns: repeat(2, 1fr); }
	.cq-mgrid { grid-template-columns: repeat(2, 1fr); }
	.cq-outputs .ar { display: none; }
	.cq-outputs { justify-content: flex-start; gap: 12px; }
	.cq-outputs .o { flex: 0 0 30%; }
	.cq-trace .res { flex: 0 0 112px; }
}
@media (max-width: 1180px) and (min-width: 981px) {
	.cq-flow5-step { flex: 1 1 96px; }
	.cq-scope3 { gap: 10px; }
	.cq-scope3 > div { padding: 14px; }
}
/* Long figures must never spill their card. */
.cq-ca-stat b,
.cq-trace .res b { overflow-wrap: anywhere; }
.cq-ca-app, .cq-mgrid, .cq-outputs, .cq-valid, .cq-scope3, .cq-trace { max-width: 100%; }
.cq-mgrid b, .cq-mgrid span, .cq-ffeat b, .cq-ffeat span, .cq-scope3 li { overflow-wrap: break-word; }
/* No page ever scrolls sideways. `clip` rather than `hidden`: hidden would
   make <body> a scroll container and break the sticky pillar nav on
   /ecosystem/. */
body { overflow-x: clip; }

/* Section eyebrow used inside two-column blocks */
.cq-eyebrow-sm {
	font-size: 10.5px !important;
	letter-spacing: 0.12em;
	font-weight: 600;
	color: var(--cq-green-700) !important;
	text-transform: uppercase;
}

/* ==========================================================================
   Carbon Accounting — calculation trace card (hero of earlier revision)
   ========================================================================== */
.cq-calc {
	max-width: 440px;
	margin: 0 auto;
	background: #ffffff;
	border: 1px solid var(--cq-ink-50);
	border-radius: 14px;
	padding: 20px;
	box-shadow: 0 18px 40px -22px rgba(10, 37, 64, 0.35), 0 2px 6px rgba(10, 37, 64, 0.04);
}
.cq-calc-eq {
	display: flex;
	align-items: stretch;
	gap: 8px;
}
.cq-calc-cell {
	flex: 1;
	border-radius: 10px;
	padding: 11px 8px;
	text-align: center;
	border: 1.5px solid var(--cq-ink-50);
	background: #ffffff;
}
.cq-calc-cell.a { border-color: rgba(59, 130, 246, 0.45); background: #EFF5FE; }
.cq-calc-cell.f { border-color: rgba(45, 191, 176, 0.5); background: #E9F8F5; }
.cq-calc-cell.r { border-color: var(--cq-green); background: var(--cq-green-tint); }
.cq-calc-cell em {
	display: block;
	font-style: normal;
	font-size: 9.5px;
	letter-spacing: 0.09em;
	text-transform: uppercase;
	color: var(--cq-ink-300);
}
.cq-calc-cell b { display: block; font-size: 15px; color: var(--cq-ink); margin-top: 3px; line-height: 1.2; }
.cq-calc-cell span { display: block; font-size: 10.5px; color: var(--cq-ink-500); margin-top: 2px; line-height: 1.35; }
.cq-calc-op {
	display: flex;
	align-items: center;
	font-size: 17px;
	font-weight: 600;
	color: var(--cq-ink-300);
}
.cq-calc-ev {
	margin-top: 16px;
	padding-top: 14px;
	border-top: 1px dashed var(--cq-ink-50);
}
.cq-calc-ev > b {
	display: block;
	font-size: 10.5px;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--cq-green-700);
	margin-bottom: 9px;
}
.cq-calc-ev ul { list-style: none; margin: 0; padding: 0; }
.cq-calc-ev li {
	position: relative;
	padding-left: 24px;
	font-size: 12px;
	color: var(--cq-ink-500);
	line-height: 1.45;
	margin-bottom: 7px;
}
.cq-calc-ev li:last-child { margin-bottom: 0; }
.cq-calc-ev li::before {
	content: "\2713";
	position: absolute;
	left: 0;
	top: 1px;
	width: 16px;
	height: 16px;
	border-radius: 50%;
	background: var(--cq-green-tint);
	color: var(--cq-green-700);
	font-size: 9px;
	font-weight: 700;
	display: flex;
	align-items: center;
	justify-content: center;
}
.cq-calc-cap {
	margin-top: 10px;
	font-size: 12px;
	color: var(--cq-ink-300);
	font-style: italic;
	text-align: center;
}

/* ==========================================================================
   Net Zero page — the reduction pathway (unique to this page)
   ========================================================================== */
.cq-path {
	max-width: 460px;
	margin: 0 auto;
	background: #ffffff;
	border: 1px solid var(--cq-ink-50);
	border-radius: 14px;
	padding: 18px 16px 12px;
	box-shadow: 0 18px 40px -22px rgba(10, 37, 64, 0.35), 0 2px 6px rgba(10, 37, 64, 0.04);
}
.cq-path svg { width: 100%; height: auto; display: block; }
.cq-path-cap {
	margin-top: 8px;
	font-size: 12px;
	color: var(--cq-ink-300);
	font-style: italic;
	text-align: center;
}

/* ==========================================================================
   Decarbonisation page — reduction ranked by source (unique to this page)
   ========================================================================== */
.cq-rank {
	max-width: 440px;
	margin: 0 auto;
	background: #ffffff;
	border: 1px solid var(--cq-ink-50);
	border-radius: 14px;
	padding: 20px;
	box-shadow: 0 18px 40px -22px rgba(10, 37, 64, 0.35), 0 2px 6px rgba(10, 37, 64, 0.04);
}
.cq-rank > b {
	display: block;
	font-size: 10.5px;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--cq-green-700);
	margin-bottom: 14px;
}
.cq-rank-row {
	display: flex;
	align-items: center;
	gap: 10px;
	margin-bottom: 13px;
}
.cq-rank-row:last-of-type { margin-bottom: 0; }
.cq-rank-row .nm {
	flex: 0 0 96px;
	font-size: 12.5px;
	font-weight: 600;
	color: var(--cq-ink);
	line-height: 1.25;
}
.cq-rank-row .track {
	flex: 1;
	height: 10px;
	background: #EDF1F6;
	border-radius: 5px;
	overflow: hidden;
}
.cq-rank-row .fill {
	display: block;
	height: 100%;
	border-radius: 5px;
	background: linear-gradient(90deg, var(--cq-green), var(--cq-teal));
}
.cq-rank-row .val {
	flex: 0 0 46px;
	text-align: right;
	font-size: 12px;
	font-weight: 600;
	color: var(--cq-green-700);
}
.cq-rank-cap {
	margin-top: 14px;
	padding-top: 12px;
	border-top: 1px dashed var(--cq-ink-50);
	font-size: 11.5px;
	color: var(--cq-ink-500);
	line-height: 1.5;
}

/* Framework chips: one source, many disclosures. */
.cq-fw {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	justify-content: center;
}
.cq-fw span {
	background: #ffffff;
	border: 1.5px solid var(--cq-ink-50);
	border-radius: 999px;
	padding: 9px 18px;
	font-size: 13px;
	font-weight: 600;
	color: var(--cq-ink);
	transition: border-color 0.2s ease, color 0.2s ease, transform 0.2s ease;
}
.cq-fw span:hover {
	border-color: var(--cq-green);
	color: var(--cq-green-700);
	transform: translateY(-2px);
}

/* Radial orbit map: modules circling the Climarq core (hero right column). */
/* The orbit is square, so its width sets the hero's height — keep it compact
   enough that the whole hero clears a laptop viewport. */
.cq-orbit {
	position: relative;
	width: 100%;
	max-width: 400px;
	aspect-ratio: 1 / 1;
	margin: 0 auto;
}
.cq-orbit::before {
	content: "";
	position: absolute;
	inset: 9%;
	border: 1.5px dashed var(--cq-ink-100);
	border-radius: 50%;
}
.cq-orb-core {
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	width: 44%;
	aspect-ratio: 1 / 1;
	border-radius: 50%;
	background: radial-gradient(circle at 42% 38%, #E6F7F1 0%, #D9F2E7 55%, #BFE8D9 100%);
	border: 1px solid rgba(31, 169, 113, 0.25);
	box-shadow: 0 22px 44px -18px rgba(31, 169, 113, 0.4);
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	text-align: center;
}
.cq-orb-core img { width: 40%; height: auto; margin-bottom: 5px; }
.cq-orb-core span { font-size: 10px; color: var(--cq-ink-500); line-height: 1.35; padding: 0 10%; }
/* connector lines from the core to every bubble */
.cq-orb-lines {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
}
.cq-orb-lines line { stroke: rgba(51, 84, 123, 0.22); stroke-width: 0.3; }
.cq-orb-n {
	position: absolute;
	display: flex;
	align-items: center;
	gap: 8px;
	text-decoration: none;
}
/* label OUTSIDE the bubble, side-aware; transforms land the bubble's centre
   exactly on the node coordinate */
.cq-orb-n.n-r { flex-direction: row;            transform: translate(-22px, -50%); }
.cq-orb-n.n-l { flex-direction: row-reverse;    transform: translate(calc(-100% + 22px), -50%); text-align: right; }
.cq-orb-n.n-t { flex-direction: column-reverse; transform: translate(-50%, calc(-100% + 22px)); text-align: center; }
.cq-orb-n.n-b { flex-direction: column;         transform: translate(-50%, -22px); text-align: center; }
.cq-orb-n em { max-width: 104px; }
.cq-orb-n .b {
	/* never let a long label squeeze the bubble into an oval */
	flex: 0 0 44px;
	align-self: center;
	width: 44px;
	height: 44px;
	min-width: 44px;
	min-height: 44px;
	box-sizing: border-box;
	border-radius: 50%;
	background: #ffffff;
	border: 1.5px solid var(--cq-ink-50);
	box-shadow: 0 6px 16px -8px rgba(10, 37, 64, 0.2);
	display: flex;
	align-items: center;
	justify-content: center;
	transition: 0.25s ease;
}
.cq-orb-n .b img { width: 20px; height: 20px; transition: filter 0.25s ease; }
.cq-orb-n em {
	font-style: normal;
	font-size: 11px;
	font-weight: 600;
	color: var(--cq-ink);
	line-height: 1.3;
	transition: color 0.2s ease;
}
.cq-orb-n:hover .b {
	background-image: linear-gradient(135deg, var(--cq-green), var(--cq-teal));
	border-color: transparent;
	transform: translateY(-3px);
	box-shadow: 0 14px 26px -10px rgba(31, 169, 113, 0.45);
}
.cq-orb-n:hover .b img { filter: brightness(0) invert(1); }
.cq-orb-n:hover em { color: var(--cq-green-700); }
.cq-annot {
	position: absolute;
	top: -2%;
	right: -4%;
	font-size: 12.5px;
	font-style: italic;
	color: var(--cq-ink-300);
	max-width: 120px;
	line-height: 1.45;
	text-align: left;
}
/* soft bottom fade so the photo wash hands over cleanly to the next section */
.cq-ecohero2.et_pb_section { position: relative; }
.cq-ecohero2.et_pb_section::after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	height: 90px;
	background: linear-gradient(180deg, rgba(255, 255, 255, 0), #ffffff);
	pointer-events: none;
}
.cq-ecohero2 .et_pb_row { position: relative; z-index: 2; }

/* Architecture layers: four capability cards with flow arrows. */
.cq-arch {
	display: grid;
	grid-template-columns: 1fr 22px 1fr 22px 1fr 22px 1fr;
	gap: 10px;
	align-items: stretch;
	margin-top: 8px;
}
.cq-arch-card {
	border-radius: 14px;
	padding: 20px 18px;
	border: 1px solid var(--cq-ink-50);
}
.cq-arch-card.l1 { background: #EFF9F4; }
.cq-arch-card.l2 { background: #EEF4FD; }
.cq-arch-card.l3 { background: #F0F9EF; }
.cq-arch-card.l4 { background: #F2F4F8; }
.cq-arch-card img { width: 26px; height: 26px; margin-bottom: 10px; }
.cq-arch-card b { display: block; font-size: 15px; color: var(--cq-ink); margin-bottom: 10px; }
.cq-arch-card ul { list-style: none; margin: 0; padding: 0; }
.cq-arch-card li {
	position: relative;
	padding-left: 18px;
	font-size: 12.5px;
	color: var(--cq-ink-500);
	margin-bottom: 6px;
	line-height: 1.4;
}
.cq-arch-card li::before {
	content: "";
	position: absolute;
	left: 0;
	top: 6px;
	width: 7px;
	height: 7px;
	border-radius: 50%;
	background: var(--cq-green);
	opacity: 0.75;
}
.cq-arch-arrow {
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--cq-ink-300);
	font-size: 17px;
}
@media (max-width: 980px) {
	.cq-arch { grid-template-columns: 1fr; }
	.cq-arch-arrow { transform: rotate(90deg); }
}

/* Modules directory grid. */
.cq-mods {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 14px;
	margin-top: 8px;
}
@media (max-width: 980px) { .cq-mods { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 640px) { .cq-mods { grid-template-columns: 1fr; } }
.cq-mod {
	position: relative;
	display: flex;
	gap: 12px;
	align-items: flex-start;
	background: #ffffff;
	border: 1px solid var(--cq-ink-50);
	border-radius: 12px;
	padding: 14px 15px;
	transition: transform 0.22s ease, box-shadow 0.22s ease, border-color 0.22s ease;
}
.cq-mod:hover {
	transform: translateY(-3px);
	box-shadow: 0 10px 24px rgba(10, 37, 64, 0.1);
	border-color: var(--cq-green-300, #7ED9B4);
}
.cq-mod .t {
	flex: 0 0 auto;
	width: 38px;
	height: 38px;
	border-radius: 9px;
	background: var(--cq-green-tint);
	display: flex;
	align-items: center;
	justify-content: center;
}
.cq-mod .t img { width: 20px; height: 20px; }
.cq-mod b { display: block; font-size: 13.5px; color: var(--cq-ink); line-height: 1.3; }
.cq-mod span { display: block; font-size: 11.5px; color: var(--cq-ink-500); line-height: 1.45; margin-top: 2px; }
/* NOTE: no "coming soon" badges anywhere on this site — unreleased modules are
   either described as available or left off the page entirely. */

/* Enterprise trust chips. */
.cq-trust {
	display: flex;
	gap: 14px;
	flex-wrap: wrap;
	justify-content: center;
	margin-top: 8px;
}
.cq-trust div {
	display: flex;
	gap: 10px;
	align-items: center;
	background: #ffffff;
	border: 1px solid var(--cq-ink-50);
	border-radius: 999px;
	padding: 10px 18px;
	font-size: 13px;
	font-weight: 600;
	color: var(--cq-ink);
}
.cq-trust img { width: 18px; height: 18px; }

/* Living map: gradient core + hoverable pillar nodes (hero right column). */
.cq-eco-map {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 18px;
}
.cq-eco-core {
	width: 165px;
	height: 165px;
	border-radius: 50%;
	flex: 0 0 auto;
	background: radial-gradient(circle at 42% 38%, #E6F7F1 0%, #9FE0C7 40%, #2DBFB0 72%, #2457B5 100%);
	color: #ffffff;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	text-align: center;
	box-shadow: 0 24px 48px -20px rgba(36, 87, 181, 0.55);
}
.cq-eco-core b { font-size: 16px; font-weight: 600; }
.cq-eco-core span { font-size: 10.5px; opacity: 0.9; }
.cq-eco-nodes { display: flex; flex-direction: column; gap: 12px; width: 250px; }
.cq-eco-node {
	display: block;
	background: #ffffff;
	border: 1.5px solid var(--cq-ink-50);
	border-left: 4px solid var(--cq-green);
	border-radius: 12px;
	padding: 12px 15px;
	text-decoration: none;
	overflow: hidden;
	transition: transform 0.25s ease, box-shadow 0.25s ease;
}
.cq-eco-node b { font-size: 14px; font-weight: 600; color: var(--cq-ink); display: block; }
.cq-eco-node i {
	display: block;
	font-style: normal;
	font-size: 11.5px;
	color: var(--cq-ink-500);
	line-height: 1.45;
	max-height: 0;
	opacity: 0;
	transition: 0.3s ease;
}
.cq-eco-node:hover {
	transform: translateX(6px);
	box-shadow: 0 12px 26px rgba(10, 37, 64, 0.12);
}
.cq-eco-node:hover i { max-height: 48px; opacity: 1; margin-top: 4px; }
.cq-eco-node:nth-child(2) { border-left-color: var(--cq-teal); }
.cq-eco-node:nth-child(3) { border-left-color: var(--cq-sky); }
.cq-eco-node:nth-child(4) { border-left-color: var(--cq-teal); }
.cq-eco-node:nth-child(5) { border-left-color: var(--cq-ink-300); }

/* One record, many views: record card -> animated flows -> outputs. */
.cq-rec {
	display: grid;
	grid-template-columns: 300px 1fr 300px;
	align-items: center;
	margin-top: 8px;
}
.cq-rec-card {
	background: #0F2A47;
	color: #ffffff;
	border-radius: 14px;
	padding: 18px;
	font-family: 'JetBrains Mono', Consolas, monospace;
	font-size: 12.5px;
	line-height: 1.9;
	box-shadow: 0 20px 40px -18px rgba(10, 37, 64, 0.5);
}
.cq-rec-card h5 {
	font-family: Poppins, sans-serif;
	font-size: 11px;
	letter-spacing: 1.5px;
	color: #3ED6A5;
	margin: 0 0 8px;
	padding: 0;
}
.cq-rec-card .k { color: #7B90AD; }
.cq-rec-card .v { color: #9FE0C7; }
.cq-rec-flows { display: flex; flex-direction: column; gap: 26px; padding: 0 8px; }
.cq-rec-fl {
	height: 2px;
	background-image: linear-gradient(90deg, var(--cq-green) 55%, transparent 45%);
	background-size: 14px 2px;
	position: relative;
	animation: cq-dashmove 1.2s linear infinite;
}
@keyframes cq-dashmove { to { background-position: 14px 0; } }
.cq-rec-fl::after {
	content: "";
	position: absolute;
	right: -1px;
	top: -4px;
	border: 5px solid transparent;
	border-left-color: var(--cq-green);
}
@media (prefers-reduced-motion: reduce) { .cq-rec-fl { animation: none; } }
.cq-rec-outs { display: flex; flex-direction: column; gap: 12px; }
.cq-rec-out {
	background: #ffffff;
	border: 1px solid var(--cq-ink-50);
	border-radius: 11px;
	padding: 11px 14px;
	font-size: 12.5px;
	transition: 0.2s ease;
}
.cq-rec-out b { display: block; font-size: 13px; color: var(--cq-ink); }
.cq-rec-out span { color: var(--cq-ink-500); }
.cq-rec-out:hover { border-color: var(--cq-green); transform: translateX(4px); }
@media (max-width: 980px) {
	.cq-rec { grid-template-columns: 1fr; gap: 18px; }
	.cq-rec-flows { display: none; }
}

/* Sticky section nav (anchors within the one page). */
.cq-pnav.et_pb_section {
	position: sticky;
	top: 0;
	z-index: 40;
	padding: 0 !important;
	border-bottom: 1px solid var(--cq-ink-50);
}
body.et_fixed_nav .cq-pnav.et_pb_section { top: 66px; }
.cq-pnav-row {
	display: flex;
	gap: 6px;
	overflow-x: auto;
	scrollbar-width: none;
}
.cq-pnav-row::-webkit-scrollbar { display: none; }
.cq-pnav-row a {
	padding: 13px 16px;
	font-size: 13px;
	font-weight: 600;
	color: var(--cq-ink-500) !important;
	text-decoration: none;
	border-bottom: 2.5px solid transparent;
	white-space: nowrap;
}
.cq-pnav-row a:hover { color: var(--cq-green-700) !important; border-bottom-color: var(--cq-green); }

/* Pillar deep-dives: anchored sections with an offset for the sticky navs. */
.cq-dive.et_pb_section { scroll-margin-top: 130px; }
.cq-dtag {
	display: inline-block;
	background: var(--cq-green-tint);
	color: var(--cq-green-700);
	border-radius: 999px;
	padding: 4px 12px;
	font-size: 12px;
	font-weight: 600;
	letter-spacing: 0.04em;
}
.cq-dviz {
	background: #ffffff;
	border: 1px solid var(--cq-ink-50);
	border-radius: 14px;
	padding: 22px;
	box-shadow: 0 10px 30px -16px rgba(10, 37, 64, 0.18);
	font-size: 12px;
	color: var(--cq-ink-500);
}
.cq-dviz b.t { font-size: 13px; color: var(--cq-ink); }
.cq-dviz .row { display: flex; gap: 10px; align-items: center; margin-top: 9px; }
.cq-dviz .bar { height: 12px; border-radius: 6px; background: linear-gradient(90deg, var(--cq-sky), var(--cq-teal)); }
.cq-dviz .chip {
	border: 1.5px solid var(--cq-ink-50);
	border-radius: 8px;
	padding: 6px 10px;
	font-weight: 600;
	font-size: 11.5px;
	color: var(--cq-ink);
}
.cq-dviz .down { height: 10px; border-radius: 5px; background: linear-gradient(90deg, var(--cq-green), var(--cq-teal)); }
.cq-dviz .note { color: var(--cq-ink-300); margin-top: 12px; }

/* Point tools vs ecosystem. */
.cq-vs-bad, .cq-vs-good { border-radius: 14px; padding: 24px 26px !important; }
.cq-vs-bad { background: #ffffff; border: 1px solid var(--cq-ink-50); }
.cq-vs-good { background: linear-gradient(160deg, #98D2B6 0%, #3F9488 52%, #123B54 100%); }
.cq-vs-bad ul, .cq-vs-good ul { list-style: none; padding: 0; margin: 0; }
.cq-vs-bad li, .cq-vs-good li {
	display: flex;
	gap: 10px;
	font-size: 13.5px;
	margin-bottom: 10px;
	line-height: 1.5;
}
.cq-vs-bad li { color: var(--cq-ink-500); }
.cq-vs-bad li::before { content: "\2715"; color: #C2554B; font-weight: 700; }
.cq-vs-good li { color: #EAF6F1; }
.cq-vs-good li::before { content: "\2713"; color: #9FE0C7; font-weight: 700; }

/* Ecosystem dropdown: a two-column panel of rows, each row a title with a
   one-line description underneath (see climarq_menu_item_descriptions()). */
#top-menu li.cq-mega { position: relative; }
#top-menu li.cq-mega > ul.sub-menu {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 2px 18px;
	width: 560px;
	padding: 18px 20px !important;
	border-radius: 0 0 14px 14px;
	border-top: 3px solid var(--cq-green);
	box-shadow: 0 24px 48px -18px rgba(10, 37, 64, 0.28);
	background: #ffffff;
	/* The nav is right-aligned in the header, so every panel opens leftwards
	   from its item — into the open space under the logo. Centring (or
	   left-anchoring) pushed the wider panels past the right edge. */
	left: auto !important;
	right: 0;
	transform: none;
	max-width: calc(100vw - 32px);
}
/* Short menus (Resources) get a single, narrower column. */
#top-menu li.cq-mega.cq-mega-narrow > ul.sub-menu {
	grid-template-columns: 1fr;
	width: 320px;
}
#top-menu li.cq-mega > ul.sub-menu li {
	margin: 0;
	padding: 0;
}
#top-menu li.cq-mega > ul.sub-menu li a {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	width: auto !important;
	padding: 10px 12px !important;
	border-radius: 10px;
	font-size: 14px !important;
	font-weight: 600;
	color: var(--cq-ink) !important;
	line-height: 1.3;
	opacity: 1 !important;
	transition: background-color 0.15s ease, color 0.15s ease;
}
#top-menu li.cq-mega .cq-mi-ic {
	flex: 0 0 auto;
	width: 30px;
	height: 30px;
	border-radius: 8px;
	background: var(--cq-green-tint);
	display: flex;
	align-items: center;
	justify-content: center;
	margin-top: 1px;
}
#top-menu li.cq-mega .cq-mi-ic img { width: 16px; height: 16px; }
#top-menu li.cq-mega .cq-mi-tx { flex: 1; }
#top-menu li.cq-mega > ul.sub-menu li a .cq-mi-desc {
	display: block;
	font-size: 11.5px;
	font-weight: 400;
	color: var(--cq-ink-300);
	margin-top: 2px;
	line-height: 1.45;
}
#top-menu li.cq-mega > ul.sub-menu li a:hover {
	background-color: var(--cq-green-tint) !important;
	color: var(--cq-green-700) !important;
}

/* Buttons — 14px, fixed size, themed hover.
   Divi's base gives buttons asymmetric padding (padding-right:2em to reserve
   the hover arrow), its :hover grows that padding, and transition-property:all
   animates the change — that is the resize/flicker. We pin symmetric padding
   IDENTICALLY on both states, kill the arrow (::after), and constrain the
   transition to colour only. ID scope (#page-container) + !important guarantees
   we win over Divi's inline customizer rules, none of which use an ID. */
body #page-container .et_pb_button,
body #page-container .et_pb_module .et_pb_button,
body #page-container .et_pb_button:hover,
body #page-container .et_pb_module .et_pb_button:hover {
	font-size: 14px !important;
	line-height: 1.4 !important;
	padding: 12px 26px !important;
	border-radius: 8px !important;
	font-weight: 500 !important;
	transition-property: background-color, background-image, color, border-color !important;
	transition-duration: 0.25s !important;
}
/* Kill Divi's ETmodules-font hover arrow — except on the iconed buttons
   (cq-btn-*), whose own masked arrow ::after must survive hover. */
body #page-container .et_pb_button:not(.cq-btn-explore):not(.cq-btn-talk):not(.cq-btn-learn):not(.cq-btn-hub)::after,
body #page-container .et_pb_button:not(.cq-btn-explore):not(.cq-btn-talk):not(.cq-btn-learn):not(.cq-btn-hub):hover::after,
body #page-container .et_pb_module .et_pb_button:not(.cq-btn-explore):not(.cq-btn-talk):not(.cq-btn-learn):not(.cq-btn-hub)::after,
body #page-container .et_pb_module .et_pb_button:not(.cq-btn-explore):not(.cq-btn-talk):not(.cq-btn-learn):not(.cq-btn-hub):hover::after {
	display: none !important;
}
/* Themed hover: green → teal gradient, white text (applies to solid and ghost;
   the ghost's 2px border turns transparent so its size never changes). */
body #page-container .et_pb_button:hover,
body #page-container .et_pb_module .et_pb_button:hover {
	background-color: var(--cq-green-600) !important;
	background-image: linear-gradient(90deg, var(--cq-green), var(--cq-teal)) !important;
	color: #ffffff !important;
	border-color: transparent !important;
}

/* Button icons: compass (explore), chat bubble (talk to us), arrow (learn
   more), book (knowledge hub) — always visible on the left, and drawn in the
   button's own text colour via a mask + currentColor, so they flip white/ink
   automatically with the label on hover. */
body #page-container .cq-btn-explore.et_pb_button,
body #page-container .cq-btn-talk.et_pb_button,
body #page-container .cq-btn-learn.et_pb_button,
body #page-container .cq-btn-hub.et_pb_button {
	display: inline-flex !important;
	align-items: center;
	justify-content: center;
	gap: 9px;
}
body #page-container .cq-btn-explore.et_pb_button::before,
body #page-container .cq-btn-talk.et_pb_button::before,
body #page-container .cq-btn-learn.et_pb_button::before,
body #page-container .cq-btn-hub.et_pb_button::before {
	content: "";
	width: 17px;
	height: 17px;
	flex: 0 0 auto;
	background-color: currentColor;
	-webkit-mask-position: center;
	        mask-position: center;
	-webkit-mask-size: contain;
	        mask-size: contain;
	-webkit-mask-repeat: no-repeat;
	        mask-repeat: no-repeat;
}
body #page-container .cq-btn-explore.et_pb_button::before {
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpolygon points='15.6 8.4 13 13 8.4 15.6 11 11'/%3E%3C/svg%3E");
	        mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpolygon points='15.6 8.4 13 13 8.4 15.6 11 11'/%3E%3C/svg%3E");
}
/* Telecaller headset (headband, ear cups, mic boom) — "talk to a person". */
body #page-container .cq-btn-talk.et_pb_button::before {
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 14v-2a8 8 0 0 1 16 0v2'/%3E%3Crect x='2.5' y='13' width='4.2' height='6.4' rx='1.8'/%3E%3Crect x='17.3' y='13' width='4.2' height='6.4' rx='1.8'/%3E%3Cpath d='M19.4 19.4v.6a2.6 2.6 0 0 1-2.6 2.6H13'/%3E%3C/svg%3E");
	        mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 14v-2a8 8 0 0 1 16 0v2'/%3E%3Crect x='2.5' y='13' width='4.2' height='6.4' rx='1.8'/%3E%3Crect x='17.3' y='13' width='4.2' height='6.4' rx='1.8'/%3E%3Cpath d='M19.4 19.4v.6a2.6 2.6 0 0 1-2.6 2.6H13'/%3E%3C/svg%3E");
}
body #page-container .cq-btn-learn.et_pb_button::before {
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M8 12h7M12 8.5 15.5 12 12 15.5'/%3E%3C/svg%3E");
	        mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M8 12h7M12 8.5 15.5 12 12 15.5'/%3E%3C/svg%3E");
}
body #page-container .cq-btn-hub.et_pb_button::before {
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2 4h6a4 4 0 0 1 4 4v12a3 3 0 0 0-3-3H2z'/%3E%3Cpath d='M22 4h-6a4 4 0 0 0-4 4v12a3 3 0 0 1 3-3h7z'/%3E%3C/svg%3E");
	        mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2 4h6a4 4 0 0 1 4 4v12a3 3 0 0 0-3-3H2z'/%3E%3Cpath d='M22 4h-6a4 4 0 0 0-4 4v12a3 3 0 0 1 3-3h7z'/%3E%3C/svg%3E");
}
/* Right-side arrow on every iconed button: [icon] Label [->]. Must out-rank
   the blanket ::after suppression above (it does: extra class = higher
   specificity), and the arrow slides right slightly on hover. */
body #page-container .cq-btn-explore.et_pb_button::after,
body #page-container .cq-btn-talk.et_pb_button::after,
body #page-container .cq-btn-learn.et_pb_button::after,
body #page-container .cq-btn-hub.et_pb_button::after {
	content: "" !important;
	display: block !important;
	position: static !important;
	margin: 0 !important;
	opacity: 1 !important;
	width: 15px;
	height: 15px;
	flex: 0 0 auto;
	background-color: currentColor;
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 12h15M13 5.5 19.5 12 13 18.5'/%3E%3C/svg%3E");
	        mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 12h15M13 5.5 19.5 12 13 18.5'/%3E%3C/svg%3E");
	-webkit-mask-position: center;
	        mask-position: center;
	-webkit-mask-size: contain;
	        mask-size: contain;
	-webkit-mask-repeat: no-repeat;
	        mask-repeat: no-repeat;
	transition: transform 0.25s ease;
}
body #page-container .cq-btn-explore.et_pb_button:hover::after,
body #page-container .cq-btn-talk.et_pb_button:hover::after,
body #page-container .cq-btn-learn.et_pb_button:hover::after,
body #page-container .cq-btn-hub.et_pb_button:hover::after {
	transform: translateX(3px);
}

/* Ghost-button hover (Talk to us, Learn more): a clean solid ink fill —
   distinct from the primary's gradient, white label, size unchanged. */
body #page-container .cq-btn-talk.et_pb_button:hover,
body #page-container .cq-btn-learn.et_pb_button:hover {
	background-color: var(--cq-ink) !important;
	background-image: none !important;
	color: #ffffff !important;
	border-color: var(--cq-ink) !important;
}
/* …except on the dark band, where an ink fill would vanish into the
   background: there the Talk button hovers to white with ink text. */
body #page-container .cq-band .cq-btn-talk.et_pb_button:hover {
	background-color: #ffffff !important;
	background-image: none !important;
	color: var(--cq-ink) !important;
	border-color: #ffffff !important;
}

/* WHY CLIMARQ (section 3): soft brand-gradient backdrop so the band reads
   distinct from the white hero above and white ecosystem section below. */
.cq-why {
	background-image: linear-gradient(135deg, #F1FAF6 0%, #EDF4FB 100%);
}
/* Vertical list: one item per row — icon tile left, title + small justified
   copy right, a brand accent bar on the left edge (Green -> Teal -> Sky), and
   hover animation: the row slides right and lifts, the icon tile flips to the
   green->teal gradient with the icon going white. */
/* Compact: the whole 4-item list should sit within the left column's height —
   tight padding, small gaps, no dead air between title and copy. */
.cq-why.et_pb_section {
	padding: 48px 0 !important;
}

/* Blog feed: no Divi hover overlay (+ icon / washed image) — a quiet zoom
   instead; and no pagination inside the module (the section CTA covers it). */
.cq-blogfeed .et_overlay { display: none !important; }
.cq-blogfeed .entry-featured-image-url {
	display: block;
	overflow: hidden;
	border-radius: 12px 12px 0 0;
	margin: 0 !important;
	text-align: left;
}
/* The banner must always fit the box exactly: kill Divi's attribute sizing,
   centring and any fixed dimensions — the file is authored at the box ratio. */
.cq-blogfeed .et_pb_post .entry-featured-image-url img {
	width: 100% !important;
	max-width: 100% !important;
	height: auto !important;
	margin: 0 !important;
	display: block !important;
	transition: transform 0.35s ease;
}
.cq-blogfeed article:hover .entry-featured-image-url img { transform: scale(1.04); }
.cq-blogfeed .pagination, .cq-blogfeed .wp-pagenavi { display: none !important; }
/* Equal card boxes: fixed image ratio + clamped title/excerpt lines means all
   three cards land at the same height. */
.cq-blogfeed .et_pb_post {
	background: #ffffff;
	border: 1px solid var(--cq-ink-50);
	border-radius: 12px;
	overflow: hidden;
	padding: 0 !important;
	box-shadow: 0 1px 2px rgba(10, 37, 64, 0.04);
	transition: transform 0.25s ease, box-shadow 0.25s ease;
}
.cq-blogfeed .et_pb_post:hover {
	transform: translateY(-3px);
	box-shadow: 0 12px 26px rgba(10, 37, 64, 0.10);
}
.cq-blogfeed .et_pb_post .entry-title,
.cq-blogfeed .et_pb_post .post-meta,
.cq-blogfeed .et_pb_post .post-content {
	padding: 0 20px;
}
/* Meta line: muted date, category in a green highlight — two clearly
   different treatments; one-line height so all cards stay level. */
.cq-blogfeed .et_pb_post .post-meta {
	color: var(--cq-ink-300);
	font-size: 12.5px;
	margin: 6px 0 8px;
	min-height: 1.6em;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
.cq-blogfeed .et_pb_post .post-meta a {
	color: var(--cq-green-700) !important;
	background: var(--cq-green-tint);
	border-radius: 999px;
	padding: 2px 9px;
	font-weight: 600;
	font-size: 11.5px;
}
/* No stray gap under the row: the module's grid articles carry a bottom
   margin that leaves an empty strip. */
.cq-blogfeed .et_pb_post {
	margin-bottom: 0 !important;
}
.cq-blogfeed .et_pb_post .entry-title {
	margin-top: 16px;
	font-size: 17px !important;
	line-height: 1.35 !important;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	min-height: 2.7em;
}
.cq-blogfeed .et_pb_post .post-content p {
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
	min-height: 4.65em;
	font-size: 13.5px;
	line-height: 1.55;
	margin-bottom: 8px;
}
.cq-blogfeed .et_pb_post .post-content {
	padding-bottom: 18px;
}
/* "read more" as a branded action: green, book icon left, arrow feel. */
.cq-blogfeed .more-link {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	color: var(--cq-sky, #3B82F6) !important;
	font-weight: 600;
	font-size: 13px;
	text-transform: none;
	transition: color 0.2s ease, transform 0.2s ease;
}
.cq-blogfeed .more-link::before {
	content: "";
	width: 14px;
	height: 14px;
	flex: 0 0 auto;
	background-color: currentColor;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2 4h6a4 4 0 0 1 4 4v12a3 3 0 0 0-3-3H2z'/%3E%3Cpath d='M22 4h-6a4 4 0 0 0-4 4v12a3 3 0 0 1 3-3h7z'/%3E%3C/svg%3E") center / contain no-repeat;
	        mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2 4h6a4 4 0 0 1 4 4v12a3 3 0 0 0-3-3H2z'/%3E%3Cpath d='M22 4h-6a4 4 0 0 0-4 4v12a3 3 0 0 1 3-3h7z'/%3E%3C/svg%3E") center / contain no-repeat;
}
.cq-blogfeed .more-link:hover {
	color: #2563EB !important;
	transform: translateX(2px);
}

/* Our Mission pillars: quiet icon-left rows, no card chrome. */
.cq-mission .et_pb_blurb.cq-mis {
	background: none;
	border: none;
	box-shadow: none;
	padding: 8px 10px !important;
}
.cq-mission .cq-mis .et_pb_blurb_content { display: flex; align-items: flex-start; }
.cq-mission .cq-mis .et_pb_main_blurb_image {
	width: auto;
	margin: 2px 12px 0 0;
	line-height: 0;
}
.cq-mission .cq-mis .et_pb_main_blurb_image .et_pb_image_wrap {
	background: var(--cq-green-tint);
	border-radius: 9px;
	padding: 8px;
	display: inline-block;
}
.cq-mission .cq-mis .et_pb_main_blurb_image img { width: 20px; height: 20px; display: block; }
.cq-mission .cq-mis .et_pb_blurb_container { flex: 1; text-align: left; }
.cq-mission .cq-mis .et_pb_module_header { margin-bottom: 2px; padding-bottom: 0 !important; }
.cq-mission .cq-mis .et_pb_blurb_description p { margin-bottom: 0; }
.cq-why .et_pb_blurb.cq-why-item {
	background: #ffffff;
	border: 1px solid rgba(10, 37, 64, 0.07);
	border-left: 3px solid var(--cq-green);
	border-radius: 12px;
	padding: 12px 16px !important;
	margin-bottom: 9px !important;
	transition: transform 0.25s ease, box-shadow 0.25s ease;
}
.cq-why .et_pb_blurb.cq-why-item:last-child {
	margin-bottom: 0 !important;
}
.cq-why .et_pb_blurb.cq-why-item:nth-child(3n+2) { border-left-color: var(--cq-teal); }
.cq-why .et_pb_blurb.cq-why-item:nth-child(3n)   { border-left-color: var(--cq-sky); }
.cq-why .et_pb_blurb.cq-why-item:hover {
	transform: translateX(8px);
	box-shadow: 0 10px 24px rgba(10, 37, 64, 0.10);
}
.cq-why .cq-why-item .et_pb_blurb_content {
	display: flex;
	align-items: flex-start;
}
.cq-why .cq-why-item .et_pb_main_blurb_image {
	width: auto;
	margin: 2px 16px 0 0;
	line-height: 0;
}
.cq-why .cq-why-item .et_pb_main_blurb_image .et_pb_image_wrap {
	background: var(--cq-green-tint);
	border-radius: 10px;
	padding: 9px;
	display: inline-block;
	transition: background-color 0.25s ease, background-image 0.25s ease;
}
.cq-why .cq-why-item .et_pb_main_blurb_image img {
	width: 22px;
	height: 22px;
	display: block;
	transition: filter 0.25s ease;
}
.cq-why .cq-why-item:hover .et_pb_main_blurb_image .et_pb_image_wrap {
	background-image: linear-gradient(135deg, var(--cq-green), var(--cq-teal));
}
.cq-why .cq-why-item:hover .et_pb_main_blurb_image img {
	filter: brightness(0) invert(1);
}
.cq-why .cq-why-item .et_pb_blurb_container {
	flex: 1;
	text-align: left;
}
.cq-why .cq-why-item .et_pb_module_header {
	margin-bottom: 2px;
	padding-bottom: 0 !important;
}
.cq-why .cq-why-item .et_pb_blurb_description {
	text-align: justify;
	line-height: 1.55em;
}
.cq-why .cq-why-item .et_pb_blurb_description p {
	margin-bottom: 0;
	padding-bottom: 0;
}

/* Live canvas hero: the rotating particle globe replaces the static orb SVG.
   The SVG remains the no-JS / reduced-motion fallback (CSS background); JS adds
   .is-live once the canvas is drawing. */
.cq-hero-live {
	position: relative;
	width: 100%;
	max-width: 640px;
	margin: 0 auto;
	aspect-ratio: 640 / 560;
	background: url("assets/img/previews/climarq-hero-orb.svg") center / contain no-repeat;
}
.cq-hero-live.is-live {
	background: none;
}
.cq-hero-live canvas {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	display: block;
}
.cq-hero-live > img {
	width: 100%;
	display: block;
}
.cq-hero-live.is-live > img {
	display: none;
}

/* Hero qualitative badges — three inline icon items inside the hero left
   column, just under the CTA buttons (not a separate section). */
/* Four-up variant (carbon accounting hero). */
.et_pb_blurb.cq-qual4 { width: 23% !important; margin-right: 2% !important; }
.et_pb_blurb.cq-qual4:last-of-type { margin-right: 0 !important; }
@media (max-width: 620px) {
	.et_pb_blurb.cq-qual4 { width: 48% !important; margin-bottom: 12px !important; }
}
.et_pb_blurb.cq-qual {
	display: inline-block;
	width: 31%;
	vertical-align: top;
	background: none;
	border: none;
	box-shadow: none;
	padding: 0 !important;
	margin: 0 2% 0 0 !important;
	text-align: left;
}
.et_pb_blurb.cq-qual .et_pb_main_blurb_image {
	margin-bottom: 8px;
	text-align: left;
}
.et_pb_blurb.cq-qual .et_pb_main_blurb_image img {
	width: 26px !important;
	height: 26px !important;
}
.et_pb_blurb.cq-qual .et_pb_module_header {
	font-size: 13px !important;
	margin-bottom: 2px;
	line-height: 1.3;
}
.et_pb_blurb.cq-qual .et_pb_blurb_description {
	font-size: 12px;
	line-height: 1.4;
}

/* Journey rows: vertically centred columns, arrow links. */
@media (min-width: 981px) {
	.et_pb_row.cq-journey {
		display: flex;
		align-items: center;
	}
	.et_pb_row.cq-journey::after {
		display: none;
	}
}
.cq-journey .cq-journey-link a {
	font-weight: 500;
	color: var(--cq-green-700);
	text-decoration: none;
	border-bottom: 1.5px solid var(--cq-green-300);
	padding-bottom: 1px;
}
.cq-journey .cq-journey-link a:hover {
	color: var(--cq-green);
}

/* Product preview window (cq-shot): the dashboard reads as a real app window —
   rounded, layered drop shadow, hairline border — floating over a soft brand
   glow instead of bare white space; gentle lift on hover. */
.cq-shot {
	position: relative;
}
.cq-shot::before {
	content: "";
	position: absolute;
	inset: -10% -8%;
	background: radial-gradient(58% 58% at 50% 46%, rgba(31, 169, 113, 0.13) 0%, rgba(59, 130, 246, 0.08) 58%, rgba(59, 130, 246, 0) 78%);
	pointer-events: none;
}
.cq-shot .et_pb_image_wrap {
	position: relative;
	border-radius: 14px;
	overflow: hidden;
	border: 1px solid rgba(10, 37, 64, 0.09);
	box-shadow:
		0 24px 48px -18px rgba(10, 37, 64, 0.30),
		0 4px 12px rgba(10, 37, 64, 0.08);
	transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.cq-shot:hover .et_pb_image_wrap {
	transform: translateY(-5px);
	box-shadow:
		0 32px 60px -18px rgba(10, 37, 64, 0.34),
		0 6px 16px rgba(10, 37, 64, 0.10);
}
.cq-shot img {
	display: block;
	width: 100%;
}

/* Paired CTAs sit side by side (wrapping to stacked on narrow screens).
   NOTE: Divi applies a button module's custom class to the <a>, not the
   wrapper — hence the :has() parent selector. */
.et_pb_button_module_wrapper:has( > .cq-btn-inline) {
	display: inline-block;
	margin-right: 14px;
	margin-bottom: 0;
}
.et_pb_button_module_wrapper:has( > .cq-btn-inline) + .et_pb_button_module_wrapper:has( > .cq-btn-inline) {
	margin-right: 0;
}
/* Centered pairs (CTA bands) keep their centring via the parent text-align. */
.cq-btn-center {
	text-align: center;
}

/* Column gutters collapse on phone stacking — restore breathing room. */
@media (max-width: 980px) {
	.cq-cards .et_pb_column {
		margin-bottom: 16px;
	}
}

/* Accent-bar cards (pillars, capabilities): a 3px brand bar across the top,
   cycling Green -> Teal -> Sky so rows read as a set, not repetition. */
.cq-accent .et_pb_blurb {
	border-top: 3px solid var(--cq-green);
	border-radius: 0 0 12px 12px;
}
.cq-accent .et_pb_column:nth-child(3n+2) .et_pb_blurb { border-top-color: var(--cq-teal); }
.cq-accent .et_pb_column:nth-child(3n)   .et_pb_blurb { border-top-color: var(--cq-sky); }

/* Numbered steps (How it works): circular badge + connecting line. Titles in
   the markup are just the verb; the badge number is generated here. */
.cq-steps {
	counter-reset: cq-step;
}
.cq-steps .et_pb_blurb {
	position: relative;
	padding-top: 58px !important;
	text-align: center;
}
.cq-steps .et_pb_blurb::before {
	counter-increment: cq-step;
	content: counter(cq-step);
	position: absolute;
	top: 18px;
	left: 50%;
	transform: translateX(-50%);
	width: 30px;
	height: 30px;
	border-radius: 50%;
	background: var(--cq-green-tint);
	color: var(--cq-green-700);
	border: 1.5px solid var(--cq-green);
	font-weight: 600;
	font-size: 14px;
	line-height: 27px;
	text-align: center;
}
.cq-steps .et_pb_blurb .et_pb_module_header,
.cq-steps .et_pb_blurb .et_pb_blurb_description {
	text-align: center;
}

/* Blog cards: consistent card frame around Divi's grid articles. */
.cq-blogfeed .et_pb_post {
	border: 1px solid var(--cq-ink-50);
	border-radius: 12px;
	overflow: hidden;
	padding: 0 0 18px;
	box-shadow: 0 1px 2px rgba(10, 37, 64, 0.04);
}
.cq-blogfeed .et_pb_post .entry-title,
.cq-blogfeed .et_pb_post .post-meta,
.cq-blogfeed .et_pb_post .post-content {
	padding-left: 20px;
	padding-right: 20px;
}
.cq-blogfeed .et_pb_post .entry-title {
	margin-top: 16px;
}

/* ==========================================================================
   Footer refinement
   --------------------------------------------------------------------------
   Quieter, tighter: label-style column headings, no list bullets, regular-
   weight links and body text, less vertical bulk.
   ========================================================================== */

#main-footer #footer-widgets {
	padding: 52px 0 34px;
}

/* Footer container matches the page sections (94% / 1220px) instead of Divi's
   narrower default, and the four columns sit on a balanced grid: a wider brand
   column, three equal menu columns. */
#main-footer .container,
#footer-bottom .container {
	width: 94% !important;
	max-width: 1220px !important;
}
@media (min-width: 981px) {
	/* Divi nests #footer-widgets INSIDE .container — the grid goes on it
	   directly. Grid ignores the children's floats, so Divi's own column
	   widths stop mattering. */
	#main-footer #footer-widgets {
		display: grid;
		grid-template-columns: 1.6fr 1fr 1fr 1fr;
		gap: 48px;
	}
	#main-footer #footer-widgets .footer-widget {
		width: auto !important;
		max-width: none !important;
		margin: 0 !important;
		float: none !important;
	}
}
/* Brand column: no stacked paragraph margins — logo, tagline, product line
   and socials sit tight. */
#footer-widgets .footer-widget .textwidget p {
	margin: 0 0 4px !important;
	padding: 0 !important;
}
#footer-widgets .footer-widget .textwidget p img {
	margin-bottom: 6px !important;
}
#footer-widgets .cq-foot-tag {
	margin-bottom: 1px !important;
}
.cq-foot-tag {
	font-weight: 500;
	color: #E6EAF0 !important;
	margin-bottom: 2px !important;
}
.cq-foot-org {
	font-size: 13px !important;
	font-style: italic;
	color: var(--cq-ink-300) !important;
}
/* The company name carries the credit; the "A … product" framing stays
   quiet around it. Upright, so it reads as a name rather than emphasis. */
.cq-foot-org strong {
	font-style: normal;
	font-weight: 600;
	color: var(--cq-ink-100);
}
/* Social icons: masked glyphs, muted -> brand green on hover. */
.cq-soc {
	display: flex;
	gap: 12px;
	margin-top: 16px;
}
.cq-soc a {
	width: 34px;
	height: 34px;
	border-radius: 50%;
	border: 1.5px solid rgba(255, 255, 255, 0.22);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	transition: border-color 0.2s ease, background-color 0.2s ease;
}
.cq-soc a::before {
	content: "";
	width: 15px;
	height: 15px;
	background-color: #C7D2DF;
	-webkit-mask-position: center;
	        mask-position: center;
	-webkit-mask-size: contain;
	        mask-size: contain;
	-webkit-mask-repeat: no-repeat;
	        mask-repeat: no-repeat;
	transition: background-color 0.2s ease;
}
.cq-soc a:hover {
	border-color: var(--cq-green);
	background-color: rgba(31, 169, 113, 0.14);
}
.cq-soc a:hover::before {
	background-color: var(--cq-green-300, #7ED9B4);
}
.cq-soc-li::before {
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23000'%3E%3Cpath d='M4.98 3.5C4.98 4.88 3.87 6 2.5 6S0 4.88 0 3.5 1.12 1 2.5 1s2.48 1.12 2.48 2.5zM.24 8.31h4.52V23H.24zM8.34 8.31h4.33v2h.06c.6-1.14 2.07-2.34 4.27-2.34 4.57 0 5.41 3 5.41 6.91V23h-4.52v-7.13c0-1.7-.03-3.89-2.37-3.89-2.37 0-2.73 1.85-2.73 3.76V23H8.34z'/%3E%3C/svg%3E");
	        mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23000'%3E%3Cpath d='M4.98 3.5C4.98 4.88 3.87 6 2.5 6S0 4.88 0 3.5 1.12 1 2.5 1s2.48 1.12 2.48 2.5zM.24 8.31h4.52V23H.24zM8.34 8.31h4.33v2h.06c.6-1.14 2.07-2.34 4.27-2.34 4.57 0 5.41 3 5.41 6.91V23h-4.52v-7.13c0-1.7-.03-3.89-2.37-3.89-2.37 0-2.73 1.85-2.73 3.76V23H8.34z'/%3E%3C/svg%3E");
}
.cq-soc-x::before {
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23000'%3E%3Cpath d='M18.9 1.15h3.68l-8.04 9.19L24 22.85h-7.41l-5.8-7.58-6.64 7.58H.47l8.6-9.83L0 1.15h7.59l5.24 6.93zm-1.29 19.5h2.04L6.49 3.24H4.3z'/%3E%3C/svg%3E");
	        mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23000'%3E%3Cpath d='M18.9 1.15h3.68l-8.04 9.19L24 22.85h-7.41l-5.8-7.58-6.64 7.58H.47l8.6-9.83L0 1.15h7.59l5.24 6.93zm-1.29 19.5h2.04L6.49 3.24H4.3z'/%3E%3C/svg%3E");
}
.cq-soc-yt::before {
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23000'%3E%3Cpath d='M23.5 6.19a3.02 3.02 0 0 0-2.12-2.14C19.5 3.55 12 3.55 12 3.55s-7.5 0-9.38.5A3.02 3.02 0 0 0 .5 6.19 31.6 31.6 0 0 0 0 12a31.6 31.6 0 0 0 .5 5.81 3.02 3.02 0 0 0 2.12 2.14c1.88.5 9.38.5 9.38.5s7.5 0 9.38-.5a3.02 3.02 0 0 0 2.12-2.14A31.6 31.6 0 0 0 24 12a31.6 31.6 0 0 0-.5-5.81zM9.55 15.57V8.43L15.82 12z'/%3E%3C/svg%3E");
	        mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23000'%3E%3Cpath d='M23.5 6.19a3.02 3.02 0 0 0-2.12-2.14C19.5 3.55 12 3.55 12 3.55s-7.5 0-9.38.5A3.02 3.02 0 0 0 .5 6.19 31.6 31.6 0 0 0 0 12a31.6 31.6 0 0 0 .5 5.81 3.02 3.02 0 0 0 2.12 2.14c1.88.5 9.38.5 9.38.5s7.5 0 9.38-.5a3.02 3.02 0 0 0 2.12-2.14A31.6 31.6 0 0 0 24 12a31.6 31.6 0 0 0-.5-5.81zM9.55 15.57V8.43L15.82 12z'/%3E%3C/svg%3E");
}

#footer-widgets .footer-widget h4.title {
	font-size: 12px;
	font-weight: 500;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--cq-green-300);
	margin-bottom: 14px;
}

#footer-widgets .footer-widget .textwidget p {
	color: var(--cq-ink-100);
	font-weight: 400;
	font-size: 14px;
	line-height: 1.7;
	max-width: 34ch;
}

#footer-widgets .footer-widget li:before {
	display: none;               /* no bullet dots */
}
#footer-widgets .footer-widget li {
	padding-left: 0 !important;
	margin-bottom: 4px;
}
#footer-widgets .footer-widget li a {
	color: var(--cq-ink-100) !important;
	font-weight: 400;
	font-size: 14px;
}
#footer-widgets .footer-widget li a:hover {
	color: #ffffff !important;
}

#footer-bottom {
	padding: 18px 0;
}
#footer-bottom #footer-info {
	font-size: 12.5px;
	color: var(--cq-ink-300);
}

/* ==========================================================================
   CONTACT PAGE
   Two halves that read as one: the invitation on the left, the form on the
   right, with a photographic arc bleeding off the right edge behind both.
   ========================================================================== */

/* z-index:0 is load-bearing: it makes the section a stacking context so the
   arc's negative z-index stays inside it. Without it the arc escapes to the
   root and paints behind #main-content's white background — invisible. */
.cq-contact.et_pb_section {
	position: relative;
	overflow: hidden;
	z-index: 0;
}
.cq-contact .et_pb_row {
	padding-top: 8px !important;
	padding-bottom: 0 !important;
}
/* Divi makes rows, columns and modules positioning contexts, so a decorative
   layer inside one resolves against that module rather than the section. These
   are flattened so the arc can bleed off the section's own right edge; the arc
   and its caption are excluded because they are the positioned layers. */
.cq-contact .et_pb_row,
.cq-contact .et_pb_column,
.cq-contact .et_pb_module:not(.cq-contact-arc):not(.cq-contact-tag),
.cq-contact .et_pb_text_inner {
	position: static !important;
}

/* z-index below the flow keeps the arc behind the copy while still painting
   over the section's own background. */
.cq-contact-arc.et_pb_module {
	position: absolute !important;
	top: -70px;
	right: -210px;
	width: 760px;
	height: 760px;
	margin: 0 !important;
	z-index: -1;
	border-radius: 50%;
	overflow: hidden;
	pointer-events: none;
}
.cq-contact-arc .et_pb_image_wrap,
.cq-contact-arc img {
	display: block;
	width: 760px !important;
	height: 760px !important;
	max-width: none !important;
	object-fit: cover;
	border-radius: 50%;
}
.cq-contact-arc::after {
	/* Fades the photo out toward the copy so the form card stays readable. */
	content: "";
	position: absolute;
	inset: 0;
	border-radius: 50%;
	background: linear-gradient(115deg, rgba(246, 251, 249, 0.94) 0%, rgba(246, 251, 249, 0.55) 38%, rgba(246, 251, 249, 0.05) 66%);
}
.cq-contact-tag.et_pb_module {
	position: absolute !important;
	top: 44px;
	right: 16px;
	width: 132px;
	margin: 0 !important;
	z-index: 3;
}
.cq-contact-tag p {
	font-size: 12px !important;
	letter-spacing: 2.4px;
	line-height: 1.85 !important;
	font-weight: 500;
	color: var(--cq-ink) !important;
	text-transform: uppercase;
	margin: 0;
	padding: 0 !important;
}
.cq-contact-tag::before {
	content: "";
	display: block;
	width: 62px;
	height: 2px;
	background: var(--cq-green);
	margin-bottom: 12px;
}

/* --- left column ------------------------------------------------------- */

.cq-cstep-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 26px;
}
.cq-cstep .ic {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 52px;
	height: 52px;
	border-radius: 50%;
	background: var(--cq-green-tint);
	margin-bottom: 14px;
}
.cq-cstep .ic img {
	width: 24px;
	height: 24px;
	display: block;
}
.cq-cstep b {
	display: block;
	font-size: 15px;
	font-weight: 600;
	color: var(--cq-ink);
	line-height: 1.35;
	margin-bottom: 7px;
}
.cq-cstep p {
	font-size: 13px;
	line-height: 1.6;
	color: var(--cq-ink-500);
	margin: 0;
}

.cq-ways {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 22px;
}
.cq-way {
	border: 1px solid var(--cq-ink-100);
	border-radius: 14px;
	padding: 22px;
	background: #ffffff;
	transition: border-color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease;
}
.cq-way:hover {
	border-color: rgba(31, 169, 113, 0.45);
	box-shadow: 0 16px 34px -26px rgba(10, 37, 64, 0.45);
	transform: translateY(-2px);
}
.cq-way .ic {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 46px;
	height: 46px;
	border-radius: 12px;
	background: var(--cq-green-tint);
	margin-bottom: 14px;
}
.cq-way .ic img {
	width: 22px;
	height: 22px;
	display: block;
}
.cq-way b {
	display: block;
	font-size: 15.5px;
	font-weight: 600;
	color: var(--cq-ink);
	margin-bottom: 6px;
}
.cq-way p {
	font-size: 13px;
	line-height: 1.6;
	color: var(--cq-ink-500);
	margin: 0 0 14px;
}
.cq-way .go {
	font-size: 13.5px;
	font-weight: 600;
	color: var(--cq-green-700);
	text-decoration: none;
	border-bottom: 1px solid rgba(31, 169, 113, 0.4);
	padding-bottom: 2px;
}
.cq-way .go:hover {
	border-bottom-color: var(--cq-green);
}

/* --- the form card ----------------------------------------------------- */

.cq-form-card {
	background: #ffffff;
	border: 1px solid var(--cq-ink-100);
	border-radius: 16px;
	padding: 28px 26px 26px;
	box-shadow: 0 26px 60px -34px rgba(10, 37, 64, 0.45);
}
.cq-form-title {
	font-size: 20px !important;
	font-weight: 600;
	color: var(--cq-ink);
	line-height: 1.3;
	margin: 0 0 4px;
	padding: 0 !important;
}
.cq-form-sub {
	font-size: 13.5px;
	color: var(--cq-ink-500);
	margin: 0 0 20px;
	line-height: 1.5;
}

.cq-form-row {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 14px;
}
.cq-field {
	margin-bottom: 15px;
}
.cq-field label {
	display: block;
	font-size: 12.5px;
	font-weight: 500;
	color: var(--cq-ink);
	margin-bottom: 6px;
}
.cq-field label span {
	color: #D64545;
}
.cq-field input,
.cq-field select,
.cq-field textarea {
	width: 100%;
	box-sizing: border-box;
	font-family: inherit;
	font-size: 13.5px;
	color: var(--cq-ink);
	background: #ffffff;
	border: 1px solid var(--cq-ink-100);
	border-radius: 8px;
	padding: 11px 13px;
	transition: border-color 0.18s ease, box-shadow 0.18s ease;
}
.cq-field textarea {
	resize: vertical;
	min-height: 92px;
	line-height: 1.55;
}
.cq-field input::placeholder,
.cq-field textarea::placeholder {
	color: var(--cq-ink-300);
}
.cq-field select {
	appearance: none;
	-webkit-appearance: none;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2333547B' stroke-width='2.1' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 12px center;
	background-size: 16px 16px;
	padding-right: 36px;
}
.cq-field input:focus,
.cq-field select:focus,
.cq-field textarea:focus {
	outline: none;
	border-color: var(--cq-green);
	box-shadow: 0 0 0 3px rgba(31, 169, 113, 0.14);
}

/* Honeypot: out of sight and out of the tab order, but not display:none —
   some bots skip fields that are hidden that obviously. */
.cq-hp {
	position: absolute;
	left: -9999px;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

.cq-turnstile {
	margin: 4px 0 16px;
	min-height: 65px;
}

.cq-form-send {
	display: block;
	width: 100%;
	border: 0;
	cursor: pointer;
	font-family: inherit;
	font-size: 14.5px;
	font-weight: 600;
	color: #ffffff;
	background: var(--cq-green);
	border-radius: 9px;
	padding: 14px 20px;
	transition: background-image 0.2s ease, box-shadow 0.2s ease;
}
.cq-form-send:hover {
	background-image: linear-gradient(90deg, #1FA971, #2DBFB0);
	box-shadow: 0 12px 26px -16px rgba(31, 169, 113, 0.9);
}
.cq-form-send span {
	margin-left: 6px;
}

.cq-form-note {
	font-size: 11.5px;
	line-height: 1.6;
	color: var(--cq-ink-300);
	margin: 14px 0 0;
}
.cq-form-note a {
	color: var(--cq-ink-500);
	text-decoration: underline;
}

.cq-form-error {
	background: #FDF3F3;
	border: 1px solid #F0C9C9;
	color: #A03434;
	border-radius: 9px;
	padding: 11px 14px;
	font-size: 13px;
	line-height: 1.5;
	margin-bottom: 16px;
}

.cq-form-done {
	text-align: center;
	padding: 22px 6px 12px;
}
.cq-form-tick {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 58px;
	height: 58px;
	border-radius: 50%;
	background: var(--cq-green-tint);
	color: var(--cq-green-700);
	margin-bottom: 16px;
}
.cq-form-tick svg {
	width: 27px;
	height: 27px;
}
.cq-form-done b {
	display: block;
	font-size: 18px;
	font-weight: 600;
	color: var(--cq-ink);
	margin-bottom: 8px;
}
.cq-form-done p {
	font-size: 13.5px;
	line-height: 1.65;
	color: var(--cq-ink-500);
	margin: 0;
}

/* --- global reach band -------------------------------------------------- */

/* Divi's divider module renders as a spacer here rather than a rule, so both
   lines are drawn on the heading that follows them. */
.cq-rule-top.et_pb_module {
	border-top: 1px solid #DCE6EE;
	padding-top: 30px;
	max-width: 640px;
}
.cq-rule-green.et_pb_module::before {
	content: "";
	display: block;
	width: 40px;
	height: 3px;
	border-radius: 2px;
	background: var(--cq-green);
	margin-bottom: 22px;
}
.cq-reach-stats {
	display: flex;
	gap: 0;
}
.cq-reach-stats div {
	padding: 0 22px;
	border-left: 1px solid rgba(10, 37, 64, 0.14);
	font-size: 15.5px;
	font-weight: 600;
	line-height: 1.35;
	color: var(--cq-ink);
}
.cq-reach-stats div:first-child {
	padding-left: 0;
	border-left: 0;
}
.cq-reach-stats span {
	display: block;
	color: var(--cq-green-700);
	font-weight: 600;
}
.cq-reach-map {
	position: relative;
}
.cq-reach-map img {
	display: block;
	width: 100%;
	height: auto;
}
.cq-reach-cap {
	text-align: right;
	font-size: 14.5px;
	font-weight: 600;
	color: var(--cq-ink);
	line-height: 1.45;
	margin-top: 8px;
}
.cq-reach-cap::before {
	content: "";
	display: block;
	width: 34px;
	height: 2px;
	background: var(--cq-green);
	margin: 0 0 10px auto;
}

/* --- responsive --------------------------------------------------------- */

/* The caption only has room to sit clear of the form card on a wide screen;
   below that it would land on top of it. */
@media (max-width: 1400px) {
	.cq-contact-tag.et_pb_module {
		display: none;
	}
}
@media (max-width: 1180px) {
	.cq-contact-arc.et_pb_module {
		width: 540px;
		height: 540px;
		right: -220px;
		top: -40px;
	}
	.cq-contact-arc .et_pb_image_wrap,
	.cq-contact-arc img {
		width: 540px !important;
		height: 540px !important;
	}
}
@media (max-width: 980px) {
	.cq-contact-arc {
		display: none;
	}
	.cq-cstep-grid {
		gap: 18px;
	}
	.cq-reach-cap {
		text-align: left;
	}
	.cq-reach-cap::before {
		margin-left: 0;
	}
}
@media (max-width: 640px) {
	.cq-cstep-grid,
	.cq-ways,
	.cq-form-row {
		grid-template-columns: 1fr;
	}
	.cq-reach-stats {
		flex-direction: column;
		gap: 14px;
	}
	.cq-reach-stats div {
		padding: 0 0 0 14px;
		border-left: 2px solid rgba(31, 169, 113, 0.35);
	}
	.cq-reach-stats div:first-child {
		padding-left: 14px;
		border-left: 2px solid rgba(31, 169, 113, 0.35);
	}
	.cq-form-card {
		padding: 22px 18px 20px;
	}
}

/* Legal links in the footer bar, opposite the copyright.
   Divi floats #footer-info left, so it shrinks to its text and a float
   inside it lands mid-bar; full width is what pushes these to the edge. */
#footer-bottom #footer-info {
	float: none;
	width: 100%;
}
.cq-foot-legal {
	float: right;
	margin-left: 24px;
	font-size: 12.5px;
}
#footer-bottom #footer-info .cq-foot-legal a {
	color: #E6EAF0;
	text-decoration: none;
}
#footer-bottom #footer-info .cq-foot-legal a:hover {
	color: var(--cq-green-300, #7ED9B4);
}
.cq-foot-legal a + a {
	margin-left: 13px;
	padding-left: 14px;
	border-left: 1px solid rgba(255, 255, 255, 0.22);
}
@media (max-width: 620px) {
	.cq-foot-legal { float: none; display: block; margin: 10px 0 0; }
}

/* ===========================================================================
   LEGAL PAGES
   =========================================================================== */
/* A detail only the company can supply, left visible on purpose: a silent
   blank in a legal page is far more dangerous than an obvious marker. */
.cq-todo {
	background: #FFF3D6;
	color: #8A5A05;
	font-weight: 600;
	padding: 1px 7px;
	border-radius: 4px;
	white-space: nowrap;
}
.cq-legal ul {
	margin: 0 0 18px;
	padding-left: 22px;
}
.cq-legal li {
	margin-bottom: 8px;
	line-height: 1.7;
}
.cq-legal h2 {
	margin-top: 34px !important;
	padding-bottom: 0 !important;
}
.cq-legal h3 {
	margin-top: 22px !important;
	padding-bottom: 0 !important;
}
.cq-legal p {
	margin-bottom: 15px;
}