/* ====================================================
   PILLAR GUIDE — Knowledge Base long-form template
   (page-pillar-guide.php)
==================================================== */

.pg-main { background: var(--surface-light); }

/* ---------- Hero ---------- */
.pg-hero { padding-bottom: 64px; }
.pg-hero h1 { max-width: 900px; font-size: clamp(2.1rem, 5vw, 3.4rem); }
.pg-h1-accent {
	display: block;
	background: linear-gradient(90deg, var(--orange), var(--orange-light));
	-webkit-background-clip: text; background-clip: text;
	color: transparent;
}
.pg-meta {
	list-style: none;
	display: flex; flex-wrap: wrap; gap: 10px 22px;
	margin: 0 0 30px;
	font-family: var(--font-mono); font-size: 12.5px;
	color: var(--slate-light); letter-spacing: .02em;
}
.pg-meta li { display: inline-flex; align-items: center; gap: 7px; }
.pg-meta svg { width: 15px; height: 15px; fill: none; stroke: var(--orange); stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }

/* Stage strip */
.pg-stagebar-wrap {
	position: relative; z-index: 1;
	max-width: var(--max-w); margin: 56px auto 0; padding: 0 var(--px);
}
.pg-stagebar {
	list-style: none;
	display: grid; grid-template-columns: repeat(8, minmax(0, 1fr));
	border: 1px solid rgba(255,255,255,.08);
	border-radius: var(--radius-md);
	background: rgba(255,255,255,.025);
	overflow: hidden;
}
.pg-stagebar li + li { border-left: 1px solid rgba(255,255,255,.06); }
.pg-stagebar a {
	display: flex; flex-direction: column; gap: 4px;
	padding: 16px 14px 18px;
	color: #fff; font-weight: 700; font-size: 14px;
	transition: background .2s, color .2s;
	position: relative;
}
.pg-stagebar a span { font-family: var(--font-mono); font-size: 11px; color: var(--orange-light); font-weight: 600; }
.pg-stagebar a::after {
	content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 2px;
	background: var(--orange); transform: scaleX(0); transform-origin: left; transition: transform .25s ease;
}
.pg-stagebar a:hover { background: rgba(249,115,22,.08); }
.pg-stagebar a:hover::after { transform: scaleX(1); }

