/* affiliates-page.css - публичната страница на партньорската програма (/affiliates/), v2.
 *
 * Рендерира се от includes/affiliates-page.php (shortcode [ppcro_affiliates]) вътре в
 * съдържанието на темата. Правила на файла:
 *   - само собствен `ppaff-` namespace; нищо глобално не се пипа;
 *   - шрифтът е на темата (без @font-face, без web fonts);
 *   - Lottie кутиите имат фиксирани размери ПРЕДИ JS да е тръгнал (нула CLS);
 *   - анимациите (reveal, ladder, counters) се включват само когато JS е сложил
 *     .ppaff-js на корена - без JS всичко е видимо и статично;
 *   - prefers-reduced-motion НЕ спира анимациите (решение на Драго, 2026-10-07);
 *   - v2 (2026-10-08): 5 нива от първата продажба, кутия "задържани нива", доживотни
 *     клиенти + таблица с бонуси, изплащания по програмата на домейна (data-program
 *     на корена), US бележки, състояния approved/pending на формуляра.
 */

.ppaff-page {
	--ppaff-primary: #5D4F89;
	--ppaff-primary-dark: #4B3F73;
	--ppaff-ink: #3A2F63;
	--ppaff-text: #48435C;
	--ppaff-muted: #6B6582;
	--ppaff-border: #D1C9E6;
	--ppaff-line: #E7E2F2;
	--ppaff-tint: #F0ECF8;
	--ppaff-tint-soft: #F7F5FB;
	--ppaff-gold: #E8B54A;
	--ppaff-gold-ink: #8A6413;
	--ppaff-mint: #34B98A;
	--ppaff-mint-ink: #1E7A59;
	--ppaff-danger: #B83A32;
	--ppaff-white: #FFFFFF;
	--ppaff-radius-lg: 28px;
	--ppaff-radius: 18px;
	--ppaff-radius-sm: 12px;
	--ppaff-shadow: 0 1px 2px rgba(58, 47, 99, .06), 0 10px 28px rgba(58, 47, 99, .08);
	--ppaff-shadow-lg: 0 2px 8px rgba(58, 47, 99, .08), 0 28px 56px rgba(58, 47, 99, .16);
	--ppaff-ease: cubic-bezier(.2, .7, .2, 1);
	--ppaff-gap: clamp(16px, 2.2vw, 28px);
	--ppaff-section-y: clamp(44px, 6.5vw, 96px);
	--ppaff-title-font: var(--wd-title-font, inherit);

	position: relative;
	max-width: 1220px;
	margin: 0 auto;
	color: var(--ppaff-text);
	font-size: 16px;
	line-height: 1.65;
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
}

.ppaff-page *,
.ppaff-page *::before,
.ppaff-page *::after {
	box-sizing: border-box;
}

/* Theme resets (Woodmart entry-content lists, paragraph margins, link colors). */
.ppaff-page ul,
.ppaff-page ol {
	list-style: none;
	margin: 0;
	padding: 0;
}

.ppaff-page li {
	margin: 0;
}

.ppaff-page p {
	margin: 0;
}

.ppaff-page h1,
.ppaff-page h2,
.ppaff-page h3 {
	margin: 0;
	color: var(--ppaff-ink);
	font-family: var(--ppaff-title-font);
	text-transform: none;
	letter-spacing: -.01em;
}

.ppaff-page a {
	color: var(--ppaff-primary);
	text-underline-offset: 3px;
}

.ppaff-page a:focus-visible,
.ppaff-page button:focus-visible,
.ppaff-page summary:focus-visible,
.ppaff-page input:focus-visible,
.ppaff-page select:focus-visible,
.ppaff-page textarea:focus-visible {
	outline: 3px solid rgba(93, 79, 137, .45);
	outline-offset: 2px;
}

.ppaff-svg {
	display: block;
	width: 24px;
	height: 24px;
	flex: 0 0 auto;
}

.ppaff-money,
.ppaff-pct {
	white-space: nowrap;
	font-variant-numeric: tabular-nums;
}

.ppaff-money {
	font-weight: 600;
	color: var(--ppaff-ink);
}

.ppaff-pct {
	font-weight: 700;
	color: var(--ppaff-primary);
}

/* --- Skip link ------------------------------------------------------------ */

.ppaff-skip {
	position: absolute;
	left: 12px;
	top: 12px;
	z-index: 20;
	width: 1px;
	height: 1px;
	padding: 0;
	overflow: hidden;
	clip: rect(0 0 0 0);
	clip-path: inset(50%);
	white-space: nowrap;
	border-radius: 999px;
	background: var(--ppaff-ink);
	color: #fff !important;
	font-weight: 600;
	text-decoration: none;
}

.ppaff-skip:focus {
	width: auto;
	height: auto;
	padding: 10px 16px;
	clip: auto;
	clip-path: none;
}

/* --- Sections ------------------------------------------------------------- */

.ppaff-section {
	position: relative;
	padding: var(--ppaff-section-y) 0;
	scroll-margin-top: 96px;
}

.ppaff-section + .ppaff-section {
	padding-top: 0;
}

.ppaff-head {
	max-width: 760px;
	margin: 0 0 clamp(24px, 3.2vw, 40px);
}

.ppaff-head::before {
	content: "";
	display: block;
	width: 44px;
	height: 4px;
	margin-bottom: 18px;
	border-radius: 4px;
	background: linear-gradient(90deg, var(--ppaff-primary), var(--ppaff-gold));
}

.ppaff-h1 {
	font-size: clamp(32px, 4.4vw, 56px);
	line-height: 1.06;
	font-weight: 700;
	letter-spacing: -.025em;
}

.ppaff-h2 {
	font-size: clamp(26px, 3vw, 40px);
	line-height: 1.14;
	font-weight: 700;
	letter-spacing: -.02em;
}

.ppaff-h3 {
	font-size: 18px;
	line-height: 1.3;
	font-weight: 700;
}

.ppaff-intro {
	margin-top: 14px !important;
	font-size: clamp(16px, 1.35vw, 18px);
	color: var(--ppaff-muted);
	max-width: 68ch;
}

.ppaff-outro {
	margin-top: 26px !important;
	max-width: 76ch;
	color: var(--ppaff-muted);
}

.ppaff-small {
	font-size: 14px;
	line-height: 1.6;
	color: var(--ppaff-muted);
}

.ppaff-note {
	display: flex;
	gap: 12px;
	align-items: flex-start;
	margin-top: 22px !important;
	padding: 14px 18px;
	border: 1px dashed var(--ppaff-border);
	border-radius: var(--ppaff-radius-sm);
	background: var(--ppaff-tint-soft);
	font-size: 15px;
	color: var(--ppaff-text);
}

.ppaff-note .ppaff-svg {
	color: var(--ppaff-primary);
	margin-top: 1px;
}

.ppaff-head-row {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: var(--ppaff-gap);
}

.ppaff-head-row .ppaff-head {
	flex: 1 1 auto;
}

.ppaff-split {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	gap: clamp(24px, 4vw, 56px);
	align-items: start;
}

/* --- Buttons -------------------------------------------------------------- */

.ppaff-ctas {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	align-items: center;
	margin-top: 28px;
}

.ppaff-page .ppaff-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	min-height: 52px;
	padding: 0 26px;
	border: 2px solid transparent;
	border-radius: 999px;
	font-family: inherit;
	font-size: 16px;
	font-weight: 700;
	line-height: 1.2;
	letter-spacing: 0;
	text-transform: none;
	text-decoration: none;
	box-shadow: none;
	cursor: pointer;
	transition: transform .2s var(--ppaff-ease), box-shadow .2s var(--ppaff-ease), background-color .2s, color .2s, border-color .2s;
}

.ppaff-page .ppaff-btn .ppaff-svg {
	width: 20px;
	height: 20px;
	transition: transform .2s var(--ppaff-ease);
}

.ppaff-page .ppaff-btn:hover .ppaff-svg {
	transform: translateX(3px);
}

.ppaff-page .ppaff-btn-primary {
	background: var(--ppaff-primary);
	color: #fff;
	box-shadow: 0 10px 24px rgba(93, 79, 137, .28);
}

.ppaff-page .ppaff-btn-primary:hover,
.ppaff-page .ppaff-btn-primary:focus-visible {
	background: var(--ppaff-primary-dark);
	color: #fff;
	transform: translateY(-2px);
	box-shadow: 0 14px 30px rgba(93, 79, 137, .34);
}

.ppaff-page .ppaff-btn-ghost {
	background: rgba(255, 255, 255, .7);
	border-color: var(--ppaff-border);
	color: var(--ppaff-ink);
}

.ppaff-page .ppaff-btn-ghost:hover,
.ppaff-page .ppaff-btn-ghost:focus-visible {
	border-color: var(--ppaff-primary);
	color: var(--ppaff-primary);
	background: #fff;
}

.ppaff-page .ppaff-btn-light {
	background: #fff;
	color: var(--ppaff-ink);
	box-shadow: 0 10px 24px rgba(20, 12, 48, .25);
}

.ppaff-page .ppaff-btn-light:hover,
.ppaff-page .ppaff-btn-light:focus-visible {
	background: var(--ppaff-gold);
	color: var(--ppaff-ink);
	transform: translateY(-2px);
}

/* --- Hero ----------------------------------------------------------------- */

.ppaff-hero {
	padding-top: clamp(16px, 2.5vw, 32px);
}

