/* Pixel page sections: Home, Method, stage pages, Contact, Proof, About, Insights, Perth and Privacy Policy (brand book homepage design, AA fixes in REGISTER.md section 14).
   Each section is an Elementor container with class "pxh"; text stays editable in Elementor. */

/* Neutralise Elementor container spacing inside the page so the design's rhythm holds. */
body .pxh.e-con,
body .pxh .e-con {
	--padding-top: 0px;
	--padding-right: 0px;
	--padding-bottom: 0px;
	--padding-left: 0px;
	--gap: 0px;
	--row-gap: 0px;
	--column-gap: 0px;
	--kit-widget-spacing: 0px;
	--widgets-spacing: 0px;
}
.pxh .elementor-widget { margin: 0; }
.pxh p { margin: 0; }
body .pxh.e-con {
	position: relative;
	padding: 110px 7vw;
	overflow: hidden;
}
body .pxh .pxh-inner.e-con {
	position: relative;
	width: 100%;
	max-width: 1400px;
	margin: 0 auto;
}

/* Grounds */
.pxh--ink { background: #0B0E17; }
.pxh--white { background: #FFFFFF; }
.pxh--ground { background: #F4F5F7; }

/* Type */
.pxh .pxh-kicker .elementor-heading-title {
	font-family: "Space Mono", monospace;
	font-size: 12px;
	font-weight: 400;
	line-height: 1.4;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: #C22530;
	margin-bottom: 20px;
}
.pxh--ink .pxh-kicker .elementor-heading-title { color: #E63241; }
.pxh .pxh-kicker--cyan .elementor-heading-title { color: #2E7C88; }

/* Short H1 set at the brand book's Display step: big, bold, tight. */
.pxh .pxh-h1 .elementor-heading-title {
	font-family: "Space Grotesk", sans-serif;
	font-weight: 700;
	font-size: clamp(52px, 9vw, 128px);
	line-height: 0.95;
	letter-spacing: -0.03em;
	color: #fff;
	max-width: 12ch;
	margin-bottom: 36px;
}
.pxh .pxh-h2 .elementor-heading-title {
	font-family: "Space Grotesk", sans-serif;
	font-weight: 700;
	font-size: clamp(28px, 3.6vw, 46px);
	line-height: 1.08;
	letter-spacing: -0.02em;
	color: #14171F;
	max-width: 18ch;
	margin-bottom: 28px;
}
.pxh--ink .pxh-h2 .elementor-heading-title { color: #fff; }
.pxh .pxh-h2--wide .elementor-heading-title { max-width: 26ch; font-size: clamp(26px, 3.2vw, 42px); line-height: 1.1; margin-bottom: 20px; }
.pxh .pxh-h2--quiet .elementor-heading-title { max-width: none; font-size: clamp(24px, 2.8vw, 36px); line-height: 1.3; letter-spacing: -0.01em; margin-bottom: 36px; }

.pxh .pxh-text {
	font-family: "Hanken Grotesk", sans-serif;
	font-size: 17px;
	line-height: 1.7;
	color: #3A424E;
}
.pxh .pxh-text p + p { margin-top: 20px; }
.pxh--ink .pxh-text { color: #C7CCD6; }
.pxh .pxh-lead {
	font-size: clamp(17px, 1.6vw, 21px);
	line-height: 1.6;
	margin-bottom: 40px;
}
/* Elementor forces max-width: 100% on widgets, so reading widths go on the inner element. */
.pxh .pxh-lead > .elementor-widget-container,
.pxh .pxh-lead > p { max-width: 56ch; }
.pxh .pxh-measure > .elementor-widget-container,
.pxh .pxh-measure > p { max-width: 64ch; }

/* Buttons (Elementor button widget). */
.pxh .pxbtn .elementor-button {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	font-family: "Space Grotesk", sans-serif;
	font-weight: 500;
	font-size: 15px;
	line-height: 1.2;
	letter-spacing: 0;
	padding: 14px 26px;
	border-radius: 8px;
	border: 1px solid transparent;
	box-shadow: none;
	text-transform: none;
	transition: background 0.15s, color 0.15s, border-color 0.15s;
}
/* The kit's button type is linked to the global "accent" (kicker) style, which is uppercase. */
.pxh .pxbtn .elementor-button-text { text-transform: none; letter-spacing: 0; }
.pxh .pxbtn--lg .elementor-button { font-size: 16px; padding: 16px 30px; }
.pxh .pxbtn--primary .elementor-button { background: #C22530; border-color: #C22530; color: #fff; }
.pxh--ink .pxbtn--primary .elementor-button:hover,
.pxh--ink .pxbtn--primary .elementor-button:focus-visible { background: #fff; border-color: #fff; color: #0B0E17; }
.pxh .pxbtn--ghost .elementor-button { background: transparent; border-color: rgba(255, 255, 255, 0.3); color: #fff; }
.pxh .pxbtn--ghost .elementor-button:hover { border-color: #fff; color: #fff; }
.pxh .pxbtn--dark .elementor-button { background: #0B0E17; border-color: #0B0E17; color: #fff; }
.pxh .pxbtn--dark .elementor-button:hover { background: #C22530; border-color: #C22530; color: #fff; }
.pxh .pxbtn--outline .elementor-button { background: transparent; border-color: rgba(11, 14, 23, 0.25); color: #14171F; }
.pxh .pxbtn--outline .elementor-button:hover { border-color: #14171F; color: #14171F; }
.pxh .pxbtn--cyan .elementor-button { background: #50B4C3; border-color: #50B4C3; color: #08262B; }
.pxh .pxbtn--cyan .elementor-button:hover { background: #2E7C88; border-color: #2E7C88; color: #fff; }

/* Hero */
body .pxh-hero.e-con { padding: min(14vw, 140px) 7vw 100px; }
.pxh-hero::before {
	content: "";
	position: absolute;
	inset: 0;
	background: radial-gradient(120% 70% at 85% 0%, rgba(230, 50, 65, 0.14), transparent 60%);
	pointer-events: none;
}
.pxh-hero .pxh-kicker .elementor-heading-title { margin-bottom: 26px; }

/* The problem: copy beside the "one that gets remembered" mark. */
body .pxh .pxh-split.e-con {
	--display: grid;
	display: grid;
	grid-template-columns: 1.3fr 1fr;
	gap: 60px;
	align-items: center;
}
.pxh-tiles {
	display: flex;
	flex-direction: column;
	gap: 14px;
}
.pxh-tiles__row {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	align-items: center;
}
.pxh-tiles__tile {
	width: 64px;
	height: 64px;
	border-radius: 12px;
	background: #D9DCE1;
}
.pxh-tiles__tile--red {
	background: #E63241;
	box-shadow: 0 14px 28px -12px rgba(230, 50, 65, 0.5);
}
.pxh-tiles__note {
	font-family: "Space Mono", monospace;
	font-size: 12px;
	color: #5A6270;
}

/* Cards (method stages on ink, proof clients on ground). */
body .pxh .pxh-cards.e-con {
	--display: grid;
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
	gap: 20px;
	margin: 22px 0 48px;
}
body .pxh .pxh-cards--proof.e-con {
	grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
	margin: 44px 0 40px;
}
body .pxh .pxh-card.e-con {
	--flex-direction: column;
	--justify-content: flex-start;
	background: #141926;
	border: 1px solid rgba(255, 255, 255, 0.09);
	border-radius: 14px;
	padding: 30px;
}
body .pxh .pxh-cards--proof .pxh-card.e-con {
	background: #fff;
	border-color: rgba(11, 14, 23, 0.09);
	padding: 28px;
	min-height: 150px;
	justify-content: space-between;
}
.pxh .pxh-card__num .elementor-heading-title {
	font-family: "Space Grotesk", sans-serif;
	font-weight: 400;
	font-size: 32px;
	line-height: 1;
	color: #E63241;
	margin-bottom: 16px;
}
.pxh .pxh-card__title .elementor-heading-title {
	font-family: "Space Grotesk", sans-serif;
	font-weight: 500;
	font-size: 19px;
	line-height: 1.3;
	letter-spacing: 0;
	color: #fff;
	margin-bottom: 10px;
}
.pxh .pxh-cards--proof .pxh-card__title .elementor-heading-title { color: #14171F; margin: 0; }
.pxh .pxh-cards--proof .pxh-card__title a { color: inherit; }
.pxh .pxh-cards--proof .pxh-card__title a::after { content: ""; position: absolute; inset: 0; border-radius: 14px; }
body .pxh .pxh-cards--proof .pxh-card.e-con:hover { border-color: rgba(11, 14, 23, 0.3); }
.pxh .pxh-card__text {
	font-family: "Hanken Grotesk", sans-serif;
	font-size: 14.5px;
	line-height: 1.6;
	color: #AEB4C0;
}
.pxh .pxh-card__more {
	font-family: "Space Grotesk", sans-serif;
	font-size: 22px;
	line-height: 1;
	color: #C22530;
	margin-top: 28px;
	transition: transform 0.15s;
}
body .pxh .pxh-cards--proof .pxh-card.e-con:hover .pxh-card__more { transform: translateX(4px); }

/* Centred sections */
body .pxh .pxh-inner--narrow.e-con { max-width: 1000px; text-align: center; align-items: center; }
body .pxh .pxh-inner--read.e-con { max-width: 900px; }
body .pxh .pxh-inner--cta.e-con { max-width: 760px; text-align: center; align-items: center; }
.pxh .pxh-inner--narrow .elementor-heading-title,
.pxh .pxh-inner--cta .elementor-heading-title { margin-left: auto; margin-right: auto; }
.pxh .pxh-inner--narrow .pxh-text { margin-bottom: 36px; }
.pxh .pxh-inner--narrow .pxh-text > .elementor-widget-container,
.pxh .pxh-inner--narrow .pxh-text > p { max-width: 52ch; margin: 0 auto; }
.pxh .pxh-inner--read .pxh-text { font-size: 16.5px; line-height: 1.75; margin-bottom: 36px; }
.pxh .pxh-inner--cta .pxh-h2 .elementor-heading-title { max-width: none; font-size: clamp(28px, 3.6vw, 44px); line-height: 1.1; margin-bottom: 26px; }
.pxh .pxh-inner--cta .pxh-text { line-height: 1.65; margin-bottom: 40px; }
.pxh .pxh-inner--cta .pxh-text p + p { margin-top: 16px; }
body .pxh-cta.e-con { padding: 120px 7vw; }
.pxh-cta::before {
	content: "";
	position: absolute;
	inset: 0;
	background: radial-gradient(80% 90% at 50% 120%, rgba(230, 50, 65, 0.12), transparent 60%);
	pointer-events: none;
}

@media (max-width: 900px) {
	body .pxh.e-con { padding: 80px 6vw; }
	body .pxh-hero.e-con { padding: 72px 6vw 80px; }
	body .pxh-cta.e-con { padding: 88px 6vw; }
	body .pxh .pxh-split.e-con { grid-template-columns: 1fr; gap: 44px; }
}

/* ---------- Inner pages (Method and the five stage pages) ---------- */

.pxh .pxh-h1--page .elementor-heading-title {
	font-size: clamp(40px, 5.6vw, 76px);
	line-height: 1.02;
	letter-spacing: -0.025em;
	max-width: 18ch;
}
body .pxh-hero--page.e-con { padding: min(10vw, 110px) 7vw 90px; }

/* Breadcrumb */
.pxh-crumbs ol {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	list-style: none;
	margin: 0 0 28px;
	padding: 0;
	font-family: "Space Mono", monospace;
	font-size: 12px;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: #8A91A0;
}
.pxh-crumbs li + li::before { content: "/"; margin-right: 6px; color: #5B6472; }
.pxh-crumbs a { color: #C7CCD6; text-decoration: none; }
.pxh-crumbs a:hover { color: #fff; }
.pxh-crumbs [aria-current] { color: #E63241; }

/* Big stage number in the stage-page hero */
.pxh .pxh-bignum .elementor-heading-title {
	font-family: "Space Grotesk", sans-serif;
	font-weight: 400;
	font-size: clamp(48px, 6vw, 88px);
	line-height: 1;
	color: #E63241;
	margin-bottom: 18px;
}

/* Reading block (h2 + text, centred measure) */
body .pxh .pxh-inner--read .pxh-h2 .elementor-heading-title { max-width: 22ch; }

/* Method: the five stages as numbered rows */
body .pxh .pxh-stage.e-con {
	--display: grid;
	display: grid;
	grid-template-columns: minmax(80px, 140px) 1fr;
	gap: 0 40px;
	padding: 56px 0;
	border-top: 1px solid rgba(11, 14, 23, 0.12);
}
body .pxh .pxh-stage.e-con:last-child { border-bottom: 1px solid rgba(11, 14, 23, 0.12); }
body .pxh .pxh-stage__body.e-con { --flex-direction: column; align-items: flex-start; max-width: 70ch; }
.pxh .pxh-stage .pxh-card__num .elementor-heading-title {
	font-size: clamp(40px, 4.4vw, 64px);
	color: #C22530;
	margin: 0;
}
.pxh .pxh-stage .pxh-h2 .elementor-heading-title {
	font-size: clamp(24px, 2.6vw, 34px);
	max-width: none;
	margin-bottom: 18px;
}
.pxh .pxh-stage .pxh-text { margin-bottom: 26px; }
.pxh .pxh-text strong { color: #14171F; font-weight: 600; }
.pxh--ink .pxh-text strong { color: #fff; }
body .pxh .pxh-btnrow.e-con { --flex-direction: row; flex-wrap: wrap; gap: 12px; }

/* Stage pages: label column beside the copy */
body .pxh .pxh-row.e-con {
	--display: grid;
	display: grid;
	grid-template-columns: minmax(180px, 1fr) 2fr;
	gap: 0 60px;
	padding: 48px 0;
	border-top: 1px solid rgba(11, 14, 23, 0.12);
}
body .pxh .pxh-row.e-con:first-child { border-top: 0; padding-top: 0; }
.pxh .pxh-row .pxh-h2 .elementor-heading-title {
	font-size: clamp(22px, 2.2vw, 30px);
	line-height: 1.15;
	max-width: 14ch;
	margin: 0;
}
.pxh .pxh-row .pxh-text { max-width: 66ch; }
body .pxh .pxh-row--accent.e-con {
	background: #F4F5F7;
	border-top: 0;
	border-radius: 14px;
	padding: 40px;
	margin: 8px 0;
}
.pxh .pxh-row--accent .pxh-h2 .elementor-heading-title { color: #C22530; }

/* Next-stage card */
body .pxh .pxh-next.e-con {
	--display: grid;
	display: grid;
	grid-template-columns: 1fr auto;
	gap: 24px;
	align-items: center;
}
.pxh .pxh-next__card .elementor-heading-title {
	font-family: "Space Grotesk", sans-serif;
	font-weight: 700;
	font-size: clamp(26px, 3.4vw, 44px);
	line-height: 1.1;
	letter-spacing: -0.02em;
	color: #14171F;
}
.pxh .pxh-next__card a { color: inherit; text-decoration: none; }
.pxh .pxh-next__card a:hover { color: #C22530; }

@media (max-width: 900px) {
	body .pxh .pxh-stage.e-con,
	body .pxh .pxh-row.e-con,
	body .pxh .pxh-next.e-con { grid-template-columns: 1fr; gap: 14px; padding: 40px 0; }
	body .pxh .pxh-row--accent.e-con { padding: 28px 22px; }
	.pxh .pxh-row .pxh-h2 .elementor-heading-title { max-width: none; }
}

/* ---------- Contact: Story Clarity gate ---------- */

body .pxh .pxh-gate.e-con {
	--flex-direction: column;
	background: #F4F5F7;
	border: 1px solid rgba(11, 14, 23, 0.09);
	border-radius: 14px;
	padding: 36px;
	align-self: start;
}
.pxh .pxh-gate__lead .elementor-heading-title {
	font-family: "Space Grotesk", sans-serif;
	font-weight: 500;
	font-size: 20px;
	line-height: 1.35;
	color: #14171F;
	margin-bottom: 24px;
}
.pxh-gate .elementor-field-group { margin-bottom: 18px; }
.pxh-gate .elementor-field-label {
	font-family: "Space Mono", monospace;
	font-size: 12px;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: #5A6270;
	margin-bottom: 8px;
}
.pxh-gate .elementor-field-textual {
	font-family: "Hanken Grotesk", sans-serif;
	font-size: 16px;
	min-height: 48px;
	background: #fff;
	color: #14171F;
	border: 1px solid #5A6270;
	border-radius: 8px;
	padding: 12px 14px;
}
.pxh-gate .elementor-field-textual:focus { border-color: #2E7C88; }
.pxh-gate .elementor-button {
	width: 100%;
	justify-content: center;
	font-family: "Space Grotesk", sans-serif;
	font-weight: 500;
	font-size: 16px;
	letter-spacing: 0;
	text-transform: none;
	padding: 16px 24px;
	border-radius: 8px;
	background: #C22530;
	color: #fff;
	border: 1px solid #C22530;
}
.pxh-gate .elementor-button .elementor-button-text { text-transform: none; }
.pxh-gate .elementor-button:hover { background: #14171F; border-color: #14171F; }
.pxh-gate .elementor-message { font-family: "Hanken Grotesk", sans-serif; font-size: 15px; margin-top: 14px; }
.pxh-gate .elementor-message-success { color: #1E6B48; }
.pxh-gate .pxh-gate__notice,
.pxh-gate .pxh-gate__notice p {
	font-size: 13px;
	line-height: 1.55;
	color: #5A6270;
	margin-top: 16px;
}
.pxh-gate .pxh-gate__notice a { color: #C22530; }

/* Phase 2: hidden until the gate succeeds (soft gate, REGISTER.md section 10). */
body .pxh-reveal.e-con:not(.is-open) { display: none; }
.pxh .pxh-placeholder {
	border: 1px dashed #8A91A0;
	border-radius: 14px;
	padding: 28px;
	font-family: "Space Mono", monospace;
	font-size: 13px;
	line-height: 1.6;
	color: #5A6270;
	background: #fff;
}
.pxh .pxh-h2--spaced .elementor-heading-title { margin-top: 48px; }
body .pxh .pxh-col.e-con { --flex-direction: column; align-items: flex-start; }

/* ---------- Proof hub and client proof pages ---------- */
.pxh .pxh-h1--long .elementor-heading-title { max-width: 22ch; font-size: clamp(36px, 5.2vw, 72px); }

/* Industry filters (buttons styled here, because the kit's button style reaches every <button>). */
.pxh-filter { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 32px; }
.pxh .pxh-filter button.pxh-filter__btn,
.pxh .pxh-filter button.pxh-filter__btn:hover,
.pxh .pxh-filter button.pxh-filter__btn:focus {
	font-family: "Space Grotesk", sans-serif;
	font-size: 14.5px;
	font-weight: 500;
	line-height: 1.2;
	letter-spacing: 0;
	text-transform: none;
	color: #fff;
	background: transparent;
	border: 1px solid rgba(255, 255, 255, 0.3);
	border-radius: 999px;
	padding: 11px 20px;
	box-shadow: none;
	cursor: pointer;
	transition: background 0.15s, border-color 0.15s, color 0.15s;
}
.pxh .pxh-filter button.pxh-filter__btn:hover { border-color: #fff; }
.pxh .pxh-filter button.pxh-filter__btn[aria-pressed="true"] { background: #fff; border-color: #fff; color: #0B0E17; }
.pxh .pxh-filter button.pxh-filter__btn:focus-visible { outline: 2px solid #50B4C3; outline-offset: 3px; }
.pxh .pxh-filter__status {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
}

/* A sector: heading and intro beside its client cards. */
body .pxh-cluster.e-con[hidden] { display: none !important; }
body .pxh .pxh-cluster__grid.e-con {
	--display: grid;
	display: grid;
	grid-template-columns: minmax(260px, 1fr) 1.6fr;
	gap: 0 72px;
	align-items: start;
}
.pxh .pxh-cluster__copy .pxh-h2 .elementor-heading-title { font-size: clamp(28px, 3vw, 40px); line-height: 1.1; margin-bottom: 20px; }
body .pxh .pxh-cards--cluster.e-con { margin: 0; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); }
body .pxh--white .pxh-cards--proof .pxh-card.e-con { background: #F4F5F7; }
body .pxh .pxh-cards--cluster .pxh-card.e-con { min-height: 210px; }
.pxh .pxh-cards--proof .pxh-card__text { color: #323C46; margin-top: 14px; }
.pxh .pxh-card__cta {
	font-family: "Space Grotesk", sans-serif;
	font-size: 15px;
	font-weight: 500;
	color: #C22530;
	margin-top: 28px;
	transition: transform 0.15s;
}
body .pxh .pxh-cards--proof .pxh-card.e-con:hover .pxh-card__cta { transform: translateX(4px); }
body .pxh .pxh-cards--proof .pxh-card.e-con:focus-within { outline: 2px solid #2E7C88; outline-offset: 3px; }
.pxh .pxh-cards--proof .pxh-card__title a:focus-visible { outline: none; }

/* Client proof pages: industry tag under the H1. */
.pxh-tags { list-style: none; margin: 28px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.pxh-tags a {
	display: inline-block;
	font-family: "Space Mono", monospace;
	font-size: 12.5px;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: #fff;
	text-decoration: none;
	border: 1px solid rgba(255, 255, 255, 0.3);
	border-radius: 999px;
	padding: 8px 14px;
}
.pxh-tags a:hover { border-color: #fff; }
.pxh .pxh-lead--dark { color: #323C46; margin-bottom: 36px; }

@media (max-width: 900px) {
	body .pxh .pxh-cluster__grid.e-con { grid-template-columns: 1fr; gap: 32px; }
	.pxh .pxh-filter button.pxh-filter__btn { padding: 10px 16px; font-size: 14px; }
}

/* ---------- About ---------- */
/* "Safe is risky." set big beside the argument. */
body .pxh .pxh-manifesto.e-con {
	--display: grid;
	display: grid;
	grid-template-columns: minmax(280px, 1fr) 1.5fr;
	gap: 0 80px;
	align-items: start;
}
.pxh .pxh-h2--display .elementor-heading-title {
	font-size: clamp(48px, 7vw, 104px);
	line-height: 0.95;
	letter-spacing: -0.035em;
	max-width: 7ch;
	margin: 0;
}
.pxh .pxh-manifesto .pxh-text { font-size: 17px; line-height: 1.75; }
.pxh .pxh-manifesto .pxh-text p:first-child { font-family: "Space Grotesk", sans-serif; font-size: clamp(20px, 1.9vw, 24px); line-height: 1.45; color: #14171F; }

/* The six values as a 3 x 2 cycle on ink. */
body .pxh .pxh-cards--values.e-con { grid-template-columns: repeat(3, minmax(0, 1fr)); margin: 48px 0 44px; }
body .pxh .pxh-cards--values .pxh-card.e-con:last-child { border-color: rgba(230, 50, 65, 0.45); }

/* Inline links in reading text on light grounds (beats the kit's link colour). */
.elementor-kit-4 .pxh .pxh-text--links a { color: #C22530; text-decoration: underline; text-underline-offset: 3px; }
.elementor-kit-4 .pxh .pxh-text--links a:hover { color: #14171F; }

@media (max-width: 1100px) {
	body .pxh .pxh-cards--values.e-con { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 900px) {
	body .pxh .pxh-manifesto.e-con { grid-template-columns: 1fr; gap: 32px; }
}
@media (max-width: 640px) {
	body .pxh .pxh-cards--values.e-con { grid-template-columns: 1fr; }
}

/* ---------- Insights hub and articles ---------- */
/* Topic filters on the light ground (the Proof filters sit on ink). */
.pxh .pxi-filter { margin: 0 0 40px; }
.pxh .pxi-filter button.pxh-filter__btn,
.pxh .pxi-filter button.pxh-filter__btn:hover,
.pxh .pxi-filter button.pxh-filter__btn:focus { color: #14171F; border-color: rgba(11, 14, 23, 0.25); }
.pxh .pxi-filter button.pxh-filter__btn:hover { border-color: #14171F; }
.pxh .pxi-filter button.pxh-filter__btn[aria-pressed="true"] { background: #0B0E17; border-color: #0B0E17; color: #fff; }
.pxh .pxi-filter button.pxh-filter__btn:focus-visible { outline-color: #2E7C88; }

.pxi__list { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 20px; }
.pxi__item[hidden] { display: none; }
.pxi-card {
	position: relative;
	height: 100%;
	display: flex;
	flex-direction: column;
	background: #fff;
	border: 1px solid rgba(11, 14, 23, 0.09);
	border-radius: 14px;
	padding: 28px;
	transition: border-color 0.15s;
}
.pxi-card:hover { border-color: rgba(11, 14, 23, 0.3); }
.pxi-card:focus-within { outline: 2px solid #2E7C88; outline-offset: 3px; }
.pxi-card__meta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px 14px;
	margin: 0 0 18px;
	font-family: "Space Mono", monospace;
	font-size: 12px;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: #5B6472;
}
.pxi-card__tag { color: #C22530; }
.pxh .pxi-card__title {
	font-family: "Space Grotesk", sans-serif;
	font-weight: 600;
	font-size: 21px;
	line-height: 1.25;
	letter-spacing: -0.01em;
	margin: 0 0 12px;
}
.elementor-kit-4 .pxh .pxi-card__title a { color: #14171F; text-decoration: none; }
.pxh .pxi-card__title a::after { content: ""; position: absolute; inset: 0; border-radius: 14px; }
.pxh .pxi-card__title a:focus-visible { outline: none; }
.pxi-card__excerpt { font-family: "Hanken Grotesk", sans-serif; font-size: 15px; line-height: 1.6; color: #323C46; margin: 0; }
.pxi-card__cta { margin-top: auto; padding-top: 24px; font-family: "Space Grotesk", sans-serif; font-size: 15px; font-weight: 500; color: #C22530; transition: transform 0.15s; }
.pxi-card:hover .pxi-card__cta { transform: translateX(4px); }
.pxi__empty { font-family: "Hanken Grotesk", sans-serif; font-size: 17px; color: #323C46; }

/* Article hero meta */
.pxi-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 18px; margin-top: 28px; font-family: "Space Mono", monospace; font-size: 13px; letter-spacing: 0.06em; text-transform: uppercase; color: #C7CCD6; }
.pxi-meta .pxh-tags { margin: 0; }

/* Article body at reading width */
.pxh .pxi-figure img { width: 100%; height: auto; border-radius: 14px; margin-bottom: 44px; }
.pxh .pxi-article { font-family: "Hanken Grotesk", sans-serif; font-size: 17.5px; line-height: 1.75; color: #323C46; }
.pxh .pxi-article > .elementor-widget-container > * + *,
.pxh .pxi-article > * + * { margin-top: 1.1em; }
.pxh .pxi-article h2 { font-family: "Space Grotesk", sans-serif; font-weight: 700; font-size: clamp(26px, 2.6vw, 34px); line-height: 1.15; letter-spacing: -0.015em; color: #14171F; margin-top: 1.8em; }
.pxh .pxi-article h3 { font-family: "Space Grotesk", sans-serif; font-weight: 600; font-size: 22px; line-height: 1.25; color: #14171F; margin-top: 1.6em; }
.pxh .pxi-article ul,
.pxh .pxi-article ol { padding-left: 1.3em; }
.pxh .pxi-article li + li { margin-top: 0.4em; }
.pxh .pxi-article blockquote { margin: 1.6em 0; padding: 4px 0 4px 24px; border-left: 3px solid #E63241; font-family: "Space Grotesk", sans-serif; font-size: 22px; line-height: 1.45; color: #14171F; }
.elementor-kit-4 .pxh .pxi-article a { color: #C22530; text-decoration: underline; text-underline-offset: 3px; }
.elementor-kit-4 .pxh .pxi-article a:hover { color: #14171F; }
.pxh .pxi-article img { max-width: 100%; height: auto; border-radius: 10px; }
body .pxh .pxi-back.e-con { margin-top: 56px; }
.pxh .pxi-title {
	font-family: "Space Grotesk", sans-serif;
	font-weight: 700;
	font-size: clamp(36px, 5.2vw, 68px);
	line-height: 1.04;
	letter-spacing: -0.025em;
	color: #fff;
	max-width: 22ch;
	margin: 0;
}

/* Article hero: the article's own featured image, under a gradient that keeps the white title AA. */
body .pxh .pxi-hero-media { position: absolute; inset: 0; z-index: 0; margin: 0; }
.pxh .pxi-hero-media .elementor-shortcode,
.pxh .pxi-hero-media__fig,
.elementor .pxh .pxi-hero-media__fig img { position: absolute; inset: 0; width: 100%; height: 100%; max-width: none; max-height: none; margin: 0; object-fit: cover; }
.pxi-hero-media__fig::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(90deg, rgba(11, 14, 23, 0.94) 0%, rgba(11, 14, 23, 0.82) 45%, rgba(11, 14, 23, 0.5) 100%), linear-gradient(0deg, rgba(11, 14, 23, 0.7) 0%, transparent 45%);
}
body .pxh.pxi-hero.e-con { min-height: min(72vh, 680px); --justify-content: flex-end; justify-content: flex-end; }
body .pxh.pxi-hero .pxh-inner.e-con { position: relative; z-index: 2; }
.pxh.pxi-hero::before { z-index: 1; }

/* Card image on the hub */
.pxi-card--media { padding-top: 0; overflow: hidden; }
.pxi-card__media { margin: 0 -28px 24px; aspect-ratio: 16 / 9; background: #E6E8EC; }
.elementor .pxh .pxi-card__media img { width: 100%; height: 100%; max-width: none; object-fit: cover; display: block; }
.pxi-meta__by { color: #fff; }

/* ---------- Perth and Privacy Policy ---------- */
.pxh .pxh-h2--gap .elementor-heading-title { margin-bottom: 40px; }
.pxh .pxh-rowlink { margin-top: 18px; font-family: "Space Grotesk", sans-serif; font-size: 15px; font-weight: 500; }
.elementor-kit-4 .pxh .pxh-rowlink a { color: #C22530; text-decoration: none; }
.elementor-kit-4 .pxh .pxh-rowlink a:hover { color: #14171F; }
.pxh .pxh-h2--policy .elementor-heading-title { font-size: clamp(22px, 2.2vw, 28px); line-height: 1.2; margin: 48px 0 14px; max-width: none; }
.pxh .pxh-policy { font-size: 16.5px; line-height: 1.75; color: #323C46; }
.pxh .pxh-policy p + p { margin-top: 14px; }
.pxh .pxh-policy ul { margin: 0 0 14px; padding-left: 1.3em; }
.pxh .pxh-policy li + li { margin-top: 8px; }

/* ---------- Internal links (step 14) ---------- */
.pxh .pxh-kicker a { color: inherit; text-decoration: none; }
.pxh .pxh-kicker a:hover { text-decoration: underline; text-underline-offset: 4px; }
/* Home stage cards are whole-card links to their stage pages. */
.pxh .pxh-cards:not(.pxh-cards--proof) .pxh-card__title a { color: #fff; text-decoration: none; }
.pxh .pxh-cards:not(.pxh-cards--proof) .pxh-card__title a::after { content: ""; position: absolute; inset: 0; border-radius: 14px; }
body .pxh .pxh-cards:not(.pxh-cards--proof) .pxh-card.e-con:hover { border-color: rgba(255, 255, 255, 0.28); }
body .pxh .pxh-cards:not(.pxh-cards--proof) .pxh-card.e-con:focus-within { outline: 2px solid #50B4C3; outline-offset: 3px; }
.pxh .pxh-cards:not(.pxh-cards--proof) .pxh-card__title a:focus-visible { outline: none; }
.elementor-kit-4 .pxh .pxh-text--links-ink a { color: #fff; text-decoration: underline; text-underline-offset: 3px; }
.elementor-kit-4 .pxh .pxi-meta__by a { color: #fff; text-decoration: underline; text-underline-offset: 3px; }
/* "From Insights" and "Where this fits" lists */
.pxl-related,
.pxl-fits { margin-top: 32px; padding-top: 22px; border-top: 1px solid rgba(11, 14, 23, 0.12); }
.pxl-related__label { font-family: "Space Mono", monospace; font-size: 12px; letter-spacing: 0.08em; text-transform: uppercase; color: #5B6472; margin: 0 0 12px; }
.pxl-related ul,
.pxl-fits ul { list-style: none; margin: 0; padding: 0; }
.pxl-related li,
.pxl-fits li { margin: 0 0 10px; font-family: "Space Grotesk", sans-serif; font-size: 16px; font-weight: 500; }
.pxl-related time { display: block; font-family: "Space Mono", monospace; font-size: 11.5px; font-weight: 400; color: #5B6472; margin-top: 2px; }
.elementor-kit-4 .pxh .pxl-related a,
.elementor-kit-4 .pxh .pxl-fits a { color: #C22530; text-decoration: none; }
.elementor-kit-4 .pxh .pxl-related a:hover,
.elementor-kit-4 .pxh .pxl-fits a:hover { color: #14171F; }
.pxh-row .pxl-related { grid-column: 1 / -1; }

/* Story Clarity Session price and email booking (step 28). */
.pxh .pxh-price {
	font-family: "Hanken Grotesk", sans-serif;
	font-size: clamp(18px, 1.8vw, 22px);
	line-height: 1.5;
	color: #3A424E;
}
.pxh .pxh-price strong {
	display: block;
	font-family: "Space Grotesk", sans-serif;
	font-weight: 700;
	font-size: clamp(40px, 5vw, 60px);
	line-height: 1;
	letter-spacing: -0.02em;
	color: #14171F;
	margin-bottom: 8px;
}
.pxh-reveal .elementor-widget-html p { font-family: "Hanken Grotesk", sans-serif; font-size: 17px; line-height: 1.7; color: #3A424E; max-width: 56ch; }
.pxh .pxh-book { margin: 24px 0 16px; }
.pxh .pxh-book .elementor-button { text-decoration: none; }
.pxh .pxh-book__alt { font-size: 15px; }
.pxh .pxh-book__alt a { color: #C22530; text-decoration: underline; }

/* Home hero: Alex's rock-star chimp holding the slate (assets/img/hero-chimp-v6.jpg, 1672x852, from his draft with the
   baked-in text painted out). The image spans the full hero; its slate's flat base (#E3E3E4) is the next section's
   ground, so the slate runs on into the row below. Step 32, REGISTER.md. */
body.home .pxh-hero:not(.pxh-hero--page).e-con {
	min-height: 50.96vw;
	padding-bottom: calc(9.6% + 48px);
	background: linear-gradient(#E3E3E4, #E3E3E4) left bottom / 100% 24px no-repeat, #0B0E17;
}
body.home .pxh-hero:not(.pxh-hero--page)::before { z-index: 1; }
body.home .pxh-hero:not(.pxh-hero--page)::after {
	content: "";
	position: absolute;
	right: 0;
	bottom: -1px;
	width: 100%;
	aspect-ratio: 1672 / 852;
	background: url("img/hero-chimp-v6.jpg") center / 100% 100% no-repeat;
	-webkit-mask-image: linear-gradient(to bottom, transparent 0, #000 14%);
	mask-image: linear-gradient(to bottom, transparent 0, #000 14%);
	pointer-events: none;
}
body.home .pxh-hero:not(.pxh-hero--page) .pxh-inner.e-con { z-index: 2; }
body.home .pxh-hero:not(.pxh-hero--page) .pxh-lead > .elementor-widget-container,
body.home .pxh-hero:not(.pxh-hero--page) .pxh-lead > p { max-width: min(62ch, 43vw); }
body.home .pxh-hero:not(.pxh-hero--page) + .pxh--white { background: #E3E3E4; }
@media (max-width: 900px) {
	body.home .pxh-hero:not(.pxh-hero--page).e-con { min-height: 0; padding-bottom: 84%; }
	body.home .pxh-hero:not(.pxh-hero--page)::after { width: 185%; right: -12%; }
	body.home .pxh-hero:not(.pxh-hero--page) .pxh-lead > .elementor-widget-container,
	body.home .pxh-hero:not(.pxh-hero--page) .pxh-lead > p { max-width: 56ch; }
}

/* Article byline: Mojo's profile picture beside "By Mojo" (step 33). */
.pxi-meta .pxi-meta__by { display: inline-flex; align-items: center; gap: 10px; }
.pxi-meta .pxi-meta__avatar { width: 40px; height: 40px; border-radius: 50%; object-fit: cover; box-shadow: 0 0 0 2px #C22530; flex: none; }