@media (max-width: 900px) {
	.pg-stagebar { grid-template-columns: repeat(4, minmax(0, 1fr)); }
	.pg-stagebar li:nth-child(5) { border-left: none; }
	.pg-stagebar li:nth-child(n+5) { border-top: 1px solid rgba(255,255,255,.06); }
}
@media (max-width: 520px) {
	.pg-stagebar-wrap { margin-top: 40px; }
	.pg-hero { padding-bottom: 44px; }
	.pg-stagebar { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.pg-stagebar li:nth-child(odd) { border-left: none; }
	.pg-stagebar li:nth-child(n+3) { border-top: 1px solid rgba(255,255,255,.06); }
}

/* ---------- Layout ---------- */
.pg-body { padding: 64px 0 40px; }
.pg-layout {
	max-width: var(--max-w); margin: 0 auto; padding: 0 var(--px);
	display: grid; grid-template-columns: 250px minmax(0, 1fr); gap: 56px;
	align-items: start;
}
@media (max-width: 1020px) {
	.pg-layout { grid-template-columns: minmax(0, 1fr); gap: 24px; }
}

/* ---------- TOC ---------- */
.pg-toc { position: sticky; top: 100px; }
.pg-toc-title {
	font-family: var(--font-mono); font-size: 11px; font-weight: 600;
	letter-spacing: .12em; text-transform: uppercase; color: var(--slate);
	margin-bottom: 14px;
}
.pg-toc-list { list-style: none; counter-reset: toc; border-left: 2px solid var(--support); }
.pg-toc-list li { counter-increment: toc; }
.pg-toc-list a {
	display: block; position: relative;
	padding: 7px 0 7px 16px; margin-left: -2px;
	border-left: 2px solid transparent;
	font-size: 13.5px; font-weight: 600; line-height: 1.4;
	color: var(--slate-mid);
	transition: color .2s, border-color .2s;
}
.pg-toc-list a:hover { color: var(--navy); }
.pg-toc-list a.is-active { color: var(--orange-hover); border-left-color: var(--orange); }

.pg-toc-cta {
	margin-top: 26px; padding: 20px;
	background: var(--navy); color: #fff;
	border-radius: var(--radius-md);
	position: relative; overflow: hidden;
}
.pg-toc-cta::before {
	content: ''; position: absolute; top: -60px; right: -60px; width: 160px; height: 160px;
	background: radial-gradient(circle, rgba(249,115,22,.35), transparent 70%);
}
.pg-toc-cta strong { display: block; font-size: 15px; margin-bottom: 6px; position: relative; }
.pg-toc-cta p { font-size: 13px; color: var(--slate-light); line-height: 1.55; margin-bottom: 14px; position: relative; }
.pg-toc-cta .btn { width: 100%; position: relative; }

.pg-toc-toggle { display: none; }

@media (max-width: 1020px) {
	.pg-toc {
		position: sticky; top: 76px; z-index: 20;
		background: #fff; border: 1px solid var(--support); border-radius: var(--radius-sm);
		box-shadow: 0 8px 24px rgba(15,23,42,.06);
	}
	.pg-toc-toggle {
		display: flex; align-items: center; justify-content: space-between; width: 100%;
		padding: 13px 16px; font-weight: 700; font-size: 14px; color: var(--navy);
	}
	.pg-toc-toggle .faq-chevron { background: rgba(249,115,22,.1); }
	.pg-toc-toggle[aria-expanded="true"] .faq-chevron { transform: rotate(180deg); }
	.pg-toc-inner { display: none; padding: 0 16px 16px; max-height: 60vh; overflow-y: auto; }
	.pg-toc.is-open .pg-toc-inner { display: block; }
	.pg-toc-title, .pg-toc-cta { display: none; }
}
@media (max-width: 768px) { .pg-toc { top: 62px; } }

/* ---------- Article typography ---------- */
.pg-article {
	min-width: 0;
	color: #334155;
	font-size: 17px; line-height: 1.75;
	max-width: 780px;
}
.pg-article p { margin: 0 0 1.05em; }
.pg-article strong { color: var(--navy); font-weight: 700; }
.pg-article a:not(.btn):not(.pg-step-link) {
	color: var(--orange-hover);
	font-weight: 600;
	text-decoration: underline;
	text-decoration-color: rgba(249,115,22,.35);
	text-underline-offset: 3px;
	text-decoration-thickness: 2px;
	transition: text-decoration-color .2s, color .2s;
}
.pg-article a:not(.btn):not(.pg-step-link):hover { color: var(--orange); text-decoration-color: var(--orange); }
.pg-article a strong { color: inherit; }

.pg-lead { font-size: 20px; line-height: 1.65; color: var(--navy); font-weight: 500; }
.pg-emphasis { font-size: 19px; font-weight: 700; color: var(--navy); }

.pg-section {
	padding-top: 56px; margin-top: 56px;
	border-top: 1px solid var(--support);
	scroll-margin-top: 96px;
}
.pg-article [id] { scroll-margin-top: 96px; }
@media (max-width: 1020px) { .pg-section, .pg-article [id] { scroll-margin-top: 140px; } }

.pg-eyebrow {
	display: inline-block;
	font-family: var(--font-mono); font-size: 11.5px; font-weight: 600;
	letter-spacing: .12em; text-transform: uppercase;
	color: var(--orange-hover);
	background: rgba(249,115,22,.08);
	border: 1px solid rgba(249,115,22,.2);
	padding: 5px 11px; border-radius: 999px;
	margin-bottom: 16px;
}
.pg-eyebrow.is-light { color: var(--orange-light); background: rgba(249,115,22,.12); border-color: rgba(249,115,22,.3); }

.pg-article h2 {
	font-family: var(--font-body);
	font-size: clamp(1.6rem, 3.4vw, 2.2rem);
	font-weight: 800; letter-spacing: -.03em; line-height: 1.15;
	color: var(--navy);
	margin: 0 0 22px;
}
.pg-article h3 {
	font-size: 1.3rem; font-weight: 800; letter-spacing: -.02em; line-height: 1.3;
	color: var(--navy);
	margin: 40px 0 14px;
}
.pg-article h4 { font-size: 1.05rem; font-weight: 800; color: var(--navy); margin: 0 0 10px; }

.pg-pullquote {
	font-size: 1.35rem; line-height: 1.45; font-weight: 800; letter-spacing: -.02em;
	color: var(--navy);
	padding: 4px 0 4px 22px; margin: 22px 0 !important;
	border-left: 4px solid var(--orange);
}
.pg-pullquote.is-small { font-size: 1.1rem; }

/* ---------- Callout ---------- */
.pg-callout {
	position: relative;
	margin: 26px 0 28px;
	padding: 22px 26px 22px 26px;
	background: var(--navy); color: #e2e8f0;
	border-radius: var(--radius-md);
	overflow: hidden;
}
.pg-callout::before {
	content: ''; position: absolute; left: 0; top: 0; bottom: 0; width: 4px; background: var(--orange);
}
.pg-callout::after {
	content: ''; position: absolute; right: -80px; top: -80px; width: 220px; height: 220px;
	background: radial-gradient(circle, rgba(249,115,22,.18), transparent 70%);
	pointer-events: none;
}
.pg-callout-label {
	display: block; font-family: var(--font-mono); font-size: 11px; font-weight: 600;
	letter-spacing: .12em; text-transform: uppercase; color: var(--orange-light); margin-bottom: 8px;
}
.pg-callout p { margin: 0 !important; font-size: 17.5px; line-height: 1.6; position: relative; z-index: 1; }
.pg-callout strong { color: #fff; }

/* ---------- Flow chips ---------- */
.pg-flow {
	list-style: none;
	display: flex; flex-wrap: wrap; align-items: center; gap: 8px 6px;
	margin: 18px 0 24px;
}
.pg-flow li { display: inline-flex; align-items: center; gap: 6px; }
.pg-flow-chip {
	display: inline-block;
	padding: 8px 14px;
	background: #fff; color: var(--navy);
	border: 1px solid var(--support);
	border-radius: 999px;
	font-size: 14px; font-weight: 700; line-height: 1.2;
	box-shadow: 0 2px 6px rgba(15,23,42,.04);
}
.pg-flow li:last-child .pg-flow-chip { background: var(--orange); border-color: var(--orange); color: #fff; }
.pg-flow-arrow { color: var(--orange); font-weight: 800; }

/* ---------- Checklist ---------- */
.pg-checklist {
	list-style: none;
	display: grid; gap: 10px 22px;
	margin: 14px 0 24px;
}
.pg-cols-1 { grid-template-columns: 1fr; }
.pg-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.pg-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.pg-cols-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (min-width: 900px) { .pg-cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
@media (max-width: 760px) { .pg-cols-3 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 520px) { .pg-cols-2, .pg-cols-3, .pg-cols-4 { grid-template-columns: 1fr; } }
.pg-checklist li {
	display: flex; align-items: flex-start; gap: 10px;
	font-size: 15.5px; line-height: 1.5; color: #334155;
}
.pg-tick {
	flex-shrink: 0; width: 20px; height: 20px; margin-top: 2px;
	border-radius: 6px; background: rgba(249,115,22,.12);
	position: relative;
}
.pg-tick::after {
	content: ''; position: absolute; left: 7px; top: 3.5px;
	width: 5px; height: 10px;
	border: solid var(--orange-hover); border-width: 0 2px 2px 0;
	transform: rotate(45deg);
}
.pg-cols-4 li {
	background: #fff; border: 1px solid var(--support); border-radius: var(--radius-sm);
	padding: 12px; font-weight: 600; font-size: 14.5px;
}

/* Warning list (problems) */
.pg-warnlist {
	list-style: none;
	display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px;
	margin: 14px 0 26px;
}
.pg-warnlist li {
	position: relative;
	padding: 12px 14px 12px 42px;
	background: #fff; border: 1px solid #fde2cf; border-radius: var(--radius-sm);
	font-size: 15px; line-height: 1.45; color: #334155;
}
.pg-warnlist li::before {
	content: '!'; position: absolute; left: 13px; top: 12px;
	width: 19px; height: 19px; border-radius: 50%;
	background: #fee2e2; color: #dc2626;
	font-size: 12px; font-weight: 800; line-height: 19px; text-align: center;
}
.pg-warnlist.is-compact { grid-template-columns: 1fr; gap: 6px; }
.pg-warnlist.is-compact li { padding: 8px 12px 8px 38px; font-size: 14.5px; }
.pg-warnlist.is-compact li::before { top: 8px; left: 11px; }
@media (max-width: 600px) { .pg-warnlist { grid-template-columns: 1fr; } }

/* ---------- Compare cards ---------- */
.pg-compare {
	display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px;
	margin: 22px 0 28px;
}
@media (max-width: 680px) { .pg-compare { grid-template-columns: 1fr; } }
.pg-compare-card {
	background: #fff;
	border: 1px solid var(--support);
	border-radius: var(--radius-lg);
	padding: 24px;
	box-shadow: 0 10px 30px rgba(15,23,42,.04);
}
.pg-compare-card.is-accent { border-color: rgba(249,115,22,.4); box-shadow: 0 14px 36px rgba(249,115,22,.1); }
.pg-compare-card p { font-size: 15.5px; }
.pg-compare-card h3 { margin-top: 0; font-size: 1.15rem; }
.pg-compare-card .pg-checklist { margin-bottom: 8px; }
.pg-compare-tag {
	display: inline-block; margin-bottom: 12px;
	font-family: var(--font-mono); font-size: 11px; font-weight: 600; letter-spacing: .1em; text-transform: uppercase;
	color: var(--slate);
}
.pg-compare-card.is-accent .pg-compare-tag { color: var(--orange-hover); }

/* ---------- A vs B ---------- */
.pg-vs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; margin: 22px 0 26px; }
@media (max-width: 600px) { .pg-vs { grid-template-columns: 1fr; } }
.pg-vs-card {
	background: #fff; border: 1px solid var(--support); border-radius: var(--radius-lg);
	padding: 24px; display: flex; flex-direction: column;
}
.pg-vs-card.is-winner { background: var(--navy); border-color: var(--navy); color: #cbd5e1; }
.pg-vs-name { font-family: var(--font-mono); font-size: 12px; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--slate); }
.pg-vs-card.is-winner .pg-vs-name { color: var(--orange-light); }
.pg-vs-big { font-family: var(--font-display); font-size: 3rem; font-weight: 700; line-height: 1; margin-top: 10px; color: var(--navy); }
.pg-vs-card.is-winner .pg-vs-big { color: #fff; }
.pg-vs-unit { font-size: 14px; color: var(--slate); margin-bottom: 16px; }
.pg-vs-card ul { list-style: none; display: flex; flex-direction: column; gap: 8px; border-top: 1px solid var(--support); padding-top: 14px; }
.pg-vs-card.is-winner ul { border-top-color: rgba(255,255,255,.1); }
.pg-vs-card li { font-size: 14.5px; line-height: 1.5; padding-left: 18px; position: relative; }
.pg-vs-card li::before { content: ''; position: absolute; left: 0; top: 9px; width: 7px; height: 7px; border-radius: 50%; background: var(--slate-lighter); }
.pg-vs-card.is-winner li::before { background: var(--green); }
.pg-vs-card.is-winner strong { color: #fff; }
.pg-vs-card.is-winner a { color: var(--orange-light) !important; }

/* ---------- 8 step cards ---------- */
.pg-steps {
	list-style: none;
	display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px;
	margin: 24px 0 28px;
}
@media (max-width: 600px) { .pg-steps { grid-template-columns: 1fr; } }
.pg-step-link {
	display: block; height: 100%;
	background: #fff; border: 1px solid var(--support); border-radius: var(--radius-md);
	padding: 20px 20px 18px;
	position: relative; overflow: hidden;
	transition: transform .2s ease, box-shadow .2s ease, border-color .2s;
}
.pg-step-link:hover { transform: translateY(-3px); border-color: rgba(249,115,22,.45); box-shadow: 0 16px 34px rgba(15,23,42,.08); }
.pg-step-num {
	position: absolute; right: 16px; top: 10px;
	font-family: var(--font-display); font-size: 2.6rem; font-weight: 700; line-height: 1;
	color: rgba(249,115,22,.14);
}
.pg-article .pg-step-title { margin: 0 0 8px; font-size: 1.1rem; }
.pg-step-link p { margin: 0 0 12px !important; font-size: 14.5px; line-height: 1.6; color: var(--slate-mid); }
.pg-step-more { font-size: 13px; font-weight: 700; color: var(--orange-hover); }

/* ---------- Numbered sub-steps (Before the exhibition) ---------- */
.pg-numbered { margin-top: 34px; }
.pg-numbered h3 { display: flex; align-items: center; gap: 12px; margin-top: 0; }
.pg-num {
	flex-shrink: 0; width: 34px; height: 34px; border-radius: 10px;
	background: var(--navy); color: #fff;
	font-family: var(--font-display); font-size: 16px; font-weight: 700;
	display: inline-flex; align-items: center; justify-content: center;
}

/* Visitor / lead / qualified tiers */
.pg-tiers { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin: 16px 0 22px; }
@media (max-width: 680px) { .pg-tiers { grid-template-columns: 1fr; } }
.pg-tier { background: #fff; border: 1px solid var(--support); border-radius: var(--radius-md); padding: 18px; }
.pg-tier p { margin: 0 !important; font-size: 14.5px; line-height: 1.55; }
.pg-tier-name { display: block; font-weight: 800; color: var(--navy); margin-bottom: 6px; }
.pg-tier.is-accent { background: linear-gradient(160deg, #fff7ed, #fff); border-color: rgba(249,115,22,.4); }
.pg-tier.is-accent .pg-tier-name { color: var(--orange-hover); }

/* ---------- Hot / Warm / Cold ---------- */
.pg-temps { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; margin: 18px 0 26px; }
@media (max-width: 760px) { .pg-temps { grid-template-columns: 1fr; } }
.pg-temps.is-detailed { grid-template-columns: 1fr; }
.pg-temp {
	--tc: #ef4444; --tbg: #fef2f2;
	background: #fff; border: 1px solid var(--support); border-top: 4px solid var(--tc);
	border-radius: var(--radius-md); padding: 18px 20px;
}
.pg-temp.is-warm { --tc: #f59e0b; --tbg: #fffbeb; }
.pg-temp.is-cold { --tc: #3b82f6; --tbg: #eff6ff; }
.pg-temp-badge {
	display: inline-block; margin-bottom: 10px;
	padding: 4px 11px; border-radius: 999px;
	background: var(--tbg); color: var(--tc);
	font-size: 12.5px; font-weight: 800; letter-spacing: .02em; text-transform: uppercase;
}
.pg-temp p { font-size: 15px; margin-bottom: .7em; }
.pg-temp p:last-child { margin-bottom: 0; }
.pg-temp ol, .pg-temp ul { list-style: none; display: flex; flex-direction: column; gap: 6px; margin-bottom: 12px; }
.pg-temp ol { counter-reset: tstep; }
.pg-temp li { position: relative; padding-left: 22px; font-size: 14.5px; line-height: 1.5; }
.pg-temp ul li::before { content: ''; position: absolute; left: 4px; top: 8px; width: 7px; height: 7px; border-radius: 50%; background: var(--tc); }
.pg-temp ol li { counter-increment: tstep; }
.pg-temp ol li::before {
	content: counter(tstep); position: absolute; left: 0; top: 2px;
	width: 16px; height: 16px; border-radius: 50%; background: var(--tbg); color: var(--tc);
	font-size: 10.5px; font-weight: 800; text-align: center; line-height: 16px;
}
.pg-temp blockquote {
	margin: 4px 0 12px; padding: 12px 16px;
	background: var(--tbg); border-radius: var(--radius-sm);
	font-style: italic; font-size: 15px; color: var(--navy);
}
.pg-temps.is-detailed ul { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px 18px; }
@media (max-width: 600px) { .pg-temps.is-detailed ul { grid-template-columns: 1fr; } }

/* ---------- Capture methods ---------- */
.pg-methods { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; margin: 26px 0 10px; }
@media (max-width: 760px) { .pg-methods { grid-template-columns: 1fr; } }
.pg-method, .pg-channel {
	background: #fff; border: 1px solid var(--support); border-radius: var(--radius-lg);
	padding: 24px;
}
.pg-method p, .pg-channel p { font-size: 15px; line-height: 1.65; }
.pg-method h3, .pg-channel h3 { margin: 14px 0 10px; font-size: 1.15rem; }
.pg-method .pg-flow-chip { font-size: 12.5px; padding: 6px 11px; }
.pg-method-icon {
	display: inline-flex; align-items: center; justify-content: center;
	width: 44px; height: 44px; border-radius: 12px;
	background: linear-gradient(135deg, var(--orange), var(--orange-hover));
	box-shadow: 0 8px 18px rgba(249,115,22,.28);
}
.pg-method-icon svg { width: 22px; height: 22px; fill: none; stroke: #fff; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.pg-method .pg-pullquote { margin-bottom: 0 !important; }

/* ---------- Who / why ---------- */
.pg-whowhy { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; margin: 6px 0 26px; }
@media (max-width: 560px) { .pg-whowhy { grid-template-columns: 1fr; } }
.pg-whowhy > div {
	background: #fff; border: 1px solid var(--support); border-radius: var(--radius-lg);
	padding: 22px 24px; display: flex; flex-direction: column;
}
.pg-whowhy span { font-size: 14px; color: var(--slate); }
.pg-whowhy strong { font-family: var(--font-display); font-size: 2.6rem; line-height: 1.1; color: var(--navy); }
.pg-whowhy em { font-style: normal; font-weight: 600; color: var(--slate-mid); }
.pg-whowhy .is-accent { background: var(--navy); border-color: var(--navy); }
.pg-whowhy .is-accent span, .pg-whowhy .is-accent em { color: var(--slate-light); }
.pg-whowhy .is-accent strong { color: var(--orange); }

/* ---------- Record / note comparisons ---------- */
.pg-records { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr); gap: 14px; margin: 18px 0 24px; align-items: stretch; }
@media (max-width: 680px) { .pg-records { grid-template-columns: 1fr; } }
.pg-record {
	background: #fff; border: 1px dashed var(--slate-lighter); border-radius: var(--radius-md);
	padding: 18px 20px;
}
.pg-record.is-rich { border: 1px solid rgba(249,115,22,.45); background: linear-gradient(160deg, #fff7ed, #fff 60%); }
.pg-record.is-note { background: #fefce8; border-color: #fde68a; }
.pg-record-label {
	display: block; margin-bottom: 8px;
	font-family: var(--font-mono); font-size: 11px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--slate);
}
.pg-record.is-rich .pg-record-label { color: var(--orange-hover); }
.pg-record-body { margin: 0 !important; font-size: 15.5px; line-height: 1.6; }
.pg-fields { display: flex; flex-direction: column; gap: 8px; }
.pg-fields > div { display: grid; grid-template-columns: 110px 1fr; gap: 10px; font-size: 15px; align-items: center; }
.pg-fields dt { font-weight: 700; color: var(--slate); font-size: 13px; text-transform: uppercase; letter-spacing: .04em; }
.pg-fields dd { font-weight: 700; color: var(--navy); }
.pg-pill { display: inline-block; padding: 3px 10px; border-radius: 999px; background: #dcfce7; color: #15803d; font-size: 13px; font-weight: 800; }

/* ---------- Definition grids ---------- */
.pg-defs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin: 18px 0 24px; }
@media (max-width: 600px) { .pg-defs { grid-template-columns: 1fr; } }
.pg-defs > div {
	background: #fff; border: 1px solid var(--support); border-radius: var(--radius-md);
	padding: 16px 18px; border-left: 3px solid var(--orange);
}
.pg-defs dt { font-weight: 800; color: var(--navy); margin-bottom: 4px; font-size: 15.5px; }
.pg-defs dd { font-size: 14.5px; line-height: 1.55; color: var(--slate-mid); }
.pg-defs.is-criteria > div { border-left-color: var(--navy); }

/* ---------- AI summary card ---------- */
.pg-ai-card {
	background: var(--navy); color: #cbd5e1;
	border-radius: var(--radius-lg); padding: 0; margin: 18px 0 24px;
	overflow: hidden; box-shadow: 0 24px 50px rgba(15,23,42,.18);
}
.pg-ai-head {
	display: flex; align-items: center; gap: 10px;
	padding: 14px 22px; border-bottom: 1px solid rgba(255,255,255,.08);
	font-family: var(--font-mono); font-size: 12px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--orange-light);
}
.pg-ai-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--green); box-shadow: 0 0 0 4px rgba(34,197,94,.18); }
.pg-ai-row { padding: 18px 22px; }
.pg-ai-row + .pg-ai-row { border-top: 1px solid rgba(255,255,255,.06); }
.pg-ai-row.is-next { background: rgba(249,115,22,.08); }
.pg-ai-label { display: block; font-weight: 800; color: #fff; font-size: 14px; margin-bottom: 6px; }
.pg-ai-row p { margin: 0 !important; font-size: 15px; line-height: 1.65; }

/* ---------- Timeline ---------- */
.pg-timeline { list-style: none; margin: 16px 0 24px; position: relative; padding-left: 30px; }
.pg-timeline::before { content: ''; position: absolute; left: 9px; top: 8px; bottom: 8px; width: 2px; background: linear-gradient(var(--orange), var(--support)); }
.pg-timeline li { position: relative; padding: 0 0 16px; }
.pg-timeline li::before {
	content: ''; position: absolute; left: -27px; top: 6px;
	width: 14px; height: 14px; border-radius: 50%;
	background: #fff; border: 3px solid var(--orange);
}
.pg-timeline strong { display: block; font-size: 15.5px; }
.pg-timeline span { font-size: 15px; color: var(--slate-mid); }

/* ---------- Owner / status / action triad ---------- */
.pg-triad { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin: 16px 0 26px; }
@media (max-width: 560px) { .pg-triad { grid-template-columns: 1fr; } }
.pg-triad > div {
	background: var(--navy); border-radius: var(--radius-md);
	padding: 18px 20px; display: flex; flex-direction: column; gap: 6px;
}
.pg-triad span { font-family: var(--font-mono); font-size: 12px; color: var(--orange-light); font-weight: 600; }
.pg-triad strong { color: #fff !important; font-size: 1.1rem; }
.pg-triad.is-questions > div { background: #fff; border: 1px solid var(--support); }
.pg-triad.is-questions span {
	width: 26px; height: 26px; border-radius: 50%; background: rgba(249,115,22,.12);
	display: inline-flex; align-items: center; justify-content: center; font-size: 14px; color: var(--orange-hover);
}
.pg-triad.is-questions strong { color: var(--navy) !important; font-size: 1rem; }

/* ---------- Messages ---------- */
.pg-messages { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; margin: 16px 0 24px; }
@media (max-width: 640px) { .pg-messages { grid-template-columns: 1fr; } }
.pg-msg {
	position: relative;
	padding: 18px 20px; border-radius: 16px 16px 16px 4px;
	background: #fff; border: 1px solid var(--support);
}
.pg-msg p { margin: 0 !important; font-size: 15px; line-height: 1.6; }
.pg-msg-tag {
	display: inline-flex; align-items: center; gap: 6px; margin-bottom: 8px;
	font-size: 12px; font-weight: 800; text-transform: uppercase; letter-spacing: .06em;
}
.pg-msg.is-generic { background: #f8fafc; }
.pg-msg.is-generic .pg-msg-tag { color: #dc2626; }
.pg-msg.is-generic .pg-msg-tag::before { content: '✕'; }
.pg-msg.is-generic p { color: var(--slate); }
.pg-msg.is-personal { background: #f0fdf4; border-color: #bbf7d0; }
.pg-msg.is-personal .pg-msg-tag { color: #15803d; }
.pg-msg.is-personal .pg-msg-tag::before { content: '✓'; }
.pg-msg.is-personal p { color: var(--navy); }
.pg-msg.is-inline { margin: 8px 0 14px; padding: 12px 16px; }

/* ---------- Channels ---------- */
.pg-channels { display: grid; grid-template-columns: 1fr; gap: 16px; margin: 30px 0 28px; }

/* ---------- Funnel ---------- */
.pg-funnel {
	margin: 18px 0 24px; padding: 24px;
	background: #fff; border: 1px solid var(--support); border-radius: var(--radius-lg);
	display: flex; flex-direction: column; gap: 10px;
}
.pg-funnel-row { display: grid; grid-template-columns: 150px 1fr 44px; gap: 14px; align-items: center; }
@media (max-width: 520px) { .pg-funnel-row { grid-template-columns: 110px 1fr 36px; gap: 10px; } }
.pg-funnel-label { font-size: 14px; font-weight: 600; color: var(--slate-mid); }
.pg-funnel-track { height: 26px; background: var(--surface-light); border-radius: 6px; overflow: hidden; }
.pg-funnel-bar {
	display: block; height: 100%; border-radius: 6px;
	background: linear-gradient(90deg, var(--orange-hover), var(--orange-light));
	transform-origin: left; animation: pgGrow 1s cubic-bezier(.16,.84,.44,1) both;
}
.pg-funnel-bar.is-muted { background: var(--slate-lighter); }
.pg-funnel-val { font-family: var(--font-display); font-weight: 700; font-size: 1.1rem; color: var(--navy); text-align: right; }
.pg-funnel figcaption { margin-top: 6px; font-size: 13px; color: var(--slate); }
@keyframes pgGrow { from { transform: scaleX(0); } to { transform: scaleX(1); } }

/* ---------- Mindset shift ---------- */
.pg-shift { display: grid; grid-template-columns: 1fr auto 1.4fr; gap: 14px; align-items: center; margin: 20px 0 24px; }
@media (max-width: 640px) { .pg-shift { grid-template-columns: 1fr; } .pg-shift-arrow { transform: rotate(90deg); justify-self: center; } }
.pg-shift > div { border-radius: var(--radius-md); padding: 18px 20px; }
.pg-shift span { display: block; font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; margin-bottom: 6px; }
.pg-shift p { margin: 0 !important; font-weight: 800; line-height: 1.45; }
.pg-shift-old { background: #fff; border: 1px dashed var(--slate-lighter); }
.pg-shift-old span { color: var(--slate); }
.pg-shift-old p { color: var(--slate); text-decoration: line-through; text-decoration-color: rgba(100,116,139,.5); }
.pg-shift-new { background: var(--navy); }
.pg-shift-new span { color: var(--orange-light); }
.pg-shift-new p { color: #fff; font-size: 1.05rem; }
.pg-shift-arrow { font-size: 1.6rem; color: var(--orange); font-weight: 800; }

/* ---------- Software features ---------- */
.pg-features { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; margin: 24px 0 10px; }
@media (max-width: 640px) { .pg-features { grid-template-columns: 1fr; } }
.pg-feature {
	background: #fff; border: 1px solid var(--support); border-radius: var(--radius-md);
	padding: 20px; transition: border-color .2s, box-shadow .2s;
}
.pg-feature:hover { border-color: rgba(249,115,22,.4); box-shadow: 0 12px 28px rgba(15,23,42,.06); }
.pg-feature:last-child:nth-child(odd) { grid-column: 1 / -1; }
.pg-feature-num { font-family: var(--font-mono); font-size: 12px; font-weight: 600; color: var(--orange-hover); }
.pg-article .pg-feature h3 { margin: 6px 0 8px; font-size: 1.08rem; }
.pg-feature p { margin: 0 !important; font-size: 14.5px; line-height: 1.6; color: var(--slate-mid); }

/* ---------- Mistakes ---------- */
.pg-mistakes { display: flex; flex-direction: column; gap: 16px; margin-top: 24px; }
.pg-mistake {
	position: relative;
	background: #fff; border: 1px solid var(--support); border-radius: var(--radius-lg);
	padding: 24px 24px 20px 82px;
}
@media (max-width: 560px) { .pg-mistake { padding: 70px 20px 18px; } }
.pg-mistake-num {
	position: absolute; left: 22px; top: 22px;
	width: 42px; height: 42px; border-radius: 12px;
	background: #fef2f2; color: #dc2626; border: 1px solid #fecaca;
	font-family: var(--font-display); font-size: 1.2rem; font-weight: 700;
	display: flex; align-items: center; justify-content: center;
}
.pg-article .pg-mistake h3 { margin: 6px 0 12px; font-size: 1.2rem; }
.pg-mistake p { font-size: 15.5px; }

/* ---------- FAQ (light variant of shared accordion) ---------- */
.pg-faq .faq-list { margin-top: 10px; }
.pg-faq .faq-item { background: #fff; border-color: var(--support); }
.pg-faq .faq-question { color: var(--navy); font-size: 16px; padding: 18px 22px; }
.pg-faq .faq-question:hover,
.pg-faq .faq-question[aria-expanded="true"] { background: #fff7ed; }
.pg-faq .faq-chevron { background: rgba(249,115,22,.1); }
.pg-faq .faq-answer { color: var(--slate-mid); font-size: 15.5px; padding-top: 4px; }
.pg-faq .faq-answer p { margin: 0 !important; }

/* ---------- Final CTA ---------- */
.pg-cta-section { padding: 40px var(--px) 96px; }
.pg-cta-card {
	position: relative; overflow: hidden;
	max-width: var(--max-w); margin: 0 auto;
	background: var(--navy); color: #fff;
	border-radius: 28px;
	padding: 56px clamp(24px, 5vw, 64px);
	display: grid; grid-template-columns: minmax(0, 1.6fr) auto; gap: 36px; align-items: center;
}
@media (max-width: 860px) { .pg-cta-card { grid-template-columns: 1fr; } }
.pg-cta-glow {
	position: absolute; right: -120px; top: -160px; width: 520px; height: 520px;
	background: radial-gradient(circle, rgba(249,115,22,.28), transparent 65%);
	pointer-events: none;
}
.pg-cta-copy, .pg-cta-actions { position: relative; z-index: 1; }
.pg-cta-copy h2 {
	font-size: clamp(1.7rem, 3.6vw, 2.5rem); font-weight: 800; letter-spacing: -.03em; line-height: 1.12;
	margin: 0 0 14px;
}
.pg-cta-copy p { color: var(--slate-light); font-size: 16.5px; line-height: 1.7; max-width: 640px; }
.pg-cta-actions { display: flex; flex-direction: column; gap: 12px; min-width: 220px; }
@media (max-width: 860px) { .pg-cta-actions { flex-direction: row; flex-wrap: wrap; } }
.pg-cta-actions .btn { justify-content: center; }
