/**
 * 1to30 Partners tracks — /partners/, /partners/referral/, /partners/reseller/.
 * Builds on landing-partners.css tokens (.o30pt) + landing-partners-earn.css
 * components (.o30pe). Everything new is namespaced .o30px / .px-*.
 *
 * Accent (--pt-accent lime) is reserved for: CTAs, active states, key numbers,
 * slider/calculator, status/progress. Black/white stays dominant.
 */

body:has(.o30px) .page-header,
body.page:has(.o30px) .page-header,
body.page:has(.o30px) .page-header .entry-title {
	display: none !important;
}

.o30px .pt-cta--light {
	background: #fff;
	color: var(--pt-ink);
}

/*
 * Hello Elementor's reset.css paints button:hover / button:focus magenta
 * (#c36). It loads after this sheet, so every <button> on these pages needs
 * its hover/focus background restated explicitly.
 */
.o30px button.pt-cta--primary:hover,
.o30px button.pt-cta--primary:focus {
	background: var(--pt-accent);
	color: var(--pt-ink);
}

.o30px button.pt-cta--light:hover,
.o30px button.pt-cta--light:focus {
	background: #fff;
	color: var(--pt-ink);
}

body:has(.o30px) .o30v3-nav-toggle:hover,
body:has(.o30px) .o30v3-nav-toggle:focus {
	background: transparent;
	color: inherit;
}

body:has(.o30px) .o30v3-mobile-nav__backdrop:hover,
body:has(.o30px) .o30v3-mobile-nav__backdrop:focus {
	background: rgba(0, 0, 0, .45);
}

/* ---------- Hub hero ---------- */

.o30px .px-hero {
	padding-top: 48px;
	padding-bottom: 26px;
	text-align: center;
}

.o30px .px-hero__title {
	font-weight: 800;
	font-size: 56px;
	letter-spacing: -.03em;
	line-height: 1.05;
	margin-bottom: 18px;
}

.o30px .px-hero__lead {
	font-size: 18px;
	line-height: 1.55;
	color: #4a463f;
	max-width: 620px;
	margin: 0 auto 26px;
}

.o30px .px-hero__actions {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: 12px 20px;
}

.o30px .px-hero__earn {
	font-size: 16px;
	line-height: 1.55;
	color: var(--pt-muted);
	margin: -6px 0 20px;
}

.o30px .px-hero__earn b {
	display: inline-block;
	font-size: 18px;
	font-weight: 800;
	letter-spacing: -.01em;
	color: var(--pt-ink);
	background: linear-gradient(transparent 66%, var(--pt-accent) 66%);
}

.o30px .px-hero__quota {
	margin-top: 14px;
	font-size: 14px;
	font-weight: 700;
	color: var(--pt-ink);
}

.o30px .px-hero__reseller {
	margin-top: 10px;
	font-size: 14px;
	font-weight: 600;
	color: var(--pt-muted);
}

.o30px .px-hero__reseller a {
	color: var(--pt-ink);
	font-weight: 700;
	text-decoration: underline;
	text-underline-offset: 3px;
}

/* ---------- Choose cards ---------- */

.o30px .px-choose {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 20px;
	align-items: stretch;
}

/* Referral leads; reseller is the slim, secondary qualification track. */
.o30px .px-choose--lead {
	grid-template-columns: 1.5fr 1fr;
	align-items: start;
}