.ppaff-hero-grid {
	position: relative;
	display: grid;
	grid-template-columns: minmax(0, 1.25fr) minmax(0, .75fr);
	gap: clamp(20px, 4vw, 56px);
	align-items: center;
	padding: clamp(28px, 5.2vw, 72px);
	border-radius: var(--ppaff-radius-lg);
	background:
		radial-gradient(900px 420px at 100% -10%, rgba(93, 79, 137, .20), rgba(93, 79, 137, 0) 60%),
		radial-gradient(520px 320px at -5% 110%, rgba(232, 181, 74, .18), rgba(232, 181, 74, 0) 65%),
		linear-gradient(160deg, #FBFAFE 0%, var(--ppaff-tint) 100%);
	border: 1px solid var(--ppaff-line);
	overflow: hidden;
}

.ppaff-eyebrow {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	margin-bottom: 20px !important;
	padding: 6px 14px 6px 10px;
	border-radius: 999px;
	background: #fff;
	border: 1px solid var(--ppaff-line);
	box-shadow: 0 4px 14px rgba(58, 47, 99, .06);
	color: var(--ppaff-primary);
	font-size: 13px;
	font-weight: 700;
	letter-spacing: .04em;
	text-transform: uppercase;
}

.ppaff-eyebrow .ppaff-svg {
	width: 18px;
	height: 18px;
}

/* The top rate in the headline: solid brand color on a gold "marker" stroke. */
.ppaff-hero .ppaff-h1 .ppaff-pct {
	padding: 0 .06em;
	color: var(--ppaff-primary);
	background: linear-gradient(180deg, transparent 64%, rgba(232, 181, 74, .45) 64%, rgba(232, 181, 74, .45) 92%, transparent 92%);
}

.ppaff-lead {
	margin-top: 18px !important;
	max-width: 60ch;
	font-size: clamp(17px, 1.45vw, 19px);
	line-height: 1.6;
	color: var(--ppaff-text);
}

.ppaff-lead .ppaff-pct {
	color: var(--ppaff-ink);
}

.ppaff-stats {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 12px;
	margin-top: 32px !important;
	max-width: 620px;
}

.ppaff-stat {
	display: flex;
	flex-direction: column;
	gap: 4px;
	padding: 14px 16px;
	border-radius: var(--ppaff-radius-sm);
	background: rgba(255, 255, 255, .78);
	border: 1px solid var(--ppaff-line);
}

.ppaff-stat-value {
	font-family: var(--ppaff-title-font);
	font-size: clamp(26px, 2.6vw, 34px);
	font-weight: 800;
	line-height: 1;
	color: var(--ppaff-ink);
	font-variant-numeric: tabular-nums;
}

.ppaff-stat:nth-child(2) .ppaff-stat-value {
	color: var(--ppaff-primary);
}

.ppaff-stat-label {
	font-size: 13px;
	line-height: 1.35;
	color: var(--ppaff-muted);
}

/* R21 (2026-10-09): 4th counter = the code range the affiliate chooses ("10-15%"), in the coupon gold. */
.ppaff-stats[data-count="4"] {
	grid-template-columns: repeat(4, minmax(0, 1fr));
	max-width: 700px;
}

.ppaff-stats[data-count="4"] .ppaff-stat {
	padding-left: 14px;
	padding-right: 12px;
}

.ppaff-stats[data-count="4"] .ppaff-stat-value {
	font-size: clamp(24px, 2.3vw, 30px);
}

.ppaff-stat:nth-child(4) .ppaff-stat-value {
	color: var(--ppaff-gold-ink);
	white-space: nowrap;
}

.ppaff-currency-note {
	margin-top: 14px !important;
	max-width: 620px;
	font-size: 13px;
	line-height: 1.5;
	color: var(--ppaff-muted);
}

.ppaff-hero-art {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 320px;
}

.ppaff-orbit {
	position: absolute;
	width: 300px;
	height: 300px;
	border-radius: 50%;
	background: radial-gradient(circle at 35% 30%, #fff 0%, #fff 38%, rgba(255, 255, 255, .55) 62%, rgba(255, 255, 255, 0) 72%);
	box-shadow: inset 0 0 0 1px rgba(93, 79, 137, .10);
}

.ppaff-orbit::before,
.ppaff-orbit::after {
	content: "";
	position: absolute;
	inset: -18px;
	border-radius: 50%;
	border: 1px dashed rgba(93, 79, 137, .28);
}

.ppaff-orbit::after {
	inset: -44px;
	border-style: solid;
	border-color: rgba(93, 79, 137, .10);
}

.ppaff-js .ppaff-orbit::before {
	animation: ppaff-spin 38s linear infinite;
}

.ppaff-float {
	position: absolute;
	z-index: 2;
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 9px 14px;
	border-radius: 14px;
	background: #fff;
	box-shadow: var(--ppaff-shadow);
	color: var(--ppaff-ink);
	font-size: 15px;
}

.ppaff-float b {
	font-weight: 800;
}

.ppaff-float .ppaff-svg {
	width: 20px;
	height: 20px;
	color: var(--ppaff-primary);
}

.ppaff-float-a {
	left: 2%;
	top: 16%;
}

.ppaff-float-b {
	right: 0;
	bottom: 14%;
}

.ppaff-float-b .ppaff-svg {
	color: var(--ppaff-mint);
	transform: rotate(-45deg);
}

.ppaff-js .ppaff-float-a {
	animation: ppaff-bob 6s ease-in-out infinite;
}

.ppaff-js .ppaff-float-b {
	animation: ppaff-bob 7s ease-in-out -2.5s infinite;
}

/* --- Lottie boxes (fixed sizes = zero CLS) ----------------------------------- */

.ppaff-anim {
	position: relative;
	display: block;
	flex: 0 0 auto;
	line-height: 0;
}

.ppaff-anim svg {
	display: block;
	width: 100% !important;
	height: 100% !important;
}

.ppaff-anim[data-size="hero"] {
	z-index: 1;
	width: 240px;
	height: 240px;
}

.ppaff-anim[data-size="step"] {
	width: 96px;
	height: 96px;
}

.ppaff-anim[data-size="section"] {
	width: 160px;
	height: 160px;
}

.ppaff-anim[data-size="small"] {
	width: 116px;
	height: 116px;
}

.ppaff-anim.is-failed {
	display: none;
}

/* --- Who: type cards ----------------------------------------------------------- */

.ppaff-cards {
	display: grid;
	gap: var(--ppaff-gap);
}

.ppaff-types {
	grid-template-columns: repeat(4, minmax(0, 1fr));
}

.ppaff-card {
	position: relative;
	display: flex;
	flex-direction: column;
	gap: 10px;
	padding: 24px 22px 22px;
	border-radius: var(--ppaff-radius);
	background: #fff;
	border: 1px solid var(--ppaff-line);
	box-shadow: 0 1px 2px rgba(58, 47, 99, .04);
	transition: transform .25s var(--ppaff-ease), box-shadow .25s var(--ppaff-ease), border-color .25s;
}

.ppaff-card p {
	font-size: 15px;
	line-height: 1.6;
	color: var(--ppaff-muted);
}

.ppaff-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 48px;
	height: 48px;
	flex: 0 0 auto;
	border-radius: 14px;
	background: var(--ppaff-tint);
	color: var(--ppaff-primary);
	transition: background-color .25s, color .25s, transform .25s var(--ppaff-ease);
}

.ppaff-card:hover {
	transform: translateY(-4px);
	border-color: var(--ppaff-border);
	box-shadow: var(--ppaff-shadow);
}

.ppaff-card:hover .ppaff-icon {
	background: var(--ppaff-primary);
	color: #fff;
	transform: rotate(-6deg);
}

/* --- How: steps -------------------------------------------------------------- */

.ppaff-how .ppaff-head,
.ppaff-faq .ppaff-head {
	margin-left: auto;
	margin-right: auto;
	text-align: center;
}

.ppaff-how .ppaff-head::before,
.ppaff-faq .ppaff-head::before {
	margin-left: auto;
	margin-right: auto;
}

.ppaff-how .ppaff-intro {
	margin-left: auto;
	margin-right: auto;
}

.ppaff-steps {
	position: relative;
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: var(--ppaff-gap);
	counter-reset: none;
}

.ppaff-steps::before {
	content: "";
	position: absolute;
	top: 60px;
	left: 12%;
	right: 12%;
	height: 2px;
	background: repeating-linear-gradient(90deg, var(--ppaff-border) 0 8px, transparent 8px 16px);
}

.ppaff-step {
	position: relative;
	text-align: center;
	padding: 0 6px;
}

.ppaff-step-art {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 120px;
	height: 120px;
	margin: 0 auto 18px;
	border-radius: 50%;
	background: #fff;
	border: 1px solid var(--ppaff-line);
	box-shadow: var(--ppaff-shadow);
	transition: transform .3s var(--ppaff-ease), box-shadow .3s var(--ppaff-ease);
}

.ppaff-step:hover .ppaff-step-art {
	transform: translateY(-4px) scale(1.03);
	box-shadow: var(--ppaff-shadow-lg);
}

.ppaff-step-num {
	position: absolute;
	top: -4px;
	right: -4px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 34px;
	height: 34px;
	border-radius: 50%;
	background: var(--ppaff-primary);
	color: #fff;
	font-size: 13px;
	font-weight: 800;
	letter-spacing: .02em;
	box-shadow: 0 0 0 4px #fff;
}

.ppaff-step:last-child .ppaff-step-num {
	background: var(--ppaff-gold);
	color: var(--ppaff-ink);
}

.ppaff-step .ppaff-h3 {
	margin-bottom: 8px;
}

.ppaff-step p {
	font-size: 15px;
	color: var(--ppaff-muted);
}

/* --- Coupon -------------------------------------------------------------------- */

.ppaff-coupon-grid {
	grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr);
}

.ppaff-coupon-side {
	position: sticky;
	top: 110px;
}

.ppaff-ticket {
	position: relative;
	display: flex;
	align-items: center;
	gap: 18px;
	padding: 22px 26px 22px 18px;
	border-radius: var(--ppaff-radius);
	background: linear-gradient(135deg, var(--ppaff-ink) 0%, var(--ppaff-primary) 100%);
	color: #fff;
	box-shadow: var(--ppaff-shadow-lg);
	overflow: hidden;
}

/* The "punched" edges of a coupon. */
.ppaff-ticket::before,
.ppaff-ticket::after {
	content: "";
	position: absolute;
	top: 50%;
	width: 26px;
	height: 26px;
	margin-top: -13px;
	border-radius: 50%;
	background: var(--wd-main-bgcolor, #fff);
}

.ppaff-ticket::before {
	left: -13px;
}

.ppaff-ticket::after {
	right: -13px;
}

.ppaff-ticket .ppaff-anim {
	border-radius: 50%;
	background: rgba(255, 255, 255, .96);
}

.ppaff-ticket-copy {
	display: flex;
	flex-direction: column;
	gap: 6px;
	min-width: 0;
	padding-left: 18px;
	border-left: 2px dashed rgba(255, 255, 255, .35);
}

.ppaff-ticket-pct {
	font-family: var(--ppaff-title-font);
	font-size: clamp(40px, 4.4vw, 56px);
	font-weight: 800;
	line-height: 1;
	color: var(--ppaff-gold);
}

.ppaff-ticket-label {
	font-size: 15px;
	line-height: 1.45;
	color: rgba(255, 255, 255, .9);
}

.ppaff-rules {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: var(--ppaff-gap);
}

/* An odd last rule spans both columns (R21's "you choose the discount" is its own block since 2026-10-09). */
.ppaff-rules > .ppaff-rule:last-child:nth-child(odd) {
	grid-column: 1 / -1;
}

.ppaff-rule {
	display: flex;
	flex-direction: column;
	gap: 12px;
	padding: 22px;
	border-radius: var(--ppaff-radius);
	background: var(--ppaff-tint-soft);
	border: 1px solid var(--ppaff-line);
	transition: transform .25s var(--ppaff-ease), box-shadow .25s var(--ppaff-ease), background-color .25s;
}

.ppaff-rule:hover {
	background: #fff;
	transform: translateY(-3px);
	box-shadow: var(--ppaff-shadow);
}

.ppaff-rule .ppaff-icon {
	background: #fff;
}

.ppaff-rule .ppaff-h3 {
	margin-bottom: 6px;
}

.ppaff-rule p {
	font-size: 15px;
	color: var(--ppaff-muted);
}

/* R21 (2026-10-09): "You choose the discount" - dark featured block under the rules with the code scale:
   what the customers save with each code (gold, grows) and what stays with the affiliate (white, shrinks). */
.ppaff-choice {
	margin-top: var(--ppaff-gap);
	padding: clamp(22px, 3vw, 32px);
	border-radius: var(--ppaff-radius-lg);
	background:
		radial-gradient(480px 240px at 100% 0%, rgba(232, 181, 74, .24), rgba(232, 181, 74, 0) 60%),
		linear-gradient(135deg, var(--ppaff-ink) 0%, var(--ppaff-primary) 100%);
	color: rgba(255, 255, 255, .86);
	box-shadow: var(--ppaff-shadow-lg);
}

.ppaff-choice-copy {
	display: flex;
	gap: 16px;
	align-items: flex-start;
	min-width: 0;
}

.ppaff-choice-copy .ppaff-icon {
	background: rgba(255, 255, 255, .12);
	color: var(--ppaff-gold);
}

.ppaff-page .ppaff-choice .ppaff-h3 {
	margin-bottom: 8px;
	color: #fff;
	font-size: clamp(19px, 1.8vw, 22px);
}

.ppaff-choice-copy p {
	font-size: 15px;
	line-height: 1.6;
	color: rgba(255, 255, 255, .86);
}

.ppaff-choice .ppaff-pct {
	color: var(--ppaff-gold);
}

.ppaff-choice-scale {
	margin: 22px 0 0;
}

.ppaff-choice-caption {
	margin-bottom: 10px;
	font-size: 13px;
	font-weight: 700;
	letter-spacing: .04em;
	text-transform: uppercase;
	color: rgba(255, 255, 255, .7);
}

.ppaff-page .ppaff-choice-table {
	width: 100%;
	margin: 0;
	border: 0;
	border-collapse: separate;
	border-spacing: 6px;
	table-layout: fixed;
	font-variant-numeric: tabular-nums;
}

.ppaff-page .ppaff-choice-table th,
.ppaff-page .ppaff-choice-table td {
	padding: 10px 4px;
	border: 0;
	border-radius: 10px;
	text-align: center;
	vertical-align: middle;
	font-family: var(--ppaff-title-font);
	font-size: clamp(15px, 1.5vw, 18px);
	font-weight: 800;
	line-height: 1.1;
	letter-spacing: 0;
	text-transform: none;
	color: #fff;
}

.ppaff-page .ppaff-choice-table th[scope="row"] {
	width: 30%;
	padding-left: 0;
	text-align: left;
	font-family: inherit;
	font-size: 13px;
	font-weight: 600;
	line-height: 1.3;
	letter-spacing: 0;
	text-transform: none;
	hyphens: auto;
	color: rgba(255, 255, 255, .78);
}

.ppaff-page .ppaff-choice-table .is-save th[scope="col"] {
	background: rgba(232, 181, 74, calc(.16 + var(--ppaff-k, 0) * .44));
}

.ppaff-page .ppaff-choice-table .is-keep td {
	background: rgba(255, 255, 255, calc(.24 - var(--ppaff-k, 0) * .17));
}

/* --- Tiers: ladder + calculator ------------------------------------------------ */

.ppaff-tiers {
	--ppaff-ladder-h: 220px;
}

.ppaff-ladder-wrap {
	margin: 0 0 var(--ppaff-gap);
	padding: clamp(20px, 3vw, 36px);
	border-radius: var(--ppaff-radius-lg);
	background: linear-gradient(180deg, #fff 0%, var(--ppaff-tint-soft) 100%);
	border: 1px solid var(--ppaff-line);
}

.ppaff-ladder-caption {
	margin-bottom: 22px;
	font-size: 14px;
	font-weight: 600;
	color: var(--ppaff-muted);
	text-align: center;
}

.ppaff-ladder {
	display: grid;
	grid-template-columns: repeat(var(--ppaff-cols, 5), minmax(0, 1fr));
	gap: clamp(8px, 1.6vw, 20px);
	align-items: end;
}

.ppaff-ladder-step {
	--ppaff-fill: 1;
	display: flex;
	flex-direction: column;
	align-items: stretch;
	text-align: center;
	gap: 8px;
}

.ppaff-ladder-pct {
	font-family: var(--ppaff-title-font);
	font-size: clamp(22px, 2.4vw, 32px);
	font-weight: 800;
	line-height: 1;
	color: var(--ppaff-ink);
}

.ppaff-ladder-pct .ppaff-pct {
	color: inherit;
	font-weight: inherit;
}

.ppaff-ladder-bar {
	position: relative;
	display: block;
	height: calc(var(--ppaff-ladder-h) * var(--ppaff-h, 1));
	border-radius: 12px 12px 6px 6px;
	background: var(--ppaff-tint);
	overflow: hidden;
}

.ppaff-ladder-bar::after {
	content: "";
	position: absolute;
	inset: 0;
	border-radius: inherit;
	background: linear-gradient(180deg, #8C7BC4 0%, var(--ppaff-primary) 100%);
	transform: scaleY(var(--ppaff-fill));
	transform-origin: 50% 100%;
	transition: transform .9s var(--ppaff-ease) calc(var(--ppaff-i, 0) * 110ms), opacity .3s;
}

/* Level 1 pays from the first sale: a real rate, in a lighter tone of the brand purple. */
.ppaff-ladder-step:first-child .ppaff-ladder-bar::after {
	background: linear-gradient(180deg, #C2B8E2 0%, #A496D0 100%);
}

.ppaff-ladder-step.is-top .ppaff-ladder-bar::after {
	background: linear-gradient(180deg, #F2CE7E 0%, var(--ppaff-gold) 100%);
}

.ppaff-ladder-label {
	font-weight: 700;
	color: var(--ppaff-ink);
	font-size: 15px;
	line-height: 1.2;
}

.ppaff-ladder-range {
	font-size: 13px;
	line-height: 1.35;
	color: var(--ppaff-muted);
}

.ppaff-ladder-range .ppaff-money {
	color: inherit;
	font-weight: 600;
}

.ppaff-js .ppaff-ladder:not(.is-filled) .ppaff-ladder-step {
	--ppaff-fill: 0;
}

/* The calculator highlights the step the slider sits on. */
.ppaff-ladder-step.is-active .ppaff-ladder-bar {
	box-shadow: 0 0 0 3px #fff, 0 0 0 5px var(--ppaff-primary);
}

.ppaff-ladder-step.is-top.is-active .ppaff-ladder-bar {
	box-shadow: 0 0 0 3px #fff, 0 0 0 5px var(--ppaff-gold);
}

.ppaff-ladder-step.is-active .ppaff-ladder-pct {
	color: var(--ppaff-primary);
}

.ppaff-ladder.has-calc .ppaff-ladder-step:not(.is-reached) .ppaff-ladder-bar::after {
	opacity: .42;
}

.ppaff-head-row .ppaff-anim[data-size="section"] {
	margin-bottom: clamp(24px, 3.2vw, 40px);
}

.ppaff-calc {
	padding: clamp(22px, 3.4vw, 40px);
	border-radius: var(--ppaff-radius-lg);
	background: #fff;
	border: 1px solid var(--ppaff-line);
	box-shadow: var(--ppaff-shadow);
}

.ppaff-calc-head {
	margin-bottom: 24px;
}

.ppaff-calc-head .ppaff-h3 {
	font-size: clamp(20px, 2vw, 24px);
}

.ppaff-calc-head p {
	margin-top: 6px !important;
	color: var(--ppaff-muted);
}

.ppaff-calc-label {
	display: block;
	margin-bottom: 10px;
	font-weight: 700;
	color: var(--ppaff-ink);
}

.ppaff-calc-slider {
	position: relative;
	padding-bottom: 30px;
}

.ppaff-page .ppaff-range {
	--ppaff-thumb: 28px;
	display: block;
	width: 100%;
	height: var(--ppaff-thumb);
	margin: 0;
	padding: 0;
	border: 0;
	background: transparent;
	-webkit-appearance: none;
	appearance: none;
	cursor: pointer;
	box-shadow: none;
}

.ppaff-range::-webkit-slider-runnable-track {
	height: 10px;
	border-radius: 999px;
	background: linear-gradient(90deg, var(--ppaff-primary) 0, var(--ppaff-primary) var(--ppaff-range, 0%), var(--ppaff-tint) var(--ppaff-range, 0%), var(--ppaff-tint) 100%);
}

.ppaff-range::-moz-range-track {
	height: 10px;
	border-radius: 999px;
	background: var(--ppaff-tint);
}

.ppaff-range::-moz-range-progress {
	height: 10px;
	border-radius: 999px;
	background: var(--ppaff-primary);
}

.ppaff-range::-webkit-slider-thumb {
	-webkit-appearance: none;
	appearance: none;
	width: var(--ppaff-thumb);
	height: var(--ppaff-thumb);
	margin-top: calc((10px - var(--ppaff-thumb)) / 2);
	border-radius: 50%;
	background: #fff;
	border: 4px solid var(--ppaff-primary);
	box-shadow: 0 4px 12px rgba(58, 47, 99, .3);
	transition: transform .15s var(--ppaff-ease);
}

.ppaff-range::-moz-range-thumb {
	width: 20px;
	height: 20px;
	border-radius: 50%;
	background: #fff;
	border: 4px solid var(--ppaff-primary);
	box-shadow: 0 4px 12px rgba(58, 47, 99, .3);
}

.ppaff-range:active::-webkit-slider-thumb {
	transform: scale(1.12);
}

.ppaff-range:focus-visible {
	outline: none;
}

.ppaff-range:focus-visible::-webkit-slider-thumb {
	box-shadow: 0 0 0 6px rgba(93, 79, 137, .25), 0 4px 12px rgba(58, 47, 99, .3);
}

.ppaff-range:focus-visible::-moz-range-thumb {
	box-shadow: 0 0 0 6px rgba(93, 79, 137, .25);
}

.ppaff-calc-marks {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	height: 24px;
}

.ppaff-calc-mark {
	position: absolute;
	top: 0;
	left: calc(var(--ppaff-p) * (100% - 28px) + 14px);
	transform: translateX(-50%);
	padding-top: 8px;
	font-size: 12px;
	font-weight: 700;
	color: var(--ppaff-muted);
	white-space: nowrap;
}

.ppaff-calc-mark::before {
	content: "";
	position: absolute;
	top: 0;
	left: 50%;
	width: 2px;
	height: 6px;
	margin-left: -1px;
	border-radius: 2px;
	background: var(--ppaff-border);
}

.ppaff-calc-out {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 12px;
	margin: 18px 0 0;
}

/* Peso amounts ("COP$ 37.400.000") do not fit a quarter of the card: 2 columns, 1 on phones (below). */
.ppaff-page[data-currency="COP"] .ppaff-calc-out {
	grid-template-columns: repeat(2, minmax(0, 1fr));
}

.ppaff-calc-cell {
	padding: 16px 18px;
	border-radius: var(--ppaff-radius-sm);
	background: var(--ppaff-tint-soft);
	border: 1px solid var(--ppaff-line);
	min-width: 0;
}

.ppaff-calc-cell dt {
	margin: 0 0 6px;
	font-size: 13px;
	font-weight: 600;
	line-height: 1.3;
	color: var(--ppaff-muted);
}

.ppaff-calc-cell dd {
	margin: 0;
	font-family: var(--ppaff-title-font);
	font-size: clamp(20px, 2.1vw, 28px);
	font-weight: 800;
	line-height: 1.1;
	color: var(--ppaff-ink);
	font-variant-numeric: tabular-nums;
	overflow-wrap: anywhere;
}

.ppaff-calc-cell.is-key {
	background: var(--ppaff-ink);
	border-color: var(--ppaff-ink);
}

.ppaff-calc-cell.is-key dt {
	color: rgba(255, 255, 255, .78);
}

.ppaff-calc-cell.is-key dd {
	color: var(--ppaff-gold);
}

.ppaff-calc-cell output {
	display: inline-block;
}

.ppaff-calc-cell output.is-bump {
	animation: ppaff-bump .45s var(--ppaff-ease);
}

.ppaff-calc-hint {
	margin-top: 18px !important;
	padding: 12px 16px;
	border-radius: var(--ppaff-radius-sm);
	background: rgba(52, 185, 138, .10);
	color: var(--ppaff-mint-ink);
	font-weight: 600;
}

.ppaff-calc-hint .ppaff-money,
.ppaff-calc-hint .ppaff-pct {
	color: inherit;
	font-weight: 800;
}

.ppaff-calc-keep {
	display: flex;
	gap: 10px;
	align-items: flex-start;
	margin-top: 12px !important;
	padding: 12px 16px;
	border: 1px dashed var(--ppaff-border);
	border-radius: var(--ppaff-radius-sm);
	background: var(--ppaff-tint-soft);
	font-size: 14px;
	line-height: 1.55;
	color: var(--ppaff-text);
}

.ppaff-calc-keep .ppaff-svg {
	width: 18px;
	height: 18px;
	margin-top: 2px;
	color: var(--ppaff-primary);
}

.ppaff-calc-note {
	margin-top: 12px !important;
	font-size: 13px;
	color: var(--ppaff-muted);
}

/* R21 (2026-10-09): the code percent picker + what it does to the commission. */
.ppaff-page .ppaff-calc-code {
	min-width: 0;
	margin: 6px 0 0;
	padding: 0;
	border: 0;
}

.ppaff-page .ppaff-calc-code legend {
	float: left;
	width: 100%;
	margin: 0 0 10px;
	padding: 0;
	border: 0;
	font-family: inherit;
	font-size: inherit;
	line-height: inherit;
	text-transform: none;
}

.ppaff-chips {
	clear: both;
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

.ppaff-chip {
	position: relative;
	margin: 0;
	cursor: pointer;
}

.ppaff-page .ppaff-chip input {
	position: absolute;
	width: 1px;
	height: 1px;
	margin: 0;
	opacity: 0;
}

.ppaff-chip span {
	display: inline-block;
	min-width: 62px;
	padding: 9px 14px;
	border: 1px solid var(--ppaff-border);
	border-radius: 999px;
	background: #fff;
	text-align: center;
	font-weight: 700;
	line-height: 1.2;
	color: var(--ppaff-ink);
	font-variant-numeric: tabular-nums;
	transition: background-color .2s, border-color .2s, color .2s;
}

.ppaff-chip:hover span {
	border-color: var(--ppaff-primary);
}

.ppaff-chip input:checked + span {
	border-color: var(--ppaff-ink);
	background: var(--ppaff-ink);
	color: var(--ppaff-gold);
}

.ppaff-chip input:focus-visible + span {
	outline: 2px solid var(--ppaff-primary);
	outline-offset: 2px;
}

.ppaff-calc-code-hint {
	display: flex;
	gap: 10px;
	align-items: flex-start;
	margin-top: 12px !important;
	padding: 12px 16px;
	border-radius: var(--ppaff-radius-sm);
	background: rgba(232, 181, 74, .16);
	font-weight: 600;
	color: var(--ppaff-gold-ink);
}

.ppaff-calc-code-hint .ppaff-svg {
	width: 18px;
	height: 18px;
	margin-top: 3px;
	flex: 0 0 auto;
}

.ppaff-calc-code-hint .ppaff-pct {
	color: inherit;
}

/* --- Tiers: levels you keep (promotion holds, demotion one level at a time) ------ */

.ppaff-keep {
	display: grid;
	grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr);
	gap: clamp(18px, 3vw, 36px);
	align-items: center;
	margin: 0 0 var(--ppaff-gap);
	padding: clamp(22px, 3.4vw, 40px);
	border-radius: var(--ppaff-radius-lg);
	background:
		radial-gradient(520px 260px at 100% 0%, rgba(232, 181, 74, .22), rgba(232, 181, 74, 0) 60%),
		linear-gradient(135deg, var(--ppaff-ink) 0%, var(--ppaff-primary) 100%);
	color: rgba(255, 255, 255, .86);
	box-shadow: var(--ppaff-shadow);
}

.ppaff-keep-copy {
	display: flex;
	gap: 16px;
	align-items: flex-start;
	min-width: 0;
}

.ppaff-keep-copy .ppaff-icon {
	background: rgba(255, 255, 255, .12);
	color: var(--ppaff-gold);
}

.ppaff-page .ppaff-keep .ppaff-h3 {
	margin-bottom: 8px;
	color: #fff;
	font-size: clamp(19px, 1.8vw, 22px);
}

.ppaff-keep-copy p {
	font-size: 15px;
	line-height: 1.6;
}

.ppaff-keep-copy p + p {
	margin-top: 10px !important;
}

.ppaff-keep-rule {
	color: #fff;
}

.ppaff-keep .ppaff-pct {
	color: var(--ppaff-gold);
}

.ppaff-keep .ppaff-money {
	color: #fff;
}

.ppaff-keep-examples {
	display: grid;
	gap: 12px;
	min-width: 0;
}

.ppaff-keep-example {
	display: flex;
	gap: 12px;
	align-items: flex-start;
	padding: 16px 18px;
	border-radius: var(--ppaff-radius);
	background: rgba(255, 255, 255, .08);
	border: 1px solid rgba(255, 255, 255, .16);
	font-size: 14.5px;
	line-height: 1.55;
}

.ppaff-keep-badge {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	flex: 0 0 auto;
	border-radius: 11px;
}

.ppaff-keep-badge .ppaff-svg {
	width: 20px;
	height: 20px;
	stroke-width: 2.2;
}

.ppaff-keep-example.is-up .ppaff-keep-badge {
	background: rgba(52, 185, 138, .22);
	color: #7EE0BB;
}

.ppaff-keep-example.is-down .ppaff-keep-badge {
	background: rgba(232, 181, 74, .22);
	color: var(--ppaff-gold);
}

/* --- Lifetime customers + milestone bonuses -------------------------------------- */

.ppaff-lifetime-grid {
	align-items: center;
}

.ppaff-checks-bound .ppaff-tick {
	background: rgba(93, 79, 137, .10);
	color: var(--ppaff-primary);
}

.ppaff-milestones {
	padding: clamp(20px, 3vw, 32px);
	border-radius: var(--ppaff-radius-lg);
	background: #fff;
	border: 1px solid var(--ppaff-line);
	box-shadow: var(--ppaff-shadow);
	min-width: 0;
}

.ppaff-milestones-head {
	display: flex;
	gap: 14px;
	align-items: center;
}

.ppaff-milestones-head .ppaff-icon {
	background: rgba(232, 181, 74, .18);
	color: var(--ppaff-gold-ink);
}

.ppaff-page .ppaff-milestones .ppaff-h3 {
	font-size: clamp(19px, 1.8vw, 22px);
}

.ppaff-milestones-intro {
	margin-top: 12px !important;
	font-size: 15px;
	color: var(--ppaff-muted);
}

.ppaff-page .ppaff-ms-table {
	width: 100%;
	margin: 14px 0 6px;
	border: 0;
	border-collapse: separate;
	border-spacing: 0 6px;
	background: none;
	font-variant-numeric: tabular-nums;
	table-layout: fixed;
}

.ppaff-page .ppaff-ms-table thead th {
	padding: 0 14px 2px;
	border: 0;
	background: none;
	font-size: 12px;
	font-weight: 700;
	line-height: 1.3;
	letter-spacing: .04em;
	text-transform: uppercase;
	color: var(--ppaff-muted);
	text-align: left;
}

.ppaff-page .ppaff-ms-table thead th:last-child,
.ppaff-page .ppaff-ms-table td {
	text-align: right;
}

.ppaff-page .ppaff-ms-table tbody th,
.ppaff-page .ppaff-ms-table td {
	padding: 10px 14px;
	border: 0;
	background: var(--ppaff-tint-soft);
	vertical-align: middle;
}

.ppaff-page .ppaff-ms-table tbody th {
	position: relative;
	border-radius: 12px 0 0 12px;
	font-weight: 700;
	color: var(--ppaff-ink);
	text-align: left;
	overflow: hidden;
}

.ppaff-page .ppaff-ms-table td {
	border-radius: 0 12px 12px 0;
}

.ppaff-ms-bar {
	position: absolute;
	left: 0;
	top: 0;
	bottom: 0;
	width: calc(var(--ppaff-w, 1) * 100%);
	border-radius: 12px 0 0 12px;
	background: linear-gradient(90deg, rgba(93, 79, 137, .20) 0%, rgba(93, 79, 137, .07) 100%);
	transform-origin: 0 50%;
	transition: transform .8s var(--ppaff-ease) calc(var(--ppaff-i, 0) * 70ms);
}

.ppaff-js .ppaff-milestones.ppaff-reveal:not(.is-in) .ppaff-ms-bar {
	transform: scaleX(0);
}

.ppaff-ms-count {
	position: relative;
	font-size: 16px;
}

.ppaff-ms-table td .ppaff-money {
	font-size: 16px;
	font-weight: 800;
}

.ppaff-page .ppaff-ms-row.is-top th,
.ppaff-page .ppaff-ms-row.is-top td {
	background: rgba(232, 181, 74, .14);
}

.ppaff-ms-row.is-top .ppaff-ms-bar {
	background: linear-gradient(90deg, rgba(232, 181, 74, .45) 0%, rgba(232, 181, 74, .16) 100%);
}

.ppaff-ms-row.is-top .ppaff-money {
	color: var(--ppaff-gold-ink);
}

.ppaff-ms-note {
	margin-top: 10px !important;
}

/* --- Link ---------------------------------------------------------------------- */

.ppaff-link-grid {
	align-items: center;
}

.ppaff-checks {
	display: grid;
	gap: 14px;
}

.ppaff-checks li {
	display: flex;
	gap: 12px;
	align-items: flex-start;
}

.ppaff-tick {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 28px;
	height: 28px;
	flex: 0 0 auto;
	margin-top: -1px;
	border-radius: 50%;
	background: rgba(52, 185, 138, .14);
	color: var(--ppaff-mint-ink);
}

.ppaff-tick .ppaff-svg {
	width: 16px;
	height: 16px;
	stroke-width: 2.4;
}

.ppaff-browser {
	padding: 24px;
	border-radius: var(--ppaff-radius-lg);
	background: var(--ppaff-tint);
}

.ppaff-browser-label {
	margin-bottom: 12px !important;
	font-size: 13px;
	font-weight: 700;
	letter-spacing: .04em;
	text-transform: uppercase;
	color: var(--ppaff-primary);
}

.ppaff-browser-window {
	border-radius: 16px;
	background: #fff;
	box-shadow: var(--ppaff-shadow-lg);
	overflow: hidden;
}

.ppaff-browser-bar {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 12px 14px;
	border-bottom: 1px solid var(--ppaff-line);
	background: #FBFAFE;
}

.ppaff-dots {
	display: inline-flex;
	gap: 6px;
	flex: 0 0 auto;
}

.ppaff-dots i {
	width: 10px;
	height: 10px;
	border-radius: 50%;
	background: #E2DCEF;
}

.ppaff-dots i:first-child {
	background: #F0A8A0;
}

.ppaff-dots i:nth-child(2) {
	background: #F2CE7E;
}

.ppaff-dots i:last-child {
	background: #9ED9C1;
}

.ppaff-page .ppaff-url {
	display: block;
	flex: 1 1 auto;
	min-width: 0;
	padding: 8px 12px;
	border-radius: 999px;
	background: var(--ppaff-tint-soft);
	border: 1px solid var(--ppaff-line);
	color: var(--ppaff-text);
	font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
	font-size: 14px;
	line-height: 1.4;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.ppaff-url-host {
	color: var(--ppaff-muted);
}

.ppaff-page .ppaff-url mark {
	padding: 1px 4px;
	border-radius: 6px;
	background: rgba(232, 181, 74, .30);
	color: var(--ppaff-ink);
	font-weight: 700;
}

.ppaff-browser-body {
	position: relative;
	display: grid;
	gap: 10px;
	padding: 22px 18px 26px;
}

.ppaff-skel {
	display: block;
	height: 10px;
	border-radius: 6px;
	background: var(--ppaff-tint);
}

.ppaff-skel-a {
	width: 55%;
	height: 14px;
	background: #E2DCEF;
}

.ppaff-skel-b {
	width: 88%;
}

.ppaff-skel-c {
	width: 70%;
}

.ppaff-ref-pill {
	position: absolute;
	right: 16px;
	bottom: 16px;
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 6px 12px;
	border-radius: 999px;
	background: var(--ppaff-primary);
	color: #fff;
	font-size: 13px;
	box-shadow: 0 8px 18px rgba(93, 79, 137, .3);
}

.ppaff-ref-pill .ppaff-svg {
	width: 16px;
	height: 16px;
}

.ppaff-browser .ppaff-small {
	margin-top: 16px !important;
}

.ppaff-link-side {
	display: grid;
	gap: 16px;
	min-width: 0;
}

.ppaff-consent-note .ppaff-svg {
	color: var(--ppaff-gold-ink);
}

.ppaff-cabinet {
	display: flex;
	gap: 14px;
	align-items: flex-start;
	padding: 18px 20px;
	border-radius: var(--ppaff-radius);
	background: #fff;
	border: 1px solid var(--ppaff-line);
	box-shadow: 0 1px 2px rgba(58, 47, 99, .04);
}

.ppaff-cabinet > div {
	min-width: 0;
}

.ppaff-cabinet p {
	font-size: 15px;
	line-height: 1.6;
	overflow-wrap: anywhere;
}

.ppaff-page .ppaff-cabinet-cta {
	min-height: 44px;
	margin-top: 12px;
	padding: 0 18px;
	font-size: 15px;
}

/* --- Payouts ---------------------------------------------------------------- */

.ppaff-cycle {
	display: flex;
	gap: 18px;
	align-items: center;
	margin: 0 0 var(--ppaff-gap);
	padding: 22px 24px;
	border-radius: var(--ppaff-radius);
	background: linear-gradient(135deg, #fff 0%, var(--ppaff-tint-soft) 100%);
	border: 1px solid var(--ppaff-line);
}

.ppaff-cycle > div {
	flex: 1 1 auto;
	min-width: 0;
}

.ppaff-cycle p {
	margin-top: 4px !important;
	font-size: 15px;
	color: var(--ppaff-muted);
}

.ppaff-cycle-days {
	flex: 0 0 auto;
	padding: 8px 18px;
	border-radius: 14px;
	background: #fff;
	border: 1px solid var(--ppaff-line);
	font-family: var(--ppaff-title-font);
	font-size: clamp(24px, 2.6vw, 34px);
	font-weight: 800;
	line-height: 1.1;
	color: var(--ppaff-primary);
	font-variant-numeric: tabular-nums;
	white-space: nowrap;
}

.ppaff-payouts-list {
	grid-template-columns: repeat(3, minmax(0, 1fr));
}

.ppaff-payouts-list[data-count="4"] {
	grid-template-columns: repeat(4, minmax(0, 1fr));
}

.ppaff-payouts-list[data-count="2"] {
	grid-template-columns: repeat(2, minmax(0, 1fr));
}

.ppaff-payout-store-credit {
	border-color: rgba(232, 181, 74, .55);
	background: linear-gradient(180deg, #FFFCF4 0%, #fff 60%);
}

.ppaff-payout-store-credit .ppaff-icon {
	background: rgba(232, 181, 74, .18);
	color: var(--ppaff-gold-ink);
}

.ppaff-payout-badge {
	position: absolute;
	top: 18px;
	right: 18px;
	padding: 4px 10px;
	border-radius: 999px;
	background: var(--ppaff-gold);
	color: var(--ppaff-ink);
	font-size: 13px;
	font-weight: 800;
	line-height: 1.3;
	font-variant-numeric: tabular-nums;
}

.ppaff-payout-notes {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 12px var(--ppaff-gap);
	margin-top: var(--ppaff-gap) !important;
}

.ppaff-payout-note {
	display: flex;
	gap: 12px;
	align-items: flex-start;
	padding: 14px 16px;
	border-radius: var(--ppaff-radius-sm);
	background: var(--ppaff-tint-soft);
	border: 1px solid var(--ppaff-line);
	font-size: 14.5px;
	line-height: 1.55;
}

.ppaff-payout-note .ppaff-svg {
	width: 20px;
	height: 20px;
	margin-top: 1px;
	color: var(--ppaff-primary);
}

.ppaff-payout-note.is-tax {
	grid-column: 1 / -1;
	background: rgba(232, 181, 74, .12);
	border-color: rgba(232, 181, 74, .45);
	color: var(--ppaff-ink);
}

.ppaff-payout-note.is-tax .ppaff-svg {
	color: var(--ppaff-gold-ink);
}

/* --- Refunds ---------------------------------------------------------------- */

.ppaff-refunds-card {
	display: flex;
	gap: clamp(18px, 3vw, 36px);
	align-items: flex-start;
	padding: clamp(22px, 3.4vw, 40px);
	border-radius: var(--ppaff-radius-lg);
	background: var(--ppaff-tint-soft);
	border: 1px solid var(--ppaff-line);
}

.ppaff-refunds-card .ppaff-anim {
	border-radius: 50%;
	background: #fff;
	box-shadow: var(--ppaff-shadow);
}

.ppaff-refunds-copy {
	flex: 1 1 auto;
	min-width: 0;
}

.ppaff-refunds-copy .ppaff-checks {
	margin-top: 20px;
}

.ppaff-checks-plain .ppaff-tick {
	background: rgba(93, 79, 137, .10);
	color: var(--ppaff-primary);
}

/* --- Terms ------------------------------------------------------------------ */

.ppaff-terms-list {
	counter-reset: ppaff-term;
	columns: 2;
	column-gap: clamp(24px, 4vw, 56px);
}

.ppaff-terms-list li {
	position: relative;
	counter-increment: ppaff-term;
	break-inside: avoid;
	min-height: 30px;
	margin: 0 0 16px;
	padding-left: 44px;
	font-size: 15px;
}

/* The badge starts at the top of the item (top < 0 leaked a 2px sliver of the first
   badge of column 2 to the bottom of column 1). */
.ppaff-terms-list li::before {
	content: counter(ppaff-term);
	position: absolute;
	left: 0;
	top: 0;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 30px;
	height: 30px;
	border-radius: 9px;
	background: var(--ppaff-tint);
	color: var(--ppaff-primary);
	font-size: 13px;
	font-weight: 800;
}

/* The US-only items (research use only, no human-use content). */
.ppaff-terms-list li.is-us::before {
	background: rgba(232, 181, 74, .22);
	color: var(--ppaff-gold-ink);
}

.ppaff-research-note {
	max-width: 860px;
}

/* --- FAQ -------------------------------------------------------------------- */

.ppaff-faq-list {
	display: grid;
	gap: 12px;
	max-width: 860px;
	margin: 0 auto;
}

.ppaff-qa {
	border-radius: var(--ppaff-radius);
	background: #fff;
	border: 1px solid var(--ppaff-line);
	transition: border-color .2s, box-shadow .2s;
}

.ppaff-qa[open] {
	border-color: var(--ppaff-border);
	box-shadow: var(--ppaff-shadow);
}

.ppaff-qa summary {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	padding: 18px 22px;
	cursor: pointer;
	list-style: none;
	font-weight: 700;
	color: var(--ppaff-ink);
	font-size: 17px;
	line-height: 1.35;
}

.ppaff-qa summary::-webkit-details-marker {
	display: none;
}

.ppaff-qa summary::marker {
	content: "";
}

.ppaff-qa summary .ppaff-svg {
	width: 22px;
	height: 22px;
	color: var(--ppaff-primary);
	transition: transform .25s var(--ppaff-ease);
}

.ppaff-qa[open] summary .ppaff-svg {
	transform: rotate(180deg);
}

.ppaff-qa summary:hover {
	color: var(--ppaff-primary);
}

.ppaff-qa-a {
	padding: 0 22px 20px;
	color: var(--ppaff-muted);
}

/* --- Apply: form ------------------------------------------------------------ */

.ppaff-apply-grid {
	display: grid;
	grid-template-columns: minmax(0, .8fr) minmax(0, 1.6fr);
	gap: clamp(24px, 4vw, 56px);
	align-items: start;
	padding: clamp(22px, 4vw, 56px);
	border-radius: var(--ppaff-radius-lg);
	background:
		radial-gradient(600px 300px at 0% 0%, rgba(93, 79, 137, .14), rgba(93, 79, 137, 0) 60%),
		var(--ppaff-tint);
	border: 1px solid var(--ppaff-line);
}

.ppaff-apply-aside {
	position: sticky;
	top: 110px;
}

.ppaff-mini-steps {
	display: grid;
	gap: 12px;
	margin-top: 24px !important;
}

.ppaff-mini-steps li {
	display: flex;
	align-items: center;
	gap: 12px;
	font-weight: 600;
	color: var(--ppaff-ink);
}

.ppaff-mini-num {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 30px;
	height: 30px;
	flex: 0 0 auto;
	border-radius: 50%;
	background: #fff;
	border: 1px solid var(--ppaff-border);
	color: var(--ppaff-primary);
	font-size: 13px;
	font-weight: 800;
}

.ppaff-privacy {
	display: flex;
	gap: 10px;
	align-items: flex-start;
	margin-top: 26px !important;
}

.ppaff-privacy .ppaff-svg {
	width: 20px;
	height: 20px;
	color: var(--ppaff-mint-ink);
	margin-top: 2px;
}

.ppaff-form-card {
	padding: clamp(20px, 3.2vw, 40px);
	border-radius: var(--ppaff-radius);
	background: #fff;
	box-shadow: var(--ppaff-shadow-lg);
}

.ppaff-form-grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 18px 20px;
}

.ppaff-field {
	display: flex;
	flex-direction: column;
	gap: 6px;
	min-width: 0;
	margin: 0;
	padding: 0;
	border: 0;
}

.ppaff-field[hidden] {
	display: none;
}

.ppaff-field-wide {
	grid-column: 1 / -1;
}

.ppaff-form .ppaff-field > label,
.ppaff-form .ppaff-field legend {
	padding: 0;
	font-size: 14px;
	font-weight: 700;
	line-height: 1.35;
	color: var(--ppaff-ink);
}

.ppaff-req {
	margin-left: 3px;
	color: var(--ppaff-primary);
}

.ppaff-hint {
	margin: -2px 0 2px !important;
	font-size: 13px;
	color: var(--ppaff-muted);
}

.ppaff-form .ppaff-input {
	display: block;
	width: 100%;
	min-height: 48px;
	height: auto;
	margin: 0;
	padding: 11px 14px;
	border: 1.5px solid var(--ppaff-border);
	border-radius: 12px;
	background-color: #fff;
	color: var(--ppaff-ink);
	font-family: inherit;
	font-size: 16px;
	line-height: 1.4;
	box-shadow: none;
	transition: border-color .15s, box-shadow .15s;
}

.ppaff-form textarea.ppaff-input {
	min-height: 112px;
	resize: vertical;
}

.ppaff-form select.ppaff-input {
	padding-right: 40px;
	-webkit-appearance: none;
	appearance: none;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%235D4F89' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 12px center;
	background-size: 18px 18px;
	cursor: pointer;
}

.ppaff-form .ppaff-input::placeholder {
	color: #9993AE;
	opacity: 1;
}

.ppaff-form .ppaff-input:hover {
	border-color: #B9AED6;
}

.ppaff-form .ppaff-input:focus {
	border-color: var(--ppaff-primary);
	box-shadow: 0 0 0 4px rgba(93, 79, 137, .14);
	outline: none;
}

.ppaff-field.is-invalid .ppaff-input {
	border-color: var(--ppaff-danger);
	box-shadow: 0 0 0 3px rgba(184, 58, 50, .10);
}

.ppaff-field-hint {
	display: flex;
	gap: 6px;
	align-items: flex-start;
	margin: 2px 0 0 !important;
	color: var(--ppaff-mint-ink);
	font-weight: 600;
}

.ppaff-field-hint .ppaff-svg {
	width: 16px;
	height: 16px;
	margin-top: 1px;
}

.ppaff-field-error {
	margin: 0 !important;
	font-size: 13px;
	font-weight: 600;
	line-height: 1.4;
	color: var(--ppaff-danger);
}

.ppaff-field-error[hidden] {
	display: none;
}

.ppaff-chips {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

.ppaff-chip-opt {
	position: relative;
	display: inline-flex;
	margin: 0;
	cursor: pointer;
}

.ppaff-chip-opt input {
	position: absolute;
	opacity: 0;
	width: 1px;
	height: 1px;
	margin: 0;
	pointer-events: none;
}

/*
 * Чипът е с постоянна ширина: иконата има запазени 16px (без анимация на width),
 * а текстът (.ppaff-chip-txt) стои изместен с 9px в празното място, докато
 * чипът не е избран - така и двете състояния изглеждат центрирани
 * (10 + 16 + 6 - 9 = 23px вляво, 14 + 9 = 23px вдясно). Анимират се само
 * transform/opacity.
 */
.ppaff-chip-opt > span {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	min-height: 40px;
	padding: 8px 14px 8px 10px;
	border: 1.5px solid var(--ppaff-border);
	border-radius: 999px;
	background: #fff;
	color: var(--ppaff-text);
	font-size: 14px;
	font-weight: 600;
	line-height: 1.2;
	transition: background-color .15s, border-color .15s, color .15s, transform .15s var(--ppaff-ease);
	user-select: none;
}

.ppaff-chip-opt .ppaff-svg {
	width: 16px;
	height: 16px;
	opacity: 0;
	stroke-width: 2.6;
	transform: scale(.5);
	transition: transform .15s var(--ppaff-ease), opacity .15s;
}

.ppaff-chip-txt {
	transform: translateX(-9px);
	transition: transform .15s var(--ppaff-ease);
}

.ppaff-chip-opt:hover > span {
	border-color: var(--ppaff-primary);
}

.ppaff-chip-opt input:checked + span {
	background: var(--ppaff-primary);
	border-color: var(--ppaff-primary);
	color: #fff;
}

.ppaff-chip-opt input:checked + span .ppaff-svg {
	opacity: 1;
	transform: scale(1);
}

.ppaff-chip-opt input:checked + span .ppaff-chip-txt {
	transform: none;
}

.ppaff-chip-opt input:focus-visible + span {
	outline: 3px solid rgba(93, 79, 137, .45);
	outline-offset: 2px;
}

.ppaff-field.is-invalid .ppaff-chip-opt > span {
	border-color: rgba(184, 58, 50, .45);
}

.ppaff-form .ppaff-check {
	display: flex;
	gap: 12px;
	align-items: flex-start;
	margin: 0;
	font-size: 15px;
	font-weight: 400;
	line-height: 1.5;
	color: var(--ppaff-text);
	cursor: pointer;
}

.ppaff-check input {
	width: 22px;
	height: 22px;
	flex: 0 0 auto;
	margin: 1px 0 0;
	accent-color: var(--ppaff-primary);
	cursor: pointer;
}

.ppaff-field.is-invalid .ppaff-check input {
	outline: 2px solid var(--ppaff-danger);
	outline-offset: 2px;
}

.ppaff-inline-link {
	font-weight: 700;
}

/* Honeypot: off-screen, not display:none (some bots skip hidden inputs). */
.ppaff-hp {
	position: absolute !important;
	left: -10000px !important;
	top: auto;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

.ppaff-form-foot {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 14px 20px;
	margin-top: 26px;
}

.ppaff-page .ppaff-submit {
	min-width: 220px;
}

.ppaff-page .ppaff-submit[disabled] {
	opacity: .75;
	cursor: progress;
	transform: none;
}

.ppaff-submit[aria-busy="true"] .ppaff-svg {
	animation: ppaff-nudge .9s ease-in-out infinite;
}

.ppaff-form-status {
	flex: 1 1 220px;
	font-size: 15px;
	font-weight: 600;
	color: var(--ppaff-muted);
}

.ppaff-form-status:empty {
	display: none;
}

.ppaff-form-status.is-error {
	color: var(--ppaff-danger);
}

.ppaff-form-done {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 14px;
	padding: clamp(28px, 5vw, 56px) 12px;
	text-align: center;
	outline: none;
}

.ppaff-form-done-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 72px;
	height: 72px;
	border-radius: 50%;
	background: rgba(52, 185, 138, .14);
	color: var(--ppaff-mint-ink);
	animation: ppaff-pop .5s var(--ppaff-ease);
}

.ppaff-form-done-icon .ppaff-svg {
	width: 36px;
	height: 36px;
	stroke-width: 2.4;
}

.ppaff-form-done p {
	max-width: 52ch;
	color: var(--ppaff-muted);
	overflow-wrap: anywhere;
}

.ppaff-form-done.is-approved .ppaff-form-done-icon {
	background: rgba(232, 181, 74, .2);
	color: var(--ppaff-gold-ink);
}

.ppaff-page .ppaff-form-done .ppaff-btn {
	margin-top: 6px;
}

/* --- Final CTA -------------------------------------------------------------- */

.ppaff-final-card {
	position: relative;
	padding: clamp(32px, 6vw, 80px) clamp(22px, 5vw, 72px);
	border-radius: var(--ppaff-radius-lg);
	background:
		radial-gradient(500px 260px at 100% 0%, rgba(232, 181, 74, .35), rgba(232, 181, 74, 0) 60%),
		radial-gradient(600px 320px at 0% 100%, rgba(140, 123, 196, .45), rgba(140, 123, 196, 0) 60%),
		linear-gradient(135deg, var(--ppaff-ink) 0%, var(--ppaff-primary) 100%);
	color: rgba(255, 255, 255, .9);
	text-align: center;
	overflow: hidden;
}

.ppaff-final-card .ppaff-h2 {
	max-width: 22ch;
	margin: 0 auto;
	color: #fff;
}

.ppaff-final-card p {
	max-width: 60ch;
	margin: 16px auto 0;
	font-size: clamp(16px, 1.4vw, 18px);
}

.ppaff-final-card .ppaff-pct,
.ppaff-final-card .ppaff-money {
	color: var(--ppaff-gold);
}

.ppaff-final-card .ppaff-ctas {
	justify-content: center;
}

.ppaff-page .ppaff-top {
	color: rgba(255, 255, 255, .85);
	font-size: 15px;
	font-weight: 600;
}

.ppaff-page .ppaff-top:hover {
	color: #fff;
}

/* --- Sticky mobile CTA ------------------------------------------------------ */

.ppaff-sticky-cta {
	display: none;
}

/* --- Reveal motion (only with JS, see .ppaff-js) ----------------------------- */

.ppaff-js .ppaff-reveal {
	opacity: 0;
	transform: translateY(16px);
	transition: opacity .5s var(--ppaff-ease), transform .5s var(--ppaff-ease);
	transition-delay: calc(var(--ppaff-i, 0) * 70ms);
}

.ppaff-js .ppaff-reveal.is-in {
	opacity: 1;
	transform: none;
}

/* Hover lift stays snappy after the reveal finished. */
.ppaff-js .ppaff-card.ppaff-reveal.is-in,
.ppaff-js .ppaff-rule.ppaff-reveal.is-in {
	transition: opacity .5s var(--ppaff-ease), transform .25s var(--ppaff-ease), box-shadow .25s var(--ppaff-ease), border-color .25s, background-color .25s;
	transition-delay: 0s;
}

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

@keyframes ppaff-bob {
	0%, 100% { transform: translateY(0); }
	50% { transform: translateY(-8px); }
}

@keyframes ppaff-bump {
	0% { transform: scale(1); }
	40% { transform: scale(1.12); }
	100% { transform: scale(1); }
}

@keyframes ppaff-pop {
	0% { transform: scale(.6); opacity: 0; }
	100% { transform: scale(1); opacity: 1; }
}

@keyframes ppaff-nudge {
	0%, 100% { transform: translateX(0); }
	50% { transform: translateX(4px); }
}

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

@media (max-width: 1100px) {
	.ppaff-types {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.ppaff-calc-out {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.ppaff-payouts-list,
	.ppaff-payouts-list[data-count="4"] {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 960px) {
	.ppaff-hero-grid,
	.ppaff-split,
	.ppaff-coupon-grid,
	.ppaff-apply-grid {
		grid-template-columns: minmax(0, 1fr);
	}

	.ppaff-hero-art {
		min-height: 280px;
	}

	.ppaff-steps {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		row-gap: 36px;
	}

	.ppaff-steps::before {
		display: none;
	}

	.ppaff-keep {
		grid-template-columns: minmax(0, 1fr);
	}

	/* One column: the sticky side would park over the rule cards while they scroll by. */
	.ppaff-coupon-side,
	.ppaff-apply-aside {
		position: static;
	}

	.ppaff-terms-list {
		columns: 1;
	}
}

@media (max-width: 768px) {
	.ppaff-sticky-cta {
		position: fixed;
		left: 12px;
		right: 64px;
		bottom: calc(12px + env(safe-area-inset-bottom, 0px));
		z-index: 340;
		display: flex;
		align-items: center;
		justify-content: center;
		gap: 8px;
		min-height: 48px;
		padding: 0 20px;
		border-radius: 999px;
		background: var(--ppaff-primary);
		color: #fff !important;
		font-weight: 700;
		font-size: 16px;
		text-decoration: none;
		box-shadow: 0 10px 26px rgba(58, 47, 99, .35);
		transition: transform .3s var(--ppaff-ease), opacity .3s, visibility 0s linear 0s;
	}

	.ppaff-sticky-cta .ppaff-svg {
		width: 20px;
		height: 20px;
	}

	/* Above Woodmart's 55px mobile bottom toolbar, beside its scroll-to-top button. */
	.sticky-toolbar-on .ppaff-sticky-cta {
		bottom: calc(67px + env(safe-area-inset-bottom, 0px));
	}

	.ppaff-sticky-cta.is-hidden {
		transform: translateY(160%);
		opacity: 0;
		visibility: hidden;
		transition: transform .3s var(--ppaff-ease), opacity .3s, visibility 0s linear .3s;
	}

	/* Room so the CTA never covers the last lines of the page. */
	.ppaff-page {
		padding-bottom: 72px;
	}
}

@media (max-width: 640px) {
	.ppaff-page {
		font-size: 15.5px;
	}

	.ppaff-hero-grid {
		padding: 26px 20px 28px;
		border-radius: 22px;
	}

	.ppaff-hero-art {
		min-height: 210px;
	}

	.ppaff-orbit {
		width: 212px;
		height: 212px;
	}

	.ppaff-orbit::after {
		inset: -30px;
	}

	.ppaff-anim[data-size="hero"] {
		width: 180px;
		height: 180px;
	}

	.ppaff-anim[data-size="step"] {
		width: 72px;
		height: 72px;
	}

	.ppaff-anim[data-size="section"] {
		width: 120px;
		height: 120px;
	}

	.ppaff-anim[data-size="small"] {
		width: 92px;
		height: 92px;
	}

	.ppaff-float {
		padding: 7px 11px;
		font-size: 14px;
	}

	.ppaff-float-a {
		left: 0;
		top: 6%;
	}

	.ppaff-float-b {
		right: 0;
		bottom: 6%;
	}

	.ppaff-stats {
		gap: 8px;
	}

	.ppaff-stat {
		padding: 12px 10px;
	}

	.ppaff-stat-label {
		font-size: 12px;
	}

	.ppaff-stats[data-count="4"] {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.ppaff-page .ppaff-choice-table {
		border-spacing: 3px;
	}

	.ppaff-page .ppaff-choice-table th,
	.ppaff-page .ppaff-choice-table td {
		padding: 8px 0;
		font-size: 13px;
		border-radius: 8px;
	}

	.ppaff-page .ppaff-choice-table th[scope="row"] {
		width: 32%;
		font-size: 12px;
	}

	.ppaff-choice-copy {
		flex-direction: column;
		gap: 12px;
	}

	/* All code choices in one row on phones: equal columns instead of wrapping. */
	.ppaff-chips {
		display: grid;
		grid-auto-flow: column;
		grid-auto-columns: minmax(0, 1fr);
		gap: 6px;
	}

	.ppaff-chip span {
		display: block;
		min-width: 0;
		padding: 8px 2px;
		font-size: 14px;
	}

	.ppaff-page .ppaff-ctas .ppaff-btn {
		flex: 1 1 100%;
	}

	.ppaff-types,
	.ppaff-rules {
		grid-template-columns: minmax(0, 1fr);
	}

	.ppaff-card {
		flex-direction: row;
		flex-wrap: wrap;
		align-items: center;
		column-gap: 14px;
		padding: 18px;
	}

	.ppaff-card .ppaff-h3 {
		flex: 1 1 0;
		min-width: 0;
	}

	.ppaff-card p {
		flex: 1 1 100%;
	}

	.ppaff-icon {
		width: 44px;
		height: 44px;
	}

	.ppaff-steps {
		grid-template-columns: minmax(0, 1fr);
		row-gap: 22px;
	}

	.ppaff-step {
		display: grid;
		grid-template-columns: 92px minmax(0, 1fr);
		column-gap: 16px;
		align-items: center;
		text-align: left;
		padding: 0;
	}

	.ppaff-step-art {
		grid-row: span 2;
		width: 92px;
		height: 92px;
		margin: 0;
		align-self: start;
	}

	.ppaff-step-num {
		width: 28px;
		height: 28px;
		font-size: 12px;
	}

	.ppaff-step .ppaff-h3 {
		margin: 0;
		align-self: end;
	}

	.ppaff-step p {
		align-self: start;
	}

	.ppaff-ticket {
		gap: 12px;
		padding: 18px 18px 18px 14px;
	}

	.ppaff-ticket-copy {
		padding-left: 12px;
	}

	/* Section illustrations move above the heading instead of beside it. */
	.ppaff-head-row {
		flex-direction: column;
		align-items: flex-start;
		gap: 0;
	}

	.ppaff-head-row .ppaff-anim {
		order: -1;
		margin: 0 0 4px;
	}

	/* Ladder turns into horizontal rows: label + range | bar | pct. */
	.ppaff-ladder {
		grid-template-columns: minmax(0, 1fr);
		gap: 10px;
	}

	.ppaff-ladder-step {
		display: grid;
		grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr) 52px;
		grid-template-areas: "label bar pct" "range bar pct";
		align-items: center;
		column-gap: 12px;
		row-gap: 0;
		text-align: left;
	}

	.ppaff-ladder-label {
		grid-area: label;
		font-size: 14px;
	}

	.ppaff-ladder-range {
		grid-area: range;
		font-size: 12px;
	}

	.ppaff-ladder-bar {
		grid-area: bar;
		height: 14px;
		width: calc(100% * var(--ppaff-h, 1));
		border-radius: 999px;
	}

	.ppaff-ladder-bar::after {
		transform: scaleX(var(--ppaff-fill));
		transform-origin: 0 50%;
	}

	.ppaff-ladder-pct {
		grid-area: pct;
		font-size: 20px;
		text-align: right;
	}

	.ppaff-calc-out {
		gap: 8px;
	}

	/* Long peso amounts ("COP$ 4.860.000") get a full row each instead of breaking mid-number. */
	.ppaff-page[data-currency="COP"] .ppaff-calc-out {
		grid-template-columns: minmax(0, 1fr);
	}

	.ppaff-calc-cell {
		padding: 12px;
	}

	.ppaff-browser {
		padding: 16px;
	}

	/* Let the example link wrap: the ?ref= part is the point, never ellipsize it. */
	.ppaff-page .ppaff-url {
		font-size: 12.5px;
		white-space: normal;
		overflow-wrap: anywhere;
		border-radius: 12px;
	}

	.ppaff-rule {
		flex-direction: row;
		align-items: flex-start;
		gap: 14px;
		padding: 18px;
	}

	.ppaff-apply-grid {
		padding: 22px 12px 12px;
		border-radius: 22px;
	}

	.ppaff-apply-aside {
		padding: 0 8px;
	}

	.ppaff-mini-steps {
		display: none;
	}

	.ppaff-form-card {
		padding: 20px 16px;
	}

	.ppaff-refunds-card {
		flex-direction: column;
	}

	.ppaff-payouts-list,
	.ppaff-payouts-list[data-count="2"],
	.ppaff-payouts-list[data-count="4"],
	.ppaff-payout-notes {
		grid-template-columns: minmax(0, 1fr);
	}

	/* Icon and the payout days on top, the copy full width under them. */
	.ppaff-cycle {
		display: grid;
		grid-template-columns: auto minmax(0, 1fr) auto;
		gap: 12px 14px;
		padding: 18px;
	}

	.ppaff-cycle > div {
		grid-column: 1 / -1;
		grid-row: 2;
	}

	.ppaff-cycle-days {
		grid-column: 3;
		grid-row: 1;
		padding: 6px 14px;
	}

	.ppaff-keep {
		padding: 22px 18px;
		border-radius: 22px;
	}

	.ppaff-keep-copy {
		flex-direction: column;
		gap: 12px;
	}

	.ppaff-keep-example {
		padding: 14px;
	}

	.ppaff-milestones {
		padding: 20px 14px;
		border-radius: 22px;
	}

	.ppaff-page .ppaff-ms-table thead th,
	.ppaff-page .ppaff-ms-table tbody th,
	.ppaff-page .ppaff-ms-table td {
		padding-left: 12px;
		padding-right: 12px;
	}

	.ppaff-cabinet {
		padding: 16px;
	}

	.ppaff-form-grid {
		grid-template-columns: minmax(0, 1fr);
	}

	.ppaff-page .ppaff-submit {
		width: 100%;
	}

	.ppaff-qa summary {
		padding: 16px 18px;
		font-size: 16px;
	}

	.ppaff-qa-a {
		padding: 0 18px 18px;
	}
}

/* Narrow phones: the first thresholds sit close on the EUR scale of the slider and their
   rate labels would touch or overlap (320-414px) - every second mark drops to a lower row
   on a longer tick. Works for any number of levels, without JS. */
@media (max-width: 480px) {
	.ppaff-calc-slider {
		padding-bottom: 46px;
	}

	.ppaff-calc-marks {
		height: 40px;
	}

	.ppaff-calc-mark:nth-child(even) {
		padding-top: 22px;
	}

	.ppaff-calc-mark:nth-child(even)::before {
		height: 20px;
	}
}

/* --- Reduced motion -----------------------------------------------------------
   Страницата се движи и при prefers-reduced-motion (Драго, 2026-10-07: Windows
   "Animation effects" off замразяваше всичко). Elementor-ският custom-frontend.min.css
   нулира ВСЕКИ преход на сайта при тази настройка (`html * { transition-duration: 0s
   !important; transition-delay: 0s !important }`), затова тук нашите преходи се
   повтарят с !important и по-висока специфичност. Блокът е генериран от transition
   декларациите по-горе - при промяна на преход го обнови и тук. JS-ът спира само
   smooth scroll-а. */

@media (prefers-reduced-motion: reduce) {
	html .ppaff-page .ppaff-btn {
		transition: transform .2s var(--ppaff-ease), box-shadow .2s var(--ppaff-ease), background-color .2s, color .2s, border-color .2s !important;
	}

	html .ppaff-page .ppaff-btn .ppaff-svg {
		transition: transform .2s var(--ppaff-ease) !important;
	}

	html .ppaff-card {
		transition: transform .25s var(--ppaff-ease), box-shadow .25s var(--ppaff-ease), border-color .25s !important;
	}

	html .ppaff-icon {
		transition: background-color .25s, color .25s, transform .25s var(--ppaff-ease) !important;
	}

	html .ppaff-step-art {
		transition: transform .3s var(--ppaff-ease), box-shadow .3s var(--ppaff-ease) !important;
	}

	html .ppaff-rule {
		transition: transform .25s var(--ppaff-ease), box-shadow .25s var(--ppaff-ease), background-color .25s !important;
	}

	html .ppaff-ladder-bar::after {
		transition: transform .9s var(--ppaff-ease) calc(var(--ppaff-i, 0) * 110ms), opacity .3s !important;
	}

	html .ppaff-ms-bar {
		transition: transform .8s var(--ppaff-ease) calc(var(--ppaff-i, 0) * 70ms) !important;
	}

	html .ppaff-range::-webkit-slider-thumb {
		transition: transform .15s var(--ppaff-ease) !important;
	}

	html .ppaff-qa {
		transition: border-color .2s, box-shadow .2s !important;
	}

	html .ppaff-qa summary .ppaff-svg {
		transition: transform .25s var(--ppaff-ease) !important;
	}

	html .ppaff-form .ppaff-input {
		transition: border-color .15s, box-shadow .15s !important;
	}

	html .ppaff-chip-opt > span {
		transition: background-color .15s, border-color .15s, color .15s, transform .15s var(--ppaff-ease) !important;
	}

	html .ppaff-chip-opt .ppaff-svg {
		transition: transform .15s var(--ppaff-ease), opacity .15s !important;
	}

	html .ppaff-chip-txt {
		transition: transform .15s var(--ppaff-ease) !important;
	}

	html .ppaff-js .ppaff-reveal {
		transition: opacity .5s var(--ppaff-ease), transform .5s var(--ppaff-ease) !important;
		transition-delay: calc(var(--ppaff-i, 0) * 70ms) !important;
	}

	html .ppaff-js .ppaff-card.ppaff-reveal.is-in,
	html .ppaff-js .ppaff-rule.ppaff-reveal.is-in {
		transition: opacity .5s var(--ppaff-ease), transform .25s var(--ppaff-ease), box-shadow .25s var(--ppaff-ease), border-color .25s, background-color .25s !important;
		transition-delay: 0s !important;
	}
}

@media (prefers-reduced-motion: reduce) and (max-width: 768px) {
	html .ppaff-sticky-cta {
		transition: transform .3s var(--ppaff-ease), opacity .3s, visibility 0s linear 0s !important;
	}

	html .ppaff-sticky-cta.is-hidden {
		transition: transform .3s var(--ppaff-ease), opacity .3s, visibility 0s linear .3s !important;
	}
}

/* --- Print ------------------------------------------------------------------ */

@media print {
	.ppaff-anim,
	.ppaff-hero-art,
	.ppaff-sticky-cta,
	.ppaff-skip,
	.ppaff-calc-slider,
	.ppaff-apply {
		display: none !important;
	}

	.ppaff-js .ppaff-reveal {
		opacity: 1;
		transform: none;
	}

	.ppaff-qa:not([open]) .ppaff-qa-a {
		display: block;
	}
}