.o30px .px-track--slim {
	background: var(--pt-paper, #fbfaf7);
	box-shadow: none;
}

.o30px .px-track--slim h3 {
	font-size: 20px;
}

.o30px .px-track--slim > p {
	font-size: 14px;
}

.o30px .px-track__link {
	display: inline-block;
	margin-top: 6px;
	font-size: 14.5px;
	font-weight: 700;
	color: var(--pt-ink);
	text-decoration: underline;
	text-underline-offset: 3px;
}

.o30px .px-track {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	padding: 34px 32px 30px;
	border-radius: 22px;
}

.o30px .px-track__label {
	font-size: 12px;
	font-weight: 800;
	letter-spacing: .09em;
	text-transform: uppercase;
	color: var(--pt-muted);
	background: var(--pt-paper);
	border: 1px solid var(--pt-line);
	border-radius: 999px;
	padding: 6px 12px;
	margin-bottom: 18px;
}

.o30px .px-track h3 {
	font-size: 28px;
	font-weight: 800;
	letter-spacing: -.025em;
	line-height: 1.12;
	margin-bottom: 12px;
}

.o30px .px-track > p {
	font-size: 15.5px;
	line-height: 1.55;
	color: var(--pt-muted);
	margin-bottom: 22px;
}

.o30px .px-track__num {
	margin-bottom: 14px;
}

.o30px .px-track__num b {
	display: block;
	font-size: 44px;
	font-weight: 800;
	letter-spacing: -.03em;
	line-height: 1;
}

.o30px .px-track__num--sub b {
	font-size: 26px;
}

.o30px .px-track__num span {
	display: block;
	margin-top: 5px;
	font-size: 13.5px;
	font-weight: 700;
	color: var(--pt-soft);
}

.o30px .px-track__num--formula b {
	font-size: 26px;
	line-height: 1.25;
}

.o30px .px-track .pt-cta {
	margin-top: auto;
	align-self: stretch;
}

.o30px .px-track__micro {
	align-self: center;
	margin-top: 12px;
	font-size: 13px;
	font-weight: 700;
	color: var(--pt-soft);
}

.o30px .px-track .px-track__num b {
	background: linear-gradient(transparent 66%, var(--pt-accent) 66%);
	display: inline-block;
	color: inherit;
}

/* ---------- Compare table ---------- */

.o30px .px-compare {
	padding: 10px 10px 26px;
	overflow: hidden;
}

.o30px .px-compare table {
	width: 100%;
	border-collapse: collapse;
	font-size: 15px;
}

.o30px .px-compare th,
.o30px .px-compare td {
	padding: 14px 18px;
	border-bottom: 1px solid var(--pt-line);
	text-align: center;
}

.o30px .px-compare th:first-child,
.o30px .px-compare td:first-child {
	text-align: left;
	font-weight: 600;
	color: var(--pt-muted);
	width: 40%;
}

.o30px .px-compare thead th {
	font-size: 13px;
	font-weight: 800;
	letter-spacing: .06em;
	text-transform: uppercase;
	color: var(--pt-ink);
	border-bottom: 2px solid var(--pt-ink);
}

.o30px .px-compare td.is-yes {
	font-weight: 800;
	font-size: 16px;
}

.o30px .px-compare td.is-yes::before {
	content: '';
	display: inline-block;
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: var(--pt-accent);
	border: 1px solid var(--pt-ink);
	margin-right: 8px;
	vertical-align: 1px;
}

.o30px .px-compare td.is-no {
	color: #c4beb2;
	font-weight: 700;
}

.o30px .px-compare tbody tr:last-child td {
	border-bottom: 0;
}

.o30px .px-compare__ctas {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 12px;
	margin-top: 22px;
}

/* ---------- Engine steps (hub) + certification steps (reseller) ---------- */

.o30px .px-engine,
.o30px .px-steps4 {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 16px;
}

.o30px .px-engine li,
.o30px .px-steps4 li {
	padding: 24px 22px;
}

.o30px .px-engine__num {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 34px;
	height: 34px;
	border-radius: 9px;
	background: var(--pt-ink);
	color: #fff;
	font-weight: 800;
	font-size: 15px;
	margin-bottom: 14px;
}

.o30px .px-engine strong,
.o30px .px-steps4 strong {
	display: block;
	font-size: 18px;
	font-weight: 800;
	letter-spacing: -.02em;
	margin-bottom: 8px;
}

.o30px .px-engine p,
.o30px .px-steps4 p {
	font-size: 14.5px;
	line-height: 1.55;
	color: var(--pt-muted);
}

.o30px .px-engine__earn {
	background: #161513 !important;
	border-color: #161513 !important;
	color: #fff;
}

.o30px .px-engine__earn .px-engine__num {
	background: var(--pt-accent);
	color: var(--pt-ink);
}

.o30px .px-engine__earn p {
	color: #b6b0a4;
}

.o30px .px-engine__earn p b {
	color: #fff;
}

/* ---------- Hub who note + final ---------- */

.o30px .px-who__note {
	text-align: center;
	max-width: 640px;
	margin: 28px auto 0;
	font-size: 16px;
	line-height: 1.55;
	color: var(--pt-muted);
}

.o30px .px-who__note b {
	color: var(--pt-ink);
}

.o30px .px-final__lead {
	font-size: 16.5px;
	line-height: 1.6;
	color: rgba(255, 255, 255, .82);
	max-width: 560px;
	margin: 0 auto 24px;
}

.o30px .px-final__actions {
	display: flex;
	justify-content: center;
	margin-bottom: 18px;
}

.o30px .px-final__reseller {
	font-size: 14px;
	font-weight: 600;
	color: #b6b0a4;
}

.o30px .px-final__reseller a {
	color: #fff;
	font-weight: 700;
	text-decoration: underline;
	text-underline-offset: 3px;
}

/* ---------- Track heroes (referral + reseller) ---------- */

.o30px .px-rhero {
	display: grid;
	grid-template-columns: minmax(0, 1.12fr) minmax(0, .88fr);
	gap: 44px;
	align-items: center;
	padding-top: 40px;
	padding-bottom: 56px;
}

.o30px--ref .px-rhero {
	gap: 32px;
}

.o30px .px-rhero__copy {
	padding-top: 6px;
}

.o30px .px-rhero__title {
	font-weight: 800;
	font-size: 46px;
	letter-spacing: -.03em;
	line-height: 1.08;
	margin-bottom: 18px;
}

.o30px .px-mark {
	display: inline;
	background: linear-gradient(transparent 62%, var(--pt-accent) 62%);
	box-decoration-break: clone;
	-webkit-box-decoration-break: clone;
}

.o30px .px-rhero__lead {
	font-size: 17px;
	line-height: 1.55;
	color: #4a463f;
	max-width: 560px;
	margin-bottom: 16px;
}

.o30px--ref .px-rhero__lead {
	max-width: none;
}

.o30px .px-rhero .pt-hero__trust {
	margin-bottom: 20px;
}

.o30px .px-rhero__earn {
	font-size: 16px;
	line-height: 1.55;
	color: var(--pt-muted);
	margin-bottom: 14px;
}

.o30px .px-rhero__earn b {
	display: inline-block;
	font-size: 18px;
	font-weight: 800;
	letter-spacing: -.01em;
	color: var(--pt-ink);
	background: linear-gradient(transparent 66%, var(--pt-accent) 66%);
}

.o30px .px-rhero__actions {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 12px 20px;
	margin-bottom: 14px;
}

.o30px .px-rhero__secondary {
	font-size: 14.5px;
	font-weight: 700;
	color: var(--pt-ink);
	text-decoration: underline;
	text-underline-offset: 3px;
}

.o30px .px-rhero__under {
	font-size: 14px;
	font-weight: 700;
	color: var(--pt-muted);
}

.o30px .px-rhero__under b {
	color: var(--pt-ink);
}

/* Earnings line — same measure and size as the lead, so it does not run wider. */
.o30px .px-rhero__formula {
	font-size: 17px;
	line-height: 1.55;
	font-weight: 800;
	letter-spacing: -.01em;
	color: var(--pt-ink);
	max-width: none;
	margin: 0 0 10px;
}

.o30px .px-rhero__formula b {
	display: inline;
	background: linear-gradient(transparent 64%, var(--pt-accent) 64%);
	box-decoration-break: clone;
	-webkit-box-decoration-break: clone;
}

.o30px .px-rhero__lead--mob b {
	color: var(--pt-ink);
}

/* Subordinate uplift line + one-line price/quote explanation (brief 2026-09-07 §2). */
.o30px .px-rhero__sub {
	font-size: 15.5px;
	line-height: 1.5;
	font-weight: 700;
	color: var(--pt-ink);
	margin: 0 0 22px;
	max-width: 560px;
}

.o30px .px-rhero__sub-fine {
	display: block;
	margin-top: 4px;
	font-size: 14px;
	font-weight: 600;
	color: var(--pt-muted);
}

.o30px .px-rhero__fine {
	font-size: 14px;
	line-height: 1.45;
	font-weight: 600;
	color: var(--pt-muted);
	margin: 0 0 18px;
}

/* Right hero column: earnings calculator. */
.o30px .px-rhero__side {
	min-width: 0;
}

.o30px .px-points {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin-bottom: 22px;
}

.o30px .px-points span {
	background: #fff;
	border: 1px solid var(--pt-line);
	border-radius: 999px;
	padding: 9px 16px;
	font-size: 14px;
	font-weight: 800;
	letter-spacing: -.01em;
}

/* ---------- Referral calculator ---------- */

.o30px .px-calc {
	padding: 14px 18px 12px;
	border-radius: 16px;
	background: #fff;
	border: 1px solid #ece8e0;
	box-shadow: 0 24px 50px -36px rgba(22, 21, 19, .4);
}

/* Hero calculator — content height only, not stretched to the copy column. */
.o30px .px-calc--hero {
	padding: 22px 22px 18px;
	border: 0;
	background: #161513;
	color: #fff;
	box-shadow: 0 24px 50px -36px rgba(22, 21, 19, .5);
}

.o30px .px-calc--hero .px-calc__title {
	font-size: 26px;
	letter-spacing: -.03em;
	color: #fff;
	margin: 0;
}

.o30px .px-calc--hero .px-calc__head {
	margin-bottom: 6px;
}

.o30px .px-calc--hero .px-calc__punch {
	margin: 0 0 16px;
	font-size: 16px;
	line-height: 1.4;
	font-weight: 700;
	letter-spacing: -.015em;
	color: rgba(255, 255, 255, .72);
}

.o30px .px-calc--hero .px-calc__label {
	color: #fff;
}

.o30px .px-calc--hero .px-calc__min {
	color: rgba(255, 255, 255, .5);
}

.o30px .px-calc--hero .px-calc__num {
	width: 72px;
	background: rgba(255, 255, 255, .06);
	border-color: rgba(255, 255, 255, .16);
	color: #fff;
}

.o30px .px-calc--hero .px-calc__num:focus-visible {
	border-color: var(--pt-accent);
	box-shadow: 0 0 0 3px rgba(223, 255, 128, .22);
}

.o30px .px-calc--hero input[type="range"] {
	height: 10px;
	margin: 10px 0 4px;
	background: linear-gradient(90deg, var(--pt-accent) var(--px-fill), rgba(255, 255, 255, .14) var(--px-fill));
	border-color: transparent;
}

.o30px .px-calc--hero input[type="range"]::-webkit-slider-thumb {
	background: var(--pt-accent);
	border-color: #161513;
	box-shadow: 0 8px 18px -8px rgba(0, 0, 0, .7);
}

.o30px .px-calc--hero input[type="range"]::-moz-range-thumb {
	background: var(--pt-accent);
	border-color: #161513;
	box-shadow: 0 8px 18px -8px rgba(0, 0, 0, .7);
}

.o30px .px-calc--hero input[type="range"]:focus-visible {
	box-shadow: 0 0 0 3px rgba(223, 255, 128, .28);
}

.o30px .px-calc--hero .px-calc__switch {
	background: transparent;
	border-color: rgba(255, 255, 255, .2);
	color: rgba(255, 255, 255, .7);
}

.o30px .px-calc--hero .px-calc__switch:hover {
	color: #fff;
	border-color: rgba(255, 255, 255, .4);
}

.o30px .px-calc--hero .px-calc__switch-track {
	background: rgba(255, 255, 255, .22);
}

.o30px .px-calc--hero .px-calc__switch.is-on,
.o30px .px-calc--hero .px-calc__switch.is-on:hover {
	background: var(--pt-accent);
	border-color: var(--pt-accent);
	color: #161513;
}

.o30px .px-calc--hero .px-calc__results {
	gap: 16px;
	margin-top: 18px;
	padding: 18px 0 4px;
	border-top: 1px solid rgba(255, 255, 255, .1);
}

.o30px .px-calc--hero .px-calc__rlabel {
	color: rgba(255, 255, 255, .5);
	margin-bottom: 4px;
}

.o30px .px-calc--hero .px-calc__big,
.o30px .px-calc--hero .px-calc__big--care {
	font-size: 40px;
	color: #fff;
	background: none;
}

.o30px .px-calc--hero .px-calc__upto {
	color: rgba(255, 255, 255, .45);
}

.o30px .px-calc--hero .px-calc__tag {
	color: rgba(255, 255, 255, .55);
}

.o30px .px-calc--hero .px-calc__split {
	list-style: none;
	margin: 16px 0 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 8px;
}

.o30px .px-calc--hero .px-calc__split li {
	display: grid;
	gap: 3px;
	padding: 12px 10px 10px;
	border-radius: 12px;
	background: rgba(255, 255, 255, .06);
	border: 1px solid rgba(255, 255, 255, .1);
}

.o30px .px-calc--hero .px-calc__split b {
	font-size: 17px;
	font-weight: 800;
	letter-spacing: -.02em;
	color: #fff;
}

.o30px .px-calc--hero .px-calc__split small {
	font-size: 11.5px;
	line-height: 1.3;
	font-weight: 700;
	color: rgba(255, 255, 255, .5);
}

.o30px .px-calc--hero .px-calc__foot {
	margin-top: 16px;
	padding-top: 12px;
	border-top-color: rgba(255, 255, 255, .1);
}

.o30px .px-calc--hero .px-calc__note {
	color: rgba(255, 255, 255, .42);
}

.o30px .px-calc--hero .px-calc__link {
	color: var(--pt-accent);
}

.o30px .px-calc--hero.px-calc--max {
	box-shadow: 0 0 0 1px var(--pt-accent), 0 24px 50px -36px rgba(22, 21, 19, .5);
}

/* Hero cards stay static — no cv-card hover lift. */
.o30v3 .px-calc.cv-card:hover,
.o30v3 .px-margin.cv-card:hover {
	transform: none;
}

/* Still used by the reseller margin panel. */
.o30px .px-calc__kicker {
	display: inline-block;
	font-size: 22px;
	font-weight: 800;
	letter-spacing: -.02em;
	line-height: 1.2;
	text-transform: none;
	color: var(--pt-ink);
	margin-bottom: 16px;
}

.o30px .px-calc__title {
	font-size: 18px;
	font-weight: 800;
	letter-spacing: -.02em;
	line-height: 1.2;
	color: var(--pt-ink);
	margin: 0 0 8px;
}

/* Title row: heading left, Max Mode switch right (brief 2026-09-07 §5). */
.o30px .px-calc__head {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 6px 12px;
	margin: 0 0 8px;
}

.o30px .px-calc__head .px-calc__title {
	margin: 0;
}

/*
 * Max Mode switch — a real role="switch" button. Visible states: off = paper
 * pill with an outlined track; on = ink pill, white text, knob slid right.
 */
.o30px .px-calc__switch {
	appearance: none;
	-webkit-appearance: none;
	display: inline-flex;
	align-items: center;
	gap: 8px;
	min-height: 28px;
	padding: 3px 11px 3px 4px;
	border: 1px solid var(--pt-line);
	border-radius: 999px;
	background: #fff;
	font: inherit;
	font-size: 12.5px;
	font-weight: 800;
	letter-spacing: -.01em;
	line-height: 1;
	color: var(--pt-muted);
	cursor: pointer;
	transition: background .18s ease, color .18s ease, border-color .18s ease;
}

.o30px .px-calc__switch:hover {
	color: var(--pt-ink);
	border-color: #d8d3c9;
}

.o30px .px-calc__switch-track {
	position: relative;
	display: inline-block;
	width: 30px;
	height: 18px;
	border-radius: 999px;
	background: #e6e2d9;
	transition: background .18s ease;
	flex-shrink: 0;
}

.o30px .px-calc__switch-knob {
	position: absolute;
	top: 2px;
	left: 2px;
	width: 14px;
	height: 14px;
	border-radius: 50%;
	background: #fff;
	box-shadow: 0 1px 3px rgba(22, 21, 19, .35);
	transition: transform .18s ease;
}

.o30px .px-calc__switch.is-on,
.o30px .px-calc__switch.is-on:hover {
	background: var(--pt-ink);
	border-color: var(--pt-ink);
	color: #fff;
}

.o30px .px-calc__switch.is-on .px-calc__switch-track {
	background: var(--pt-accent);
}

.o30px .px-calc__switch.is-on .px-calc__switch-knob {
	transform: translateX(12px);
	background: var(--pt-ink);
	box-shadow: none;
}

.o30px .px-calc__switch:focus-visible {
	outline: 2px solid var(--pt-ink);
	outline-offset: 2px;
}

.o30px .px-calc__hint {
	margin: -2px 0 6px;
	font-size: 13px;
	line-height: 1.35;
	font-weight: 700;
	color: var(--pt-muted);
}

.o30px .px-calc__hint[hidden] {
	display: none;
}

.o30px .px-calc__hint b {
	color: var(--pt-ink);
}

/* Max Mode: price controls are set by the scenario and locked. */
.o30px .px-calc__group.is-locked .px-calc__range,
.o30px .px-calc__group.is-locked .px-calc__money {
	opacity: .55;
	pointer-events: none;
}

.o30px .px-calc__group.is-locked .px-calc__min {
	color: var(--pt-ink);
	font-weight: 800;
}

.o30px .px-calc__upto {
	font-size: .62em;
	font-weight: 800;
	letter-spacing: 0;
	color: var(--pt-muted);
	margin-right: 2px;
}

.o30px .px-calc__upto[hidden] {
	display: none;
}

.o30px .px-calc--max .px-calc__big {
	color: var(--pt-ink);
}

.o30px .px-calc--hero.px-calc--max .px-calc__big,
.o30px .px-calc--hero.px-calc--max .px-calc__big--care {
	color: var(--pt-accent);
}

@media (prefers-reduced-motion: reduce) {
	.o30px .px-calc__switch,
	.o30px .px-calc__switch-track,
	.o30px .px-calc__switch-knob,
	.o30px .px-calc__big,
	.o30px .px-calc__breakdown dd {
		transition: none;
	}
}

.o30px .px-calc__group {
	padding: 0;
}

.o30px .px-calc__group + .px-calc__group {
	margin-top: 10px;
	padding-top: 10px;
	border-top: 1px solid var(--pt-line);
}

.o30px .px-calc__addons {
	margin-top: 12px;
	padding-top: 12px;
	border-top: 1px solid var(--pt-line);
	display: grid;
	gap: 6px;
}

.o30px .px-calc__addons-label {
	margin: 0 0 2px;
	font-size: 12.5px;
	font-weight: 700;
	letter-spacing: .02em;
	text-transform: uppercase;
	color: var(--pt-muted);
}

.o30px .px-calc__addon {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	padding: 8px 10px;
	border: 1px solid var(--pt-line);
	border-radius: 10px;
	background: #fff;
	cursor: pointer;
}

.o30px .px-calc__addon input[type="checkbox"] {
	width: 16px;
	height: 16px;
	accent-color: var(--pt-ink);
	flex: 0 0 auto;
}

.o30px .px-calc__addon span {
	display: flex;
	flex-direction: column;
	min-width: 0;
	flex: 1;
}

.o30px .px-calc__addon b {
	font-size: 13.5px;
	font-weight: 800;
	letter-spacing: -.01em;
}

.o30px .px-calc__addon small {
	font-size: 12px;
	font-weight: 600;
	color: var(--pt-muted);
}

.o30px .px-calc__addon--qty {
	cursor: default;
}

.o30px .px-calc__qty {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	flex: 0 0 auto;
}

.o30px .px-calc__qty button {
	width: 28px;
	height: 28px;
	border: 1px solid var(--pt-line);
	border-radius: 8px;
	background: #faf8f3;
	font-weight: 800;
	cursor: pointer;
}

.o30px .px-calc__qty input {
	width: 36px;
	border: 0;
	background: transparent;
	text-align: center;
	font: inherit;
	font-weight: 800;
}

.o30px .px-calc__care {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 6px;
	margin-top: 4px;
}

.o30px .px-calc__care label {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	padding: 8px 6px;
	border: 1px solid var(--pt-line);
	border-radius: 10px;
	font-size: 13px;
	font-weight: 700;
	cursor: pointer;
}

.o30px .px-calc__care label.is-on {
	border-color: var(--pt-ink);
	background: #161513;
	color: #fff;
}

.o30px .px-calc__addons.is-locked {
	opacity: .72;
	pointer-events: none;
}

.o30px .px-calc__label {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	font-size: 14.5px;
	font-weight: 800;
	letter-spacing: -.01em;
	margin-bottom: 6px;
}

.o30px .px-calc__lwrap {
	display: flex;
	flex-direction: column;
	gap: 1px;
	min-width: 0;
}

.o30px .px-calc__min {
	font-size: 13px;
	line-height: 1.3;
	font-weight: 600;
	color: var(--pt-muted);
}

.o30px .px-calc__range,
.o30px .px-calc input[type="range"] {
	--px-fill: 0%;
	-webkit-appearance: none;
	appearance: none;
	width: 100%;
	height: 8px;
	margin: 6px 0 4px;
	border-radius: 999px;
	background: linear-gradient(90deg, var(--pt-ink) var(--px-fill), #efece4 var(--px-fill));
	border: 1px solid var(--pt-line);
	outline: none;
	cursor: pointer;
	display: block;
}

.o30px .px-calc input[type="range"]::-webkit-slider-thumb {
	-webkit-appearance: none;
	appearance: none;
	width: 22px;
	height: 22px;
	border-radius: 50%;
	background: var(--pt-ink);
	border: 3px solid #fff;
	box-shadow: 0 6px 16px -6px rgba(22, 21, 19, .55);
	cursor: grab;
}

.o30px .px-calc input[type="range"]::-moz-range-thumb {
	width: 18px;
	height: 18px;
	border-radius: 50%;
	background: var(--pt-ink);
	border: 3px solid #fff;
	box-shadow: 0 6px 16px -6px rgba(22, 21, 19, .55);
	cursor: grab;
}

.o30px .px-calc input[type="range"]:focus-visible {
	box-shadow: 0 0 0 3px rgba(22, 21, 19, .25);
}

.o30px .px-calc__results {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 12px;
	margin-top: 10px;
	padding-top: 10px;
	border-top: 1px solid var(--pt-line);
}

.o30px .px-calc__res {
	display: grid;
	gap: 2px;
	min-width: 0;
}

.o30px .px-calc__foot {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 6px 14px;
	margin-top: 10px;
	padding-top: 8px;
	border-top: 1px solid var(--pt-line);
}

.o30px .px-calc__note {
	margin-top: 12px;
	font-size: 13px;
	line-height: 1.4;
	color: var(--pt-muted);
}

.o30px .px-calc__foot .px-calc__note {
	margin: 0;
}

.o30px .px-calc__link {
	display: inline-block;
	flex-shrink: 0;
	margin: 0;
	font-size: 13.5px;
	font-weight: 700;
	white-space: nowrap;
	color: var(--pt-ink);
	text-decoration: underline;
	text-underline-offset: 3px;
}

/* --- Two-input calculator: builds × proposed price (2026-09-07) --- */

.o30px .screen-reader-text {
	position: absolute !important;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

.o30px .px-calc__label label {
	font-weight: 800;
	cursor: pointer;
}

.o30px .px-calc__num {
	width: 68px;
	padding: 6px 10px;
	border: 1px solid var(--pt-line);
	border-radius: 9px;
	background: #fff;
	font: inherit;
	font-size: 15px;
	line-height: 1.2;
	font-weight: 800;
	color: var(--pt-ink);
	text-align: right;
	-moz-appearance: textfield;
	appearance: textfield;
}

.o30px .px-calc__num::-webkit-outer-spin-button,
.o30px .px-calc__num::-webkit-inner-spin-button {
	-webkit-appearance: none;
	margin: 0;
}

.o30px .px-calc__num:focus-visible {
	outline: none;
	border-color: var(--pt-ink);
	box-shadow: 0 0 0 3px rgba(22, 21, 19, .15);
}

.o30px .px-calc__money {
	display: inline-flex;
	align-items: center;
	gap: 2px;
}

.o30px .px-calc__money i {
	font-style: normal;
	font-weight: 800;
	font-size: 16px;
	color: var(--pt-soft);
}

.o30px .px-calc__num--price {
	width: 104px;
}

.o30px .px-calc.is-invalid .px-calc__num--price {
	border-color: #c2410c;
	box-shadow: 0 0 0 3px rgba(194, 65, 12, .15);
}

.o30px .px-calc__error {
	margin: 4px 0 0;
	font-size: 13px;
	font-weight: 700;
	line-height: 1.4;
	color: #c2410c;
}

.o30px .px-calc__rlabel {
	display: block;
	font-size: 11.5px;
	font-weight: 800;
	letter-spacing: .06em;
	text-transform: uppercase;
	color: var(--pt-soft);
}

.o30px .px-calc__big {
	display: inline-block;
	justify-self: start;
	font-size: 28px;
	line-height: 1.1;
	font-weight: 800;
	letter-spacing: -.03em;
	white-space: nowrap;
	background: linear-gradient(transparent 66%, var(--pt-accent) 66%);
	transition: opacity .15s;
}

.o30px .px-calc__big--care {
	background: none;
}

.o30px .px-calc.is-invalid .px-calc__big,
.o30px .is-invalid .px-calc__breakdown dd {
	opacity: .45;
}

.o30px .px-calc__tag {
	display: block;
	font-size: 13px;
	line-height: 1.35;
	font-weight: 600;
	color: var(--pt-muted);
}

/* Per-build breakdown — lives under #earnings, driven by the same JS. */
.o30px .px-calc__breakdown {
	margin: 0;
	display: grid;
	gap: 8px;
}

.o30px .px-calc__breakdown div {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	gap: 16px;
	font-size: 14.5px;
	line-height: 1.45;
}

.o30px .px-calc__breakdown dt {
	color: var(--pt-muted);
	font-weight: 600;
}

.o30px .px-calc__breakdown dd {
	margin: 0;
	font-weight: 800;
	white-space: nowrap;
	transition: opacity .15s;
}

.o30px .px-earn__calc:not(.is-detailed) .px-bd-detail,
.o30px .px-earn__calc.is-detailed .px-bd-simple {
	display: none;
}

.o30px .px-calc__breakdown .px-bd-per,
.o30px .px-calc__breakdown .px-bd-total,
.o30px .px-calc__breakdown .px-bd-care {
	padding-top: 8px;
	border-top: 1px solid var(--pt-line);
}

.o30px .px-calc__breakdown .px-bd-simple dt,
.o30px .px-calc__breakdown .px-bd-simple dd,
.o30px .px-calc__breakdown .px-bd-total dt,
.o30px .px-calc__breakdown .px-bd-total dd {
	color: var(--pt-ink);
	font-weight: 800;
}

.o30px .px-calc__breakdown .px-bd-simple dd,
.o30px .px-calc__breakdown .px-bd-total dd {
	font-size: 18px;
	background: linear-gradient(transparent 66%, var(--pt-accent) 66%);
}

/* ---------- 3 previews — the partner's strongest tool ---------- */

.o30px .px-power-wrap {
	background: var(--pt-ink);
	color: #fff;
	border-top: 0;
	border-bottom: 0;
	position: relative;
	overflow: hidden;
}

.o30px .px-power-wrap::before {
	content: "";
	position: absolute;
	inset: auto -20% -40% auto;
	width: 60%;
	aspect-ratio: 1;
	border-radius: 50%;
	background: radial-gradient(closest-side, rgba(230, 255, 138, .16), transparent 70%);
	pointer-events: none;
}

.o30px .px-power {
	position: relative;
	display: grid;
	grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
	gap: 56px;
	align-items: center;
}

.o30px .px-power .pt-eyebrow {
	color: var(--pt-ink);
}

.o30px .px-power h2 {
	font-size: 44px;
	line-height: 1.06;
	letter-spacing: -.035em;
	font-weight: 800;
	margin: 0 0 18px;
	color: #fff;
}

.o30px .px-power h2 .px-mark {
	background: linear-gradient(transparent 64%, rgba(230, 255, 138, .38) 64%);
}

.o30px .px-power__lead {
	font-size: 18px;
	line-height: 1.55;
	color: rgba(255, 255, 255, .78);
	margin: 0 0 14px;
}

.o30px .px-power__punch {
	font-size: 18px;
	line-height: 1.45;
	color: #fff;
	margin: 0 0 26px;
}

.o30px .px-power__facts {
	list-style: none;
	margin: 0 0 28px;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 14px;
}

.o30px .px-power__facts li {
	padding: 16px 16px 14px;
	border-radius: 14px;
	background: rgba(255, 255, 255, .06);
	border: 1px solid rgba(255, 255, 255, .12);
}

.o30px .px-power__facts b {
	display: block;
	font-size: 40px;
	line-height: 1;
	font-weight: 800;
	letter-spacing: -.04em;
	color: var(--pt-accent);
	margin-bottom: 8px;
}

.o30px .px-power__facts span {
	display: block;
	font-size: 13px;
	line-height: 1.35;
	font-weight: 700;
	color: rgba(255, 255, 255, .82);
}

.o30px .px-power__actions {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 14px 22px;
}

.o30px .px-power__actions .pt-cta--dark,
.o30px .px-power__actions a.pt-cta--dark:is(:link, :visited, :hover, :active, :focus, :focus-visible) {
	background: #fff !important;
	background-color: #fff !important;
	color: var(--pt-ink) !important;
	border-color: #fff !important;
}

.o30px .px-power__actions .pt-cta--dark:hover,
.o30px .px-power__actions a.pt-cta--dark:is(:hover, :active, :focus, :focus-visible) {
	background: var(--pt-accent) !important;
	background-color: var(--pt-accent) !important;
	border-color: var(--pt-accent) !important;
	color: var(--pt-ink) !important;
}

.o30px .px-power__actions .px-rhero__secondary {
	color: #fff;
}

.o30px .px-power__visual {
	margin: 0;
	border-radius: 20px;
	background: #fff;
	color: var(--pt-ink);
	box-shadow: 0 40px 90px -40px rgba(0, 0, 0, .7);
	overflow: hidden;
	transform: none;
}

.o30px .px-power__visual:hover {
	transform: none;
}

.o30px .px-power__bar {
	display: flex;
	align-items: center;
	gap: 14px;
	padding: 12px 16px;
	border-bottom: 1px solid var(--pt-line);
	background: var(--pt-paper);
	font-size: 12.5px;
	font-weight: 700;
	color: var(--pt-muted);
}

.o30px .px-power__dots {
	display: inline-flex;
	gap: 5px;
}

.o30px .px-power__dots i {
	width: 9px;
	height: 9px;
	border-radius: 50%;
	background: #ddd8cd;
}

.o30px .px-power__for {
	flex: 1;
	min-width: 0;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.o30px .px-power__for b {
	color: var(--pt-ink);
}

.o30px .px-power__pill {
	padding: 4px 10px;
	border-radius: 999px;
	background: var(--pt-ink);
	color: var(--pt-accent);
	font-size: 11px;
	font-weight: 800;
	letter-spacing: .06em;
	text-transform: uppercase;
	white-space: nowrap;
}

.o30px .px-power__dirs {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 12px;
	padding: 16px;
	background: #f1eee7;
}

.o30px .px-power__dir {
	position: relative;
	border-radius: 10px;
	overflow: hidden;
	background: #fff;
	box-shadow: 0 10px 24px -14px rgba(22, 21, 19, .45);
}

.o30px .px-power__dir img {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 4 / 5;
	object-fit: cover;
	object-position: top;
}

.o30px .px-power__num {
	position: absolute;
	top: 8px;
	left: 8px;
	padding: 3px 8px;
	border-radius: 999px;
	background: rgba(22, 21, 19, .85);
	color: #fff;
	font-size: 11px;
	font-weight: 800;
	letter-spacing: .06em;
}

.o30px .px-power__dir em {
	display: block;
	padding: 8px 10px;
	font-style: normal;
	font-size: 12px;
	font-weight: 700;
	color: var(--pt-muted);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.o30px .px-power__cap {
	padding: 14px 16px 16px;
	display: grid;
	gap: 4px;
}

.o30px .px-power__cap span {
	font-size: 14px;
	font-weight: 700;
	color: var(--pt-ink);
}

.o30px .px-power__cap small {
	font-size: 12px;
	line-height: 1.45;
	color: var(--pt-soft);
}

/* ---------- How your earnings work ---------- */

.o30px .px-earn {
	display: grid;
	grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
	gap: 24px;
	align-items: start;
}

.o30px .px-earn__steps {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	gap: 14px;
}

.o30px .px-earn__steps li {
	display: grid;
	grid-template-columns: 40px minmax(0, 1fr);
	column-gap: 16px;
	padding: 22px 24px;
}

.o30px .px-earn__steps .pe-step__num {
	grid-row: 1 / span 2;
	font-family: 'Inter', monospace;
	font-size: 13px;
	font-weight: 800;
	color: var(--pt-soft);
	padding-top: 4px;
}

.o30px .px-earn__steps h3 {
	margin: 0 0 6px;
	font-size: 19px;
	letter-spacing: -.02em;
	font-weight: 800;
}

.o30px .px-earn__steps p {
	margin: 0;
	font-size: 15px;
	line-height: 1.55;
	color: var(--pt-muted);
}

.o30px .px-earn__example {
	padding: 26px 26px 24px;
	background: var(--pt-ink);
	color: #fff;
	border-color: var(--pt-ink);
	position: sticky;
	top: 96px;
}

.o30v3 .px-earn__example.cv-card:hover {
	transform: none;
}

.o30px .px-earn__kicker {
	font-size: 12px;
	font-weight: 800;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: var(--pt-accent);
	margin-bottom: 12px;
}

.o30px .px-earn__line {
	margin: 0 0 6px;
	font-size: 16px;
	line-height: 1.5;
	color: rgba(255, 255, 255, .82);
}

.o30px .px-earn__line b {
	color: #fff;
}

.o30px .px-earn__line--big {
	font-size: 18px;
	margin: 10px 0 2px;
}

.o30px .px-earn__line--big b {
	font-size: 34px;
	letter-spacing: -.03em;
	background: linear-gradient(transparent 66%, rgba(230, 255, 138, .45) 66%);
}

.o30px .px-earn__sub {
	margin: 0 0 16px;
	font-size: 13px;
	color: rgba(255, 255, 255, .6);
}

.o30px .px-earn__split {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 8px;
	margin: 0 0 16px;
}

.o30px .px-earn__split span {
	display: grid;
	gap: 3px;
	padding: 10px 10px 9px;
	border-radius: 10px;
	background: rgba(255, 255, 255, .07);
	border: 1px solid rgba(255, 255, 255, .12);
}

.o30px .px-earn__split b {
	font-size: 16px;
	font-weight: 800;
	letter-spacing: -.02em;
	white-space: nowrap;
}

.o30px .px-earn__split small {
	font-size: 11px;
	line-height: 1.3;
	color: rgba(255, 255, 255, .6);
	font-weight: 700;
}

.o30px .px-earn__scope {
	max-width: 860px;
	margin: 28px auto 0;
	font-size: 13.5px;
	line-height: 1.6;
	color: var(--pt-muted);
	text-align: center;
}

/* "How the number is calculated" — moved out of the hero card (brief §10). */
.o30px .px-earn__calc {
	max-width: 860px;
	margin: 24px auto 0;
	padding: 24px 26px;
}

.o30v3 .px-earn__calc.cv-card:hover {
	transform: none;
}

.o30px .px-earn__calc-head {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	justify-content: space-between;
	gap: 6px 20px;
	margin-bottom: 14px;
	padding-bottom: 12px;
	border-bottom: 1px solid var(--pt-line);
}

.o30px .px-earn__calc-head h3 {
	margin: 0;
	font-size: 18px;
	font-weight: 800;
	letter-spacing: -.02em;
}

.o30px .px-earn__calc-head p {
	margin: 0;
	font-size: 14.5px;
	color: var(--pt-muted);
}

.o30px .px-earn__calc-head p b {
	color: var(--pt-ink);
}

.o30px .px-earn__notes {
	list-style: none;
	max-width: 860px;
	margin: 22px auto 0;
	padding: 0;
	display: grid;
	gap: 8px;
}

.o30px .px-earn__notes li {
	font-size: 14px;
	line-height: 1.55;
	color: var(--pt-muted);
	padding-left: 18px;
	position: relative;
}

.o30px .px-earn__notes li::before {
	content: '';
	position: absolute;
	left: 0;
	top: 8px;
	width: 7px;
	height: 7px;
	border-radius: 50%;
	background: var(--pt-accent);
	border: 1px solid var(--pt-ink);
}

.o30px .px-earn__notes b {
	color: var(--pt-ink);
}

/* ---------- More ways to serve your clients ---------- */

.o30px .px-more {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 20px;
	max-width: 920px;
	margin: 0 auto;
}

.o30px .px-more--3 {
	grid-template-columns: repeat(3, minmax(0, 1fr));
	max-width: 1080px;
}

.o30px .px-more__card {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	padding: 26px 28px 24px;
}

.o30px .px-more__card h3 {
	font-size: 22px;
	font-weight: 800;
	letter-spacing: -.02em;
	margin: 0 0 6px;
}

.o30px .px-more__short {
	font-size: 15px;
	line-height: 1.5;
	color: var(--pt-muted);
	margin: 0 0 16px;
}

.o30px .px-more__price {
	display: grid;
	gap: 3px;
	margin: 0 0 18px;
	padding: 12px 14px;
	border-radius: 12px;
	background: var(--pt-paper);
	border: 1px solid var(--pt-line);
	align-self: stretch;
}

.o30px .px-more__price b {
	font-size: 17px;
	font-weight: 800;
	letter-spacing: -.01em;
}

.o30px .px-more__price span {
	font-size: 13.5px;
	line-height: 1.4;
	font-weight: 600;
	color: var(--pt-muted);
}

.o30px .px-more__link {
	margin-top: auto;
	font-size: 14.5px;
	font-weight: 700;
	color: var(--pt-ink);
	text-decoration: underline;
	text-underline-offset: 3px;
}

.o30px .px-more__note {
	max-width: 720px;
	margin: 22px auto 0;
	text-align: center;
	font-size: 14px;
	line-height: 1.55;
	color: var(--pt-muted);
}

/* ---------- Mobile folds (brief §11) ---------- */

/*
 * <details class="px-fold" data-px-fold open> renders open; the summary is
 * hidden on desktop so the content reads as a normal block. ≤700px the JS
 * removes `open` and the summary becomes an accordion header.
 */
.o30px .px-fold {
	display: block;
}

.o30px .px-fold__sum {
	display: none;
}

.o30px .px-criteria__fold {
	grid-column: 1 / -1;
}

.o30px .px-criteria__fold .px-fold__body {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 16px;
}

.o30px .px-previews__fold {
	flex: 1;
	min-width: 0;
}

.o30px .px-attr__fold {
	flex: 1;
	min-width: 0;
}

@media (max-width: 700px) {
	.o30px .px-fold__sum {
		display: flex;
		align-items: center;
		justify-content: space-between;
		gap: 12px;
		min-height: 48px;
		padding: 12px 16px;
		border: 1px solid var(--pt-line);
		border-radius: 12px;
		background: #fff;
		font-size: 15px;
		font-weight: 800;
		letter-spacing: -.01em;
		color: var(--pt-ink);
		cursor: pointer;
		list-style: none;
	}
	.o30px .px-fold__sum::-webkit-details-marker { display: none; }
	.o30px .px-fold__sum .cv-plus {
		font-size: 20px;
		line-height: 1;
		font-weight: 600;
		transition: transform .2s;
	}
	.o30px .px-fold[open] .px-fold__sum { border-color: var(--pt-ink); }
	.o30px .px-fold[open] .px-fold__sum .cv-plus { transform: rotate(45deg); }
	.o30px .px-fold[open] > .px-fold__body { margin-top: 12px; }
	.o30px .px-criteria__fold .px-fold__body { grid-template-columns: 1fr; }
	.o30px .px-previews .px-fold__sum { background: var(--pt-paper); }
}

/* ---------- Commission timing ---------- */

.o30px .px-timing {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 16px;
}

.o30px .px-pay {
	padding: 24px 22px;
}

.o30px .px-pay__label {
	font-size: 12.5px;
	font-weight: 800;
	letter-spacing: .07em;
	text-transform: uppercase;
	color: var(--pt-muted);
	margin-bottom: 12px;
}

.o30px .px-pay b {
	display: block;
	font-size: 38px;
	font-weight: 800;
	letter-spacing: -.03em;
	margin-bottom: 10px;
}

.o30px .px-pay p {
	font-size: 14.5px;
	line-height: 1.55;
	color: var(--pt-muted);
}

.o30px .px-pay--care {
	background: #161513;
	border-color: #161513;
	color: #fff;
}

.o30px .px-pay--care .px-pay__label {
	color: #c9c5c5;
}

.o30px .px-pay--care b {
	color: var(--pt-accent);
}

.o30px .px-pay--care p {
	color: #b6b0a4;
}

/* ---------- Prospect criteria ---------- */

.o30px .px-criteria {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 16px;
}

.o30px .px-criteria article {
	padding: 24px 22px;
}

.o30px .px-criteria h3 {
	font-size: 18px;
	font-weight: 800;
	letter-spacing: -.02em;
	margin-bottom: 8px;
}

.o30px .px-criteria p {
	font-size: 14.5px;
	line-height: 1.55;
	color: var(--pt-muted);
}

.o30px .px-criteria__combo {
	text-align: center;
	max-width: 680px;
	margin: 28px auto 0;
	font-size: 16px;
	line-height: 1.55;
	color: var(--pt-muted);
}

.o30px .px-criteria__combo b {
	color: var(--pt-ink);
}

/* How-it-works cards on /partners/referral/ — product mocks, payoff card. */
.o30px .pe-steps {
	align-items: stretch;
}
.o30px--ref .pe-steps {
	grid-template-columns: repeat(5, minmax(0, 1fr));
}
@media (max-width: 1100px) {
	.o30px--ref .pe-steps { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 720px) {
	.o30px--ref .pe-steps { grid-template-columns: 1fr; }
}

.o30px .pe-step {
	display: flex;
	flex-direction: column;
	padding: 22px 20px 18px;
	transition: transform .18s ease, box-shadow .18s ease;
}

.o30px .pe-step:hover {
	transform: translateY(-3px);
	box-shadow: 0 22px 40px -28px rgba(22, 21, 19, .45);
}

.o30px .pe-step__num {
	color: var(--pt-ink);
	letter-spacing: .04em;
}

.o30px .pe-step__kicker {
	color: var(--pt-ink);
}

.o30px .pe-step .pe-mini {
	margin-top: auto;
	background: #161513;
	border-color: transparent;
	color: #fff;
}

.o30px .pe-step .pe-mini--map span {
	background: rgba(255, 255, 255, .08);
	border-color: transparent;
	color: rgba(255, 255, 255, .7);
}

.o30px .pe-step .pe-mini--map b {
	color: #fff;
}

.o30px .pe-step .pe-mini--map em {
	background: var(--pt-accent);
	color: #161513;
}

.o30px .pe-mini--dirs .pe-mini__dirs {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 6px;
	margin-bottom: 10px;
}

.o30px .pe-mini--dirs .pe-mini__dirs span {
	display: flex;
	align-items: flex-end;
	aspect-ratio: 5 / 3;
	padding: 5px 6px;
	border-radius: 8px;
	background: #2a2926;
	color: #fff;
	font-size: 11px;
	font-weight: 800;
	letter-spacing: .02em;
}

.o30px .pe-mini--dirs em {
	width: 100%;
	background: var(--pt-accent);
	color: #161513;
}

.o30px .pe-step .pe-mini--send em {
	background: rgba(255, 255, 255, .1);
	color: #fff;
}

.o30px .pe-step .pe-mini--send em.is-ghost {
	background: var(--pt-accent);
	color: #161513;
	border-color: transparent;
}

.o30px .pe-step--pay {
	background: #161513;
	color: #fff;
	border: 0;
	box-shadow: 0 24px 50px -36px rgba(22, 21, 19, .55);
}

.o30px .pe-step--pay:hover {
	box-shadow: 0 28px 54px -32px rgba(22, 21, 19, .65);
}

.o30px .pe-step--pay .pe-step__num {
	color: rgba(255, 255, 255, .45);
}

.o30px .pe-step--pay .pe-step__kicker {
	color: var(--pt-accent);
}

.o30px .pe-step--pay h3 {
	color: #fff;
}

.o30px .pe-step--pay p {
	color: rgba(255, 255, 255, .68);
}

.o30px .pe-mini--pay {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 6px;
	background: rgba(255, 255, 255, .06);
	padding: 10px;
}

.o30px .pe-mini--pay span {
	display: grid;
	gap: 2px;
	padding: 8px 6px 7px;
	border-radius: 8px;
	background: rgba(255, 255, 255, .06);
	text-align: center;
}

.o30px .pe-mini--pay b {
	font-size: 14px;
	font-weight: 800;
	letter-spacing: -.02em;
	color: var(--pt-accent);
}

.o30px .pe-mini--pay small {
	font-size: 10.5px;
	font-weight: 700;
	color: rgba(255, 255, 255, .5);
}

/* One-line qualification + first-website note under the 4 steps (brief 2026-09-07 §7). */
.o30px .px-how__note {
	text-align: center;
	max-width: 680px;
	margin: 28px auto 0;
	font-size: 16px;
	line-height: 1.55;
	color: var(--pt-muted);
}

/* Five signals in one row (consolidated prospect section). */
.o30px .px-criteria--5 {
	grid-template-columns: repeat(5, minmax(0, 1fr));
	gap: 14px;
}

.o30px .px-criteria--5 article {
	padding: 22px 18px;
}

.o30px .px-criteria--5 h3 {
	font-size: 16.5px;
}

.o30px .px-criteria--5 p {
	font-size: 14px;
}

/* ---------- Warm-first ---------- */

/* Sub-block inside the prospect section. */
.o30px .px-warm-wrap {
	margin-top: 44px;
	padding-top: 40px;
	border-top: 1px solid var(--pt-line);
}

.o30px .px-warm__title {
	text-align: center;
	font-size: 20px;
	font-weight: 800;
	letter-spacing: -.02em;
	margin: 0 0 22px;
}

.o30px .px-warm {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 14px;
	max-width: 860px;
	margin: 0 auto;
}

/* ---------- Partner Hub (previews + attribution + workspace) ---------- */

.o30px .px-hub {
	display: grid;
	grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr);
	gap: 24px;
	align-items: start;
}

.o30px .px-hub__dash {
	margin: 0;
	max-width: none;
}

.o30px .px-hub__facts {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	gap: 14px;
}

.o30px .px-hub__facts li {
	padding: 22px 24px;
	display: grid;
	gap: 6px;
}

.o30px .px-hub__facts b {
	font-size: 18px;
	font-weight: 800;
	letter-spacing: -.02em;
	color: var(--pt-ink);
}

.o30px .px-hub__facts span {
	font-size: 14.5px;
	line-height: 1.55;
	color: var(--pt-muted);
}

.o30px .px-warm blockquote {
	margin: 0;
	padding: 20px 22px;
	font-size: 15.5px;
	line-height: 1.5;
	font-weight: 600;
	color: var(--pt-ink);
	position: relative;
}

.o30px .px-warm blockquote::before {
	content: '';
	display: inline-block;
	width: 9px;
	height: 9px;
	border-radius: 50%;
	background: var(--pt-accent);
	border: 1px solid var(--pt-ink);
	margin-right: 10px;
	vertical-align: 1px;
}

.o30px .px-warm__rule {
	text-align: center;
	margin: 28px auto 0;
	font-size: 20px;
	font-weight: 800;
	letter-spacing: -.02em;
}

/* ---------- 30 previews ---------- */

.o30px .px-previews {
	max-width: 680px;
	margin: 0 auto;
	padding: 26px 28px;
	display: flex;
	gap: 26px;
	align-items: center;
}

.o30px .px-previews__chip {
	flex-shrink: 0;
	background: var(--pt-ink);
	color: #fff;
	border-radius: 14px;
	padding: 16px 20px;
	text-align: center;
}

.o30px .px-previews__chip span {
	display: block;
	font-size: 11px;
	font-weight: 800;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: #9c968a;
	margin-bottom: 4px;
}

.o30px .px-previews__chip b {
	font-size: 17px;
	font-weight: 800;
	color: var(--pt-accent);
	white-space: nowrap;
}

.o30px .px-previews ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

.o30px .px-previews li {
	padding: 8px 0;
	font-size: 15.5px;
	line-height: 1.5;
	color: var(--pt-muted);
	border-bottom: 1px solid var(--pt-line);
}

.o30px .px-previews li:first-child {
	color: var(--pt-ink);
	font-weight: 700;
}

.o30px .px-previews li:last-child {
	border-bottom: 0;
}

/* ---------- Attribution ---------- */

.o30px .px-attr {
	display: flex;
	gap: 30px;
	align-items: flex-start;
	justify-content: center;
	max-width: 780px;
	margin: 0 auto;
}

.o30px .px-attr__badge {
	flex-shrink: 0;
	background: var(--pt-ink);
	color: #fff;
	border-radius: 18px;
	padding: 22px 26px;
	text-align: center;
}

.o30px .px-attr__badge b {
	display: block;
	font-size: 30px;
	font-weight: 800;
	letter-spacing: -.02em;
	color: var(--pt-accent);
	white-space: nowrap;
}

.o30px .px-attr__badge span {
	display: block;
	margin-top: 2px;
	font-size: 12.5px;
	font-weight: 800;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: #9c968a;
}

.o30px .px-attr .pe-trust {
	margin: 0;
}

.o30px .px-attr__terms {
	text-align: center;
	margin-top: 24px;
	font-size: 15px;
	font-weight: 700;
}

.o30px .px-attr__terms a {
	color: var(--pt-ink);
}

/* ---------- Upgrade / downgrade path ---------- */

.o30px .px-upgrade {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 26px;
	padding: 28px 32px;
	max-width: 920px;
	margin: 0 auto;
}

.o30px .px-upgrade h3 {
	font-size: 21px;
	font-weight: 800;
	letter-spacing: -.02em;
	margin-bottom: 6px;
}

.o30px .px-upgrade p {
	font-size: 15px;
	line-height: 1.5;
	color: var(--pt-muted);
}

.o30px .px-upgrade .pt-cta {
	flex-shrink: 0;
}

/* ---------- Reseller: margin panel ---------- */

.o30px .px-margin {
	padding: 28px;
	border-radius: 22px;
}

.o30px .px-margin__rows {
	border-top: 1px solid var(--pt-line);
	margin-bottom: 18px;
}

.o30px .px-margin__row {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 14px;
	padding: 16px 0;
	border-bottom: 1px solid var(--pt-line);
}

.o30px .px-margin__row span {
	font-size: 14px;
	font-weight: 700;
	color: var(--pt-soft);
}

.o30px .px-margin__row b {
	font-size: 17px;
	font-weight: 800;
	letter-spacing: -.01em;
	text-align: right;
}

.o30px .px-margin__row--hi b {
	background: linear-gradient(transparent 62%, var(--pt-accent) 62%);
}

.o30px .px-margin__line {
	font-size: 20px;
	font-weight: 800;
	letter-spacing: -.02em;
	margin-bottom: 8px;
}

/* ---------- Reseller: you / 1to30 ---------- */

.o30px .px-own {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 20px;
	max-width: 920px;
	margin: 0 auto;
}

.o30px .px-own__col {
	padding: 28px 30px;
}

.o30px .px-own__label {
	font-size: 12px;
	font-weight: 800;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var(--pt-muted);
	margin-bottom: 14px;
}

.o30px .px-own__col ul,
.o30px .px-fit ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

.o30px .px-own__col li,
.o30px .px-fit li {
	padding: 10px 0 10px 26px;
	font-size: 15.5px;
	font-weight: 600;
	border-bottom: 1px solid var(--pt-line);
	position: relative;
}

.o30px .px-own__col li::before,
.o30px .px-fit li::before {
	content: '';
	position: absolute;
	left: 0;
	top: 18px;
	width: 9px;
	height: 9px;
	border-radius: 50%;
	background: var(--pt-accent);
	border: 1px solid var(--pt-ink);
}

.o30px .px-own__col li:last-child,
.o30px .px-fit li:last-child {
	border-bottom: 0;
}

.o30px .px-own__col--ink {
	background: #161513;
	border-color: #161513;
	color: #fff;
}

.o30px .px-own__col--ink .px-own__label {
	color: #9c968a;
}

.o30px .px-own__col--ink li {
	border-bottom-color: rgba(255, 255, 255, .1);
}

/* ---------- Reseller: white-label ---------- */

.o30px .px-wl {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 20px;
	max-width: 920px;
	margin: 0 auto;
}

.o30px .px-wl__card {
	padding: 24px 26px;
}

.o30px .px-wl__tag {
	display: inline-block;
	font-size: 11.5px;
	font-weight: 800;
	letter-spacing: .09em;
	text-transform: uppercase;
	color: var(--pt-muted);
	background: var(--pt-paper);
	border: 1px solid var(--pt-line);
	border-radius: 999px;
	padding: 5px 11px;
	margin-bottom: 16px;
}

.o30px .px-wl__bar {
	display: flex;
	align-items: center;
	gap: 6px;
	background: #fff;
	border: 1px solid var(--pt-line);
	border-radius: 10px;
	padding: 9px 12px;
	margin-bottom: 14px;
}

.o30px .px-wl__bar i {
	width: 7px;
	height: 7px;
	border-radius: 50%;
	background: #e7e2d7;
}

.o30px .px-wl__bar span {
	flex: 1;
	font-size: 12.5px;
	font-weight: 700;
	color: var(--pt-muted);
	margin-left: 4px;
	word-break: break-all;
}

.o30px .px-wl__brand {
	font-size: 15px;
	font-weight: 700;
	color: var(--pt-muted);
	margin-bottom: 10px;
}

.o30px .px-wl__brand b {
	font-size: 17px;
	color: var(--pt-ink);
}

.o30px .px-wl__card p {
	font-size: 14.5px;
	line-height: 1.55;
	color: var(--pt-muted);
}

.o30px .px-wl__card--ink {
	background: #161513;
	border-color: #161513;
	color: #fff;
}

.o30px .px-wl__card--ink .px-wl__tag {
	background: transparent;
	border-color: rgba(255, 255, 255, .22);
	color: #c9c5c5;
}

.o30px .px-wl__card--ink .px-wl__bar {
	background: #22201c;
	border-color: #3a352e;
}

.o30px .px-wl__card--ink .px-wl__bar span {
	color: #b6b0a4;
}

.o30px .px-wl__card--ink .px-wl__brand {
	color: #9c968a;
}

.o30px .px-wl__card--ink .px-wl__brand b {
	color: var(--pt-accent);
}

.o30px .px-wl__card--ink p {
	color: #b6b0a4;
}

/* ---------- Reseller: fit card + trust ---------- */

.o30px .px-fit {
	max-width: 620px;
	margin: 30px auto 0;
	padding: 26px 30px;
}

.o30px .px-trustq {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 16px;
	max-width: 920px;
	margin: 0 auto;
}

.o30px .px-trustq article {
	padding: 26px 24px;
	text-align: center;
}

.o30px .px-trustq span {
	display: block;
	font-size: 14px;
	font-weight: 700;
	color: var(--pt-muted);
	margin-bottom: 10px;
}

.o30px .px-trustq b {
	font-size: 28px;
	font-weight: 800;
	letter-spacing: -.02em;
	background: linear-gradient(transparent 62%, var(--pt-accent) 62%);
}

.o30px .px-trustq__note {
	text-align: center;
	max-width: 680px;
	margin: 26px auto 0;
	font-size: 15.5px;
	line-height: 1.6;
	color: var(--pt-muted);
}

.o30px .px-trustq__note b {
	color: var(--pt-ink);
}

.o30px .px-trustq__note a {
	color: var(--pt-ink);
	font-weight: 700;
}

/* ---------- Reseller: workflow ---------- */

.o30px .px-flow {
	list-style: none;
	margin: 0 auto;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 10px;
	max-width: 1000px;
}

.o30px .px-flow li {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	background: #fff;
	border: 1px solid var(--pt-line);
	border-radius: 999px;
	padding: 12px 18px;
	font-size: 14.5px;
	font-weight: 700;
	position: relative;
}

.o30px .px-flow li span {
	font-family: 'Inter', monospace;
	font-size: 11px;
	font-weight: 800;
	color: var(--pt-soft);
}

.o30px .px-flow li:not(:last-child)::after {
	content: '→';
	margin-left: 4px;
	margin-right: -6px;
	color: var(--pt-soft);
	font-weight: 800;
}

.o30px .px-flow li:last-child {
	background: var(--pt-ink);
	color: #fff;
}

.o30px .px-flow li:last-child span {
	color: var(--pt-accent);
}

/* ---------- Motion ---------- */

.o30px.js-px-motion .px-track,
.o30px.js-px-motion .px-pay,
.o30px.js-px-motion .px-engine li,
.o30px.js-px-motion .px-steps4 li,
.o30px.js-px-motion .px-criteria article,
.o30px.js-px-motion .px-warm blockquote,
.o30px.js-px-motion .px-own__col,
.o30px.js-px-motion .px-wl__card,
.o30px.js-px-motion .px-trustq article,
.o30px.js-px-motion .pe-step,
.o30px.js-px-motion .pe-why article {
	opacity: 0;
	transform: translateY(18px);
	transition: opacity .55s ease, transform .55s ease;
}

.o30px.js-px-motion .px-track.is-in,
.o30px.js-px-motion .px-pay.is-in,
.o30px.js-px-motion .px-engine li.is-in,
.o30px.js-px-motion .px-steps4 li.is-in,
.o30px.js-px-motion .px-criteria article.is-in,
.o30px.js-px-motion .px-warm blockquote.is-in,
.o30px.js-px-motion .px-own__col.is-in,
.o30px.js-px-motion .px-wl__card.is-in,
.o30px.js-px-motion .px-trustq article.is-in,
.o30px.js-px-motion .pe-step.is-in,
.o30px.js-px-motion .pe-why article.is-in {
	opacity: 1;
	transform: none;
}

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

@media (max-width: 1100px) {
	.o30px .px-hero__title { font-size: 44px; }
	.o30px .px-rhero {
		grid-template-columns: 1fr;
		gap: 30px;
	}
	.o30px .px-rhero__title { font-size: 38px; }
	.o30px .px-calc,
	.o30px .px-margin { max-width: 560px; }
	.o30px .px-calc--hero { max-width: none; }
	.o30px .px-engine,
	.o30px .px-steps4,
	.o30px .px-timing { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.o30px .px-criteria { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.o30px .px-criteria--5 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
	.o30px .px-hub { grid-template-columns: 1fr; }
	.o30px .px-hub__facts { grid-template-columns: repeat(3, minmax(0, 1fr)); }
	.o30px .px-choose--lead { grid-template-columns: 1fr; }
	.o30px .px-power,
	.o30px.o30px--single #previews .px-power {
		grid-template-columns: 1fr;
		gap: 36px;
	}
	.o30px .px-power h2 { font-size: 36px; }
	.o30px .px-power__visual { transform: none; }
	.o30px .px-earn { grid-template-columns: 1fr; }
	.o30px .px-earn__example { position: static; }
	.o30px .px-more--3 { grid-template-columns: 1fr; }
	.o30px .px-flow li { font-size: 13.5px; padding: 10px 14px; }
	.o30px .px-criteria__fold .px-fold__body { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 720px) {
	.o30px .px-hero { padding-top: 30px; }
	.o30px .px-hero__title { font-size: 34px; }
	.o30px .px-hero__lead { font-size: 16px; }
	.o30px .px-choose,
	.o30px .px-engine,
	.o30px .px-steps4,
	.o30px .px-timing,
	.o30px .px-criteria,
	.o30px .px-warm,
	.o30px .px-own,
	.o30px .px-wl,
	.o30px .px-trustq { grid-template-columns: 1fr; }
	.o30px .px-track { padding: 26px 22px; }
	.o30px .px-track h3 { font-size: 23px; }
	.o30px .px-track__num b { font-size: 36px; }
	.o30px .px-rhero {
		padding-top: 22px;
		padding-bottom: 36px;
		gap: 22px;
	}
	.o30px .px-rhero__copy { padding-top: 0; }
	.o30px .px-rhero__title { font-size: 34px; margin-bottom: 12px; }
	.o30px .px-rhero__lead { font-size: 16.5px; margin-bottom: 14px; }
	.o30px .px-rhero__actions { margin-bottom: 10px; }
	.o30px .px-rhero__actions .pt-cta { width: 100%; }
	.o30px .px-hero__actions .pt-cta { width: 100%; }
	.o30px .px-compare__ctas .pt-cta { width: 100%; }
	.o30px .px-rhero__formula { font-size: 16.5px; margin-bottom: 8px; }
	.o30px .px-rhero__sub { font-size: 15px; margin-bottom: 14px; }
	.o30px .px-rhero__actions { gap: 8px 16px; }
	.o30px .px-rhero__actions .px-rhero__secondary { width: 100%; text-align: center; }
	.o30px .px-calc { padding: 18px 16px 16px; max-width: none; }
	.o30px .px-calc--hero { padding: 20px 16px 16px; }
	.o30px .px-calc--hero .px-calc__punch { font-size: 15px; margin-bottom: 12px; }
	.o30px .px-calc--hero .px-calc__big { font-size: 30px; }
	.o30px .px-calc--hero .px-calc__split { margin-top: 12px; }
	.o30px .px-calc--hero .px-calc__split b { font-size: 15px; }
	/* Amounts wrap instead of clipping ($170,000 / $1,698,300 at 360px). */
	.o30px .px-calc__big { font-size: 24px; white-space: normal; overflow-wrap: anywhere; }
	.o30px .px-calc__label { flex-wrap: wrap; }
	.o30px .px-calc__num { min-height: 44px; }
	.o30px .px-calc__head { gap: 8px 12px; }
	/* landing-v3.css bumps every .o30v3 h2 to 34/28px on mobile; the card title must stay compact so the Max Mode switch shares its row. */
	.o30px .px-calc__head h2.px-calc__title { font-size: 18px !important; line-height: 1.2; }
	.o30px .px-calc--hero .px-calc__head h2.px-calc__title { font-size: 22px !important; }
	.o30px .px-calc__switch { min-height: 44px; padding: 6px 14px 6px 8px; font-size: 13.5px; }
	.o30px .px-calc__switch-track { width: 34px; height: 20px; }
	.o30px .px-calc__switch-knob { width: 16px; height: 16px; }
	.o30px .px-calc__switch.is-on .px-calc__switch-knob { transform: translateX(14px); }
	.o30px .px-calc input[type="range"] { height: 12px; margin: 10px 0 6px; }
	.o30px .px-calc input[type="range"]::-webkit-slider-thumb { width: 32px; height: 32px; }
	.o30px .px-calc__foot { flex-wrap: wrap; }
	.o30px .px-calc__link { min-height: 44px; display: inline-flex; align-items: center; }
	.o30px .px-earn__calc { padding: 20px 18px; }
	.o30px .px-calc__breakdown div { display: grid; gap: 2px; }
	.o30px .px-more { grid-template-columns: 1fr; }
	.o30px .px-more__card { padding: 22px 20px 20px; }
	.o30px.o30px--single #previews .px-power__copy {
		order: -1;
	}
	.o30px .px-power h2 { font-size: 30px; }
	.o30px .px-power__lead,
	.o30px .px-power__punch { font-size: 16px; }
	.o30px .px-power__facts {
		grid-template-columns: 1fr;
		gap: 10px;
	}
	.o30px .px-power__facts li {
		display: flex;
		align-items: center;
		gap: 14px;
		padding: 14px 16px;
	}
	.o30px .px-power__facts b {
		margin-bottom: 0;
		min-width: 2.4ch;
		font-size: 32px;
	}
	.o30px .px-power__facts span { font-size: 15px; line-height: 1.4; }
	.o30px .px-power__actions {
		flex-direction: column;
		align-items: stretch;
	}
	.o30px .px-power__actions .pt-cta {
		width: 100%;
		white-space: normal;
	}
	.o30px .px-power__actions .px-rhero__secondary {
		width: 100%;
		text-align: center;
	}
	.o30px .px-power__bar {
		gap: 10px;
		padding: 10px 12px;
		flex-wrap: wrap;
	}
	.o30px .px-power__dots { display: none; }
	.o30px .px-power__for {
		white-space: normal;
		overflow: visible;
		flex: 1 1 100%;
	}
	.o30px .px-power__dirs { gap: 8px; padding: 10px; }
	.o30px .px-power__dir em { display: none; }
	.o30px .px-power__pill { display: none; }
	.o30px .px-power__cap { padding: 12px 14px 14px; }
	.o30px .px-earn__steps li { grid-template-columns: 1fr; padding: 20px 18px; }
	.o30px .px-earn__steps .pe-step__num { grid-row: auto; padding: 0 0 6px; }
	.o30px .px-earn__example { padding: 22px 18px 20px; }
	.o30px .px-earn__line--big b { font-size: 30px; }
	.o30px .px-earn__split { grid-template-columns: 1fr; }
	.o30px .px-earn__split span { grid-template-columns: auto 1fr; align-items: baseline; gap: 10px; }
	.o30px .px-compare { padding: 4px 4px 20px; }
	.o30px .px-compare th,
	.o30px .px-compare td { padding: 11px 10px; font-size: 13.5px; }
	.o30px .px-compare thead th { font-size: 11px; }
	.o30px .px-previews {
		flex-direction: column;
		align-items: flex-start;
		gap: 18px;
	}
	.o30px .px-attr {
		flex-direction: column;
		align-items: center;
		gap: 22px;
	}
	.o30px .px-upgrade {
		flex-direction: column;
		align-items: flex-start;
	}
	.o30px .px-upgrade .pt-cta { width: 100%; }
	.o30px .px-warm__rule { font-size: 17px; }
	.o30px .px-criteria--5 { grid-template-columns: 1fr; gap: 12px; }
	.o30px .px-criteria--5 article { padding: 18px 18px; }
	.o30px .px-warm-wrap { margin-top: 32px; padding-top: 30px; }
	.o30px .px-warm__title { font-size: 18px; margin-bottom: 16px; }
	.o30px .px-hub { gap: 16px; }
	.o30px .px-hub__facts { grid-template-columns: 1fr; gap: 12px; }
	.o30px .px-hub__facts li { padding: 18px 18px; }
	.o30px .px-flow { flex-direction: column; align-items: stretch; }
	.o30px .px-flow li:not(:last-child)::after { content: '↓'; margin-left: auto; }
}

/* Narrow phones (360–380px): two result columns ≈ 138px each. */
@media (max-width: 380px) {
	.o30px .px-rhero__title { font-size: 31px; }
	.o30px .px-calc__big { font-size: 22px; }
	.o30px .px-calc__num--price { width: 96px; }
}

@media (prefers-reduced-motion: reduce) {
	.o30px.js-px-motion .px-track,
	.o30px.js-px-motion .px-pay,
	.o30px.js-px-motion .px-engine li,
	.o30px.js-px-motion .px-steps4 li,
	.o30px.js-px-motion .px-criteria article,
	.o30px.js-px-motion .px-warm blockquote,
	.o30px.js-px-motion .px-own__col,
	.o30px.js-px-motion .px-wl__card,
	.o30px.js-px-motion .px-trustq article,
	.o30px.js-px-motion .pe-step,
	.o30px.js-px-motion .pe-why article,
	.o30px .pe-step:hover {
		opacity: 1;
		transform: none;
		transition: none;
	}
}

/* ---------- §14 mobile typography floor (hub / referral / reseller) ----------
   Body copy ≥16px, fine print 14px, text links ≥44px tap height. Labels, kickers,
   the calculator's compact meta and the sticky bar keep their own sizes. */
@media (max-width: 700px) {
	.o30px p,
	.o30px li {
		font-size: 16px;
		line-height: 1.55;
	}
	.o30px .px-rhero__under,
	.o30px .px-hero__under,
	.o30px .px-earn__notes li,
	.o30px .px-earn__sub,
	.o30px .px-more__note,
	.o30px .px-calc__note,
	.o30px .pt-join__legal,
	.o30px .px-demo__note,
	.o30px .px-sell__note,
	.o30px small,
	.o30px .px-fine,
	.o30px .cv-fine {
		font-size: 14px;
		line-height: 1.5;
	}
	.o30px .px-rhero__secondary,
	.o30px .px-more__link,
	.o30px .px-attr__link,
	.o30px .px-attr__terms a,
	.o30px .px-track__link,
	.o30px .px-earn__link,
	.o30px .pt-legal a,
	.o30px .pt-join__legal a,
	.o30px .px-final__reseller a,
	.o30px .px-hero__reseller a {
		display: inline-block;
		min-height: 44px;
		padding-top: 10px;
		padding-bottom: 10px;
		box-sizing: border-box;
	}
}

/* =====================================================================
   Partner sign-up popup (Referral + Certified Reseller) — two steps:
   form → "done, here's what happens next". Opened by any #join / #apply
   link on the partner pages. Root carries .o30pt for the design tokens.
   ===================================================================== */

html.o30-modal-open,
html.o30-modal-open body {
	overflow: hidden;
}

html.o30-modal-open body {
	padding-right: var(--o30-scroll-gap, 0px);
}

/* Fixed chrome is viewport-sized, so it ignores body padding. Keep its
   content parked while the classic scrollbar disappears. */
html.o30-modal-open .o30v3-header-fixed {
	width: calc(100% - var(--o30-scroll-gap, 0px)) !important;
}

html.o30-modal-open .o30v3-bar {
	right: var(--o30-scroll-gap, 0px) !important;
}

.o30pt.px-modal {
	position: fixed;
	inset: 0;
	z-index: 10080;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 24px;
	background: transparent;
	overflow: visible;
	width: auto;
}
.o30pt.px-modal[hidden] { display: none; }

.px-modal__back {
	position: absolute;
	inset: 0;
	background: rgba(22, 21, 19, .72);
	opacity: 0;
	transition: opacity .18s ease;
}
.px-modal.is-open .px-modal__back {
	opacity: 1;
}

.px-modal__dialog {
	position: relative;
	width: 100%;
	max-width: 560px;
	max-height: calc(100vh - 48px);
	max-height: calc(100dvh - 48px);
	overflow-y: auto;
	-webkit-overflow-scrolling: touch;
	background: #fff;
	color: var(--pt-ink);
	border: 1px solid #ece8e0;
	border-radius: 24px;
	padding: 32px 32px 28px;
	box-shadow: 0 24px 56px -32px rgba(22, 21, 19, .28);
	outline: none;
	opacity: 0;
	transform: translateY(14px) scale(.985);
	transition: opacity .2s ease, transform .22s cubic-bezier(.22, 1, .36, 1);
}
.px-modal.is-open .px-modal__dialog {
	opacity: 1;
	transform: none;
}
.px-modal__dialog:focus,
.px-modal__dialog:focus-visible {
	outline: none;
	box-shadow: 0 24px 56px -32px rgba(22, 21, 19, .28);
}

@media (prefers-reduced-motion: reduce) {
	.px-modal__back,
	.px-modal__dialog {
		transition: none;
	}
}
.px-modal[data-px-current="reseller"] .px-modal__dialog { max-width: 720px; }

.o30pt.px-modal .px-modal__x {
	position: absolute;
	top: 14px;
	right: 14px;
	width: 40px;
	height: 40px;
	border-radius: 999px;
	border: 1px solid var(--pt-line);
	background: #fff;
	color: var(--pt-muted);
	font-size: 24px;
	line-height: 1;
	cursor: pointer;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	z-index: 2;
}
.o30pt.px-modal .px-modal__x:hover { color: var(--pt-ink); border-color: #cfcabf; background: #fff; }

.px-modal__head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	margin: 0 44px 14px 0;
}
.px-modal__eyebrow {
	font-family: 'Inter', monospace;
	font-size: 11px;
	letter-spacing: .08em;
	text-transform: uppercase;
	font-weight: 800;
	color: var(--pt-soft);
}
.px-modal__progress { display: inline-flex; gap: 6px; }
.px-modal__progress i {
	display: block;
	width: 22px;
	height: 6px;
	border-radius: 999px;
	background: var(--pt-line);
	transition: background .2s ease;
}
.px-modal__progress i.is-on { background: var(--pt-ink); }

.o30pt.px-modal .px-modal__title {
	font-weight: 800;
	font-size: 28px;
	line-height: 1.1;
	letter-spacing: -.025em;
	margin: 0 0 10px;
}
.o30pt.px-modal .px-modal__sub {
	font-size: 15px;
	line-height: 1.55;
	color: var(--pt-muted);
	margin: 0 0 20px;
}
.o30pt.px-modal .px-modal__sub b {
	color: var(--pt-ink);
	font-weight: 800;
	display: inline-block;
	max-width: 100%;
	word-break: normal;
	overflow-wrap: break-word;
	hyphens: none;
	white-space: nowrap;
}

/* Form inside the popup: flush with the dialog padding. */
.o30pt.px-modal .pt-join.px-modal__form {
	max-width: none;
	padding: 0;
	border: 0;
	border-radius: 0;
	background: transparent;
	box-shadow: none;
}
.o30pt.px-modal .pt-join label { margin-bottom: 12px; }
.o30pt.px-modal .pt-join input,
.o30pt.px-modal .pt-join select,
.o30pt.px-modal .pt-join textarea {
	background: var(--pt-paper);
	font-size: 16px;
	border: 1px solid #ece8e0;
	box-shadow: none;
}
.o30pt.px-modal .pt-join .pt-cta { margin-top: 4px; min-height: 52px; font-size: 16px; }

.o30pt.px-modal .pt-join .pt-cta.is-busy {
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	gap: 10px;
	padding-left: 44px;
	cursor: wait;
	transform: scale(.985);
}

.o30pt.px-modal .pt-join .pt-cta.is-busy::before {
	content: '';
	position: absolute;
	left: 18px;
	top: 50%;
	width: 15px;
	height: 15px;
	margin-top: -7.5px;
	border: 2px solid rgba(22, 21, 19, .18);
	border-top-color: var(--pt-ink);
	border-radius: 50%;
	animation: px-btn-spin .55s linear infinite;
}

.o30pt.px-modal .pt-join .pt-cta.is-busy::after {
	content: '';
	position: absolute;
	inset: 0;
	border-radius: inherit;
	background: linear-gradient(110deg, transparent 30%, rgba(255, 255, 255, .38) 48%, transparent 66%);
	background-size: 220% 100%;
	animation: px-btn-shimmer 1.1s ease-in-out infinite;
	pointer-events: none;
}

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

@keyframes px-btn-shimmer {
	0% { background-position: 120% 0; }
	100% { background-position: -120% 0; }
}

@media (prefers-reduced-motion: reduce) {
	.o30pt.px-modal .pt-join .pt-cta.is-busy {
		transform: none;
	}
	.o30pt.px-modal .pt-join .pt-cta.is-busy::before,
	.o30pt.px-modal .pt-join .pt-cta.is-busy::after {
		animation: none;
	}
}
.o30pt.px-modal .pt-join__legal { text-align: left; margin-top: 12px; font-size: 12.5px; color: var(--pt-soft); }
.o30pt.px-modal .pt-join__error { margin: 4px 0 10px; }
.o30pt.px-modal .pt-apply__services { margin: 4px 0 14px; }
.o30pt.px-modal .pt-apply__checks label {
	gap: 8px;
	min-height: 40px;
	padding: 0 12px;
	border: 1px solid var(--pt-line);
	border-radius: 999px;
	background: var(--pt-paper);
	cursor: pointer;
	white-space: nowrap;
}
.o30pt.px-modal .pt-apply__checks label:has(input:checked) {
	border-color: var(--pt-ink);
	background: var(--pt-accent);
}
.o30pt.px-modal .pt-join input[type="checkbox"] {
	width: 16px;
	height: 16px;
	min-width: 16px;
	padding: 0;
	margin: 0;
	border-radius: 4px;
	accent-color: var(--pt-ink);
}
.o30pt.px-modal .pt-join .pt-apply__full {
	display: block;
	margin-bottom: 12px;
}
.o30pt.px-modal .px-qualify .px-modal__title {
	margin-bottom: 28px;
}
.o30pt.px-modal .px-qualify .pt-apply__full {
	margin-bottom: 22px;
}
.o30pt.px-modal .pt-join [data-px-describe-select] {
	padding-top: 2px;
}
.o30pt.px-modal .pt-join .pt-apply__full select,
.o30pt.px-modal .pt-join textarea {
	width: 100%;
}
.o30pt.px-modal .px-qualify__why small {
	font-weight: 600;
	color: var(--pt-muted);
}
.o30pt.px-modal .px-qualify input[data-px-other] {
	width: 100%;
	margin-top: 8px;
}

.px-modal__perks {
	list-style: none;
	margin: 22px 0 0;
	padding: 16px 0 0;
	border-top: 1px solid var(--pt-line);
	display: grid;
	gap: 9px;
}
.px-modal__perks li {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	font-size: 13.5px;
	line-height: 1.45;
	color: var(--pt-muted);
}
.px-modal__perks li svg { flex: none; margin-top: 3px; color: var(--pt-ink); background: var(--pt-accent); border-radius: 999px; padding: 2px; width: 18px; height: 18px; }
.px-modal__perks li b { color: var(--pt-ink); font-weight: 800; }

/* Done step */
.px-modal__check {
	width: 56px;
	height: 56px;
	border-radius: 999px;
	background: var(--pt-accent);
	color: var(--pt-ink);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	margin: 4px 0 18px;
}
.px-modal__check svg { width: 26px; height: 26px; }

/* Referral done step: small inline check, tight gap before the full-width CTA. */
.px-modal__variant[data-px-variant="referral"] .px-modal__done-heading {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	margin: 0 0 10px;
}
.px-modal__variant[data-px-variant="referral"] .px-modal__done-heading .px-modal__check {
	width: 26px;
	height: 26px;
	margin: 2px 0 0;
	flex: none;
}
.px-modal__variant[data-px-variant="referral"] .px-modal__done-heading .px-modal__check svg {
	width: 15px;
	height: 15px;
}
.px-modal__variant[data-px-variant="referral"] .px-modal__done-heading .px-modal__title {
	margin: 0;
	flex: 1 1 auto;
}
.px-modal__variant[data-px-variant="referral"] .px-modal__done [data-px-done-copy="created"] {
	text-align: center;
}
.px-modal__variant[data-px-variant="referral"] .px-modal__done .px-modal__next {
	margin-bottom: 16px;
}
.px-modal__variant[data-px-variant="referral"] .px-modal__done .px-modal__actions .pt-cta {
	flex: 1 1 100%;
	width: 100%;
}

.px-modal__next {
	list-style: none;
	counter-reset: px-next;
	margin: 0 0 22px;
	padding: 0;
	display: grid;
	gap: 10px;
}
.px-modal__next li {
	counter-increment: px-next;
	position: relative;
	padding: 14px 16px 14px 54px;
	background: var(--pt-paper);
	border: 1px solid #ece8e0;
	box-shadow: none;
	border-radius: 14px;
	font-size: 14px;
	line-height: 1.5;
	color: var(--pt-muted);
}
.px-modal__next li::before {
	content: counter(px-next);
	position: absolute;
	left: 14px;
	top: 13px;
	width: 28px;
	height: 28px;
	border-radius: 999px;
	background: var(--pt-ink);
	color: #fff;
	font-weight: 800;
	font-size: 13px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
}
.px-modal__next li b { display: block; margin-bottom: 4px; color: var(--pt-ink); font-weight: 800; }

.px-modal__actions {
	display: flex;
	align-items: center;
	gap: 14px;
	flex-wrap: wrap;
}
.o30pt.px-modal .px-modal__actions .pt-cta { flex: 1 1 auto; min-height: 52px; }
.o30pt.px-modal .px-modal__ghost {
	background: transparent;
	border: 0;
	border-radius: 10px;
	box-shadow: none;
	font: inherit;
	font-weight: 700;
	color: var(--pt-muted);
	cursor: pointer;
	padding: 12px 14px;
	min-height: 44px;
}
.o30pt.px-modal .px-modal__ghost:hover { color: var(--pt-ink); background: var(--pt-paper); }
.o30pt.px-modal .px-modal__fine {
	margin: 16px 0 0;
	font-size: 12.5px;
	line-height: 1.5;
	color: var(--pt-soft);
}
.o30pt.px-modal .px-modal__fine a { color: inherit; font-weight: 700; }

/* Inline "open the popup" block replacing the old on-page form. */
.o30pt .pt-join.pt-join--cta {
	background: transparent;
	padding: 0;
	max-width: 520px;
	text-align: center;
}
.o30pt .pt-join--cta .px-open,
.o30pt .pt-join--cta .pt-cta--soon { width: 100%; min-height: 56px; font-size: 16px; }
.o30pt .pt-cta--soon,
.o30px .pt-cta--soon {
	pointer-events: none;
	cursor: default;
	box-shadow: none;
	opacity: .78;
}
.o30pt .pt-final .pt-join--cta .pt-final__micro { color: rgba(255, 255, 255, .72); }

/* Referral closer: copy uses the dark card’s padding box (the 560/720/880
   nested measures left a column of unused black and forced 3-line wraps). */
.o30px.o30px--ref #join .o30pt-wrap {
	max-width: 1360px;
}
.o30px.o30px--ref .pt-final {
	padding-left: clamp(24px, 3.5vw, 48px);
	padding-right: clamp(24px, 3.5vw, 48px);
}
.o30px.o30px--ref .pt-final h2 {
	max-width: none;
	width: 100%;
	font-size: clamp(30px, 3.6vw, 48px);
}
.o30px.o30px--ref .pt-final > p,
.o30px.o30px--ref .pe-final .pe-final__earn {
	text-align: center;
	max-width: none;
	width: 100%;
	margin-left: auto;
	margin-right: auto;
}
.o30px.o30px--ref .pe-final .pe-final__earn {
	font-size: clamp(18px, 2vw, 26px);
}

@media (max-width: 700px) {
	.o30px.o30px--ref .pt-final .o30-desk { display: none !important; }
}
@media (min-width: 701px) {
	.o30px.o30px--ref .pt-final .o30-mob { display: none !important; }
}

.o30px.o30px--ref .pt-final::after {
	transform: none;
	font-style: normal;
}

@media (max-width: 700px) {
	.o30pt.px-modal { padding: 0; align-items: flex-end; }
	.px-modal__dialog,
	.px-modal[data-px-current="reseller"] .px-modal__dialog {
		max-width: none;
		max-height: calc(100vh - 24px);
		max-height: calc(100dvh - 24px);
		border-radius: 22px 22px 0 0;
		padding: 24px 20px calc(24px + env(safe-area-inset-bottom, 0px));
		transform: translateY(28px);
	}
	.px-modal.is-open .px-modal__dialog {
		transform: none;
	}
	.px-modal__x { top: 12px; right: 12px; }
	.o30pt.px-modal .px-modal__title { font-size: 24px; }
	.o30pt.px-modal .pt-join__row { grid-template-columns: 1fr; gap: 0; }
	.px-modal__actions { flex-direction: column; align-items: stretch; }
	.px-modal__ghost { text-align: center; }
	.px-modal__next li { padding: 12px 14px 12px 50px; }
}

/* Partner sticky bar: meta is hidden (landing-partners.css), so the leftover
   two-column space-between layout left the single CTA off-center on mobile. */
@media (max-width: 860px) {
	body:has(.o30pt) .o30v3-bar {
		justify-content: center !important;
	}
	body:has(.o30pt) .o30v3-bar__meta {
		display: none !important;
	}
	body:has(.o30pt) .o30v3-bar__actions {
		flex: none;
		justify-content: center;
		margin-left: auto;
		margin-right: auto;
	}
}