/* ==========================================================================
   Single blog post — template "Porownai Poradnik Wpis"
   Self-contained: content.css is not loaded on posts. Block classes (pa-*) are produced by
   inc/post-render.php; the editor only uses Group-block classes and shortcodes.
   ========================================================================== */

.post-page {
	--pa-pad: 20px;
	--pa-h1: 32px;
	--pa-h2: 26px;
	--pa-h3: 20px;
	--pa-body: 17px;
	--pa-lead: 18px;
	--pa-box: 22px;
	color: var(--color-deep);
}
@media (min-width: 760px) {
	.post-page { --pa-pad: 32px; --pa-h1: 44px; --pa-h2: 32px; --pa-h3: 22px; --pa-body: 18px; --pa-lead: 20px; --pa-box: 32px; }
}
@media (min-width: 1200px) {
	.post-page { --pa-h1: 50px; }
}

.post-page .container { max-width: 1200px; padding-inline: var(--pa-pad); }
/* WordPress global styles underline every link; links here opt in to underlines explicitly. */
.post-page a { text-decoration: none; }

button.pa-btn,
.share__btn,
.post-rate__star,
.post-top { margin: 0; font: inherit; appearance: none; -webkit-appearance: none; }
.share__btn,
.post-rate__star { border: 0; background: transparent; padding: 0; }
.share--foot .share__btn { background: var(--color-lavender); }
.share--foot .share__btn:hover { background: var(--color-primary); }
.post-top { border: 0; padding: 0; }
.pa-prompt__copy { background: transparent; }

/* ---------- Buttons ---------- */
.pa-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	min-height: 48px;
	padding: 0 24px;
	border: 1.5px solid transparent;
	border-radius: 8px;
	font-family: var(--font-body);
	font-size: 15px;
	font-weight: 600;
	line-height: 1.2;
	white-space: nowrap;
	cursor: pointer;
	transition: background .2s, color .2s, border-color .2s;
}
.pa-btn--primary { background: var(--color-accent); color: #fff; }
.pa-btn--primary:hover { background: var(--color-indigo); color: #fff; }
.pa-btn--ghost { border-color: var(--color-accent); color: var(--color-indigo); background: transparent; }
.pa-btn--ghost:hover { background: var(--color-lavender); color: var(--color-indigo); }
.pa-btn--light { background: #fff; color: var(--color-deep); }
.pa-btn--light:hover { background: var(--color-lavender); color: var(--color-deep); }
.pa-btn--outline-light { border-color: #fff; color: #fff; }
.pa-btn--outline-light:hover { background: rgba(238, 237, 254, .1); color: #fff; }
.pa-btn--block { display: flex; width: 100%; }

/* ---------- Reading progress ---------- */
.reading-progress {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	z-index: 60;
	height: 3px;
	pointer-events: none;
}
.admin-bar .reading-progress { top: 32px; }
@media (max-width: 782px) { .admin-bar .reading-progress { top: 46px; } }
.reading-progress span {
	display: block;
	width: 100%;
	height: 100%;
	background: var(--color-accent);
	transform: scaleX(0);
	transform-origin: 0 50%;
}

/* ---------- Hero ---------- */
.post-hero { padding-top: 24px; padding-bottom: 48px; }

.crumbs ol {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 6px 10px;
	margin: 0;
	padding: 0;
	list-style: none;
	font-family: var(--font-mono);
	font-size: 13px;
	font-weight: 500;
}
.crumbs { margin: 0; text-transform: none; letter-spacing: 0; color: var(--color-deep); }
.crumbs a { color: var(--color-indigo); }
.crumbs a:hover { color: var(--color-deep); }
.crumbs__sep { color: var(--color-primary); }
.crumbs__current { color: var(--color-deep); }

.post-hero__grid { display: grid; gap: 32px; margin-top: 28px; align-items: center; }
@media (min-width: 1200px) {
	.post-hero__grid { grid-template-columns: minmax(0, 3fr) minmax(0, 2fr); gap: 48px; }
}
.post-hero__text { min-width: 0; }

.post-chip {
	display: inline-flex;
	align-items: center;
	padding: 6px 12px;
	border-radius: 999px;
	background: var(--color-lavender);
	color: var(--color-indigo);
	font-size: 12px;
	font-weight: 500;
	letter-spacing: .06em;
	text-transform: uppercase;
}
.post-chip:hover { color: var(--color-deep); }

.post-title {
	margin: 18px 0 0;
	font-family: var(--font-heading);
	font-size: var(--pa-h1);
	font-weight: 700;
	line-height: 1.1;
	letter-spacing: -.02em;
	color: var(--color-deep);
	text-wrap: balance;
}
.post-h1__em { color: var(--color-accent); }
.post-lead {
	max-width: 60ch;
	margin: 20px 0 0;
	font-size: var(--pa-lead);
	line-height: 1.6;
	color: rgba(38, 33, 92, .85);
	text-wrap: pretty;
}

.post-meta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px 20px;
	margin-top: 24px;
	font-size: 13px;
	font-weight: 500;
	color: var(--color-indigo);
}
.post-meta__author { display: inline-flex; align-items: center; gap: 10px; color: var(--color-deep); }
.post-meta__author:hover { color: var(--color-indigo); }
.post-meta__av { display: grid; place-items: center; width: 32px; height: 32px; border-radius: 50%; background: var(--color-lavender); color: var(--color-indigo); }
.post-meta__item { display: inline-flex; align-items: center; gap: 6px; }
.post-meta .icon { color: var(--color-indigo); }

/* Share (hero: ghost buttons, foot: round buttons) */
.share { display: flex; align-items: center; gap: 4px; }
.share--hero { margin-top: 18px; }
.share__label { margin-right: 8px; font-size: 12px; font-weight: 500; letter-spacing: .06em; text-transform: uppercase; color: var(--color-indigo); }
.share__btn {
	position: relative;
	display: grid;
	place-items: center;
	width: 44px;
	height: 44px;
	border-radius: 8px;
	background: transparent;
	color: var(--color-indigo);
	transition: background .2s, color .2s;
}
.share__btn:hover { background: var(--color-lavender); color: var(--color-indigo); }
.share__copied {
	position: absolute;
	bottom: calc(100% + 6px);
	left: 50%;
	padding: 4px 8px;
	border-radius: 6px;
	background: var(--color-dark);
	color: #fff;
	font-size: 11px;
	white-space: nowrap;
	transform: translateX(-50%);
}
.share--foot .share__label { margin-right: 4px; font-family: var(--font-body); font-size: 16px; font-weight: 600; letter-spacing: 0; text-transform: none; color: var(--color-deep); }
.share--foot { gap: 8px; }
.share--foot .share__btn { border-radius: 50%; background: var(--color-lavender); }
.share--foot .share__btn:hover { background: var(--color-primary); color: #fff; }

/* Hero graphic */
.post-hero__fig { position: relative; min-width: 0; margin: 0; }
.post-hero__fig > img { display: block; width: 100%; height: auto; border-radius: 12px; background: var(--color-lavender); }
.post-graphic { position: relative; overflow: hidden; aspect-ratio: 1200 / 630; border-radius: 12px; background: var(--color-deep); }
.post-graphic__mesh { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; }
.post-graphic__in { position: absolute; inset: 0; display: flex; flex-direction: column; justify-content: space-between; padding: 8%; }
.post-graphic__in p { margin: 0; }
.post-graphic__kick { font-size: 12px; font-weight: 500; letter-spacing: .08em; text-transform: uppercase; color: var(--color-lavender); }
.post-graphic__title {
	max-width: 12ch;
	font-family: var(--font-heading);
	font-size: clamp(24px, 3vw, 38px);
	font-weight: 700;
	line-height: 1.08;
	letter-spacing: -.02em;
	color: #fff;
}
.post-graphic__title span { color: var(--color-primary); }
.post-graphic__brand { font-family: var(--font-heading); font-size: 16px; font-weight: 700; color: #fff; }

/* ---------- Layout: article + sidebar ---------- */
.post-layout { display: grid; gap: 0; align-items: start; }
.post-main { min-width: 0; max-width: 720px; width: 100%; }
@media (min-width: 980px) {
	.post-layout { grid-template-columns: minmax(0, 720px) 280px; justify-content: space-between; gap: 40px; }
}
@media (min-width: 1200px) {
	.post-layout { grid-template-columns: minmax(0, 720px) 320px; gap: 64px; }
}

/* ---------- Article typography ---------- */
.post-page .entry-content {
	padding: 0;
	font-size: var(--pa-body);
	line-height: 1.7;
	color: var(--color-deep);
}
:where(.post-page .entry-content > *) { margin-top: 0; margin-bottom: 0; }
.post-page .entry-content p { margin: 24px 0 0; text-wrap: pretty; }
.post-page .entry-content > :first-child { margin-top: 0; }
.post-page .entry-content strong { font-weight: 600; color: inherit; }
.post-page .entry-content em { font-style: italic; }
.post-page .entry-content .pa-lead { font-size: var(--pa-lead); line-height: 1.65; color: rgba(38, 33, 92, .85); }

.post-page .entry-content p a,
.post-page .entry-content li a,
.post-page .entry-content figcaption a {
	color: var(--color-accent);
	text-decoration: underline;
	text-decoration-color: var(--color-primary);
	text-decoration-thickness: 1.5px;
	text-underline-offset: 4px;
	border: 0;
	font-weight: inherit;
	transition: color .2s, text-decoration-color .2s;
}
.post-page .entry-content p a:hover,
.post-page .entry-content li a:hover,
.post-page .entry-content figcaption a:hover { color: var(--color-indigo); text-decoration-color: var(--color-indigo); }

/* Headings: H2 = numbered wrapper (.pa-h2), H3 plain */
.pa-h2 { margin-top: 56px; scroll-margin-top: 100px; }
.pa-h2__num { margin: 0; font-size: 13px; font-weight: 500; letter-spacing: .06em; color: var(--color-primary); }
.pa-h2 h2 {
	display: flex;
	gap: 14px;
	margin: 6px 0 0;
	font-family: var(--font-heading);
	font-size: var(--pa-h2);
	font-weight: 700;
	line-height: 1.2;
	letter-spacing: -.01em;
	color: var(--color-deep);
	text-wrap: balance;
}
.pa-h2__bar { flex-shrink: 0; width: 3px; height: 24px; margin-top: .2em; border-radius: 2px; background: var(--color-accent); }
.post-page .entry-content h3 {
	margin: 36px 0 0;
	scroll-margin-top: 100px;
	font-family: var(--font-heading);
	font-size: var(--pa-h3);
	font-weight: 600;
	line-height: 1.3;
	letter-spacing: 0;
	color: var(--color-deep);
}
.post-page .entry-content h4 { margin: 28px 0 0; font-family: var(--font-heading); font-size: 18px; font-weight: 600; color: var(--color-deep); }

/* Lists */
.post-page .entry-content ul:not([class*="pa-"]),
.post-page .entry-content ol:not([class*="pa-"]) { margin: 20px 0 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 10px; }
.post-page .entry-content ul:not([class*="pa-"]) > li,
.post-page .entry-content ol:not([class*="pa-"]) > li { position: relative; margin: 0; padding-left: 23px; }
.post-page .entry-content ul:not([class*="pa-"]) > li::before {
	content: "";
	position: absolute;
	left: 0;
	top: .65em;
	width: 9px;
	height: 9px;
	border: 1.5px solid var(--color-accent);
	border-radius: 50%;
}
.post-page .entry-content ol:not([class*="pa-"]) { counter-reset: pa-li; }
.post-page .entry-content ol:not([class*="pa-"]) > li { counter-increment: pa-li; padding-left: 42px; }
.post-page .entry-content ol:not([class*="pa-"]) > li::before {
	content: counter(pa-li, decimal-leading-zero) ".";
	position: absolute;
	left: 0;
	top: .15em;
	font-family: var(--font-mono);
	font-size: 14px;
	font-weight: 500;
	color: var(--color-indigo);
}
.post-page .entry-content li > ul,
.post-page .entry-content li > ol { margin-top: 10px; }

.post-page .entry-content hr,
.post-page .entry-content .wp-block-separator { margin: 48px 0; border: 0; border-top: 1px solid var(--color-border); opacity: 1; }
.post-page .entry-content code { padding: 2px 6px; border-radius: 6px; background: var(--color-lavender); font-family: var(--font-mono); font-size: .86em; }

/* Images */
.post-page .entry-content figure.wp-block-image,
.post-page .entry-content figure.wp-caption { margin: 32px 0 0; }
.post-page .entry-content figure img { display: block; width: 100%; height: auto; border-radius: 12px; background: var(--color-lavender); }
.post-page .entry-content figcaption,
.post-page .entry-content .wp-element-caption {
	margin-top: 12px;
	font-size: 14px;
	line-height: 1.5;
	color: var(--color-indigo);
	text-align: center;
}

/* Quote (pa-quote) */
.post-page .entry-content blockquote {
	margin: 36px 0 0;
	padding: 4px 0 4px 24px;
	border: 0;
	border-left: 4px solid var(--color-accent);
	border-radius: 0;
	background: none;
	color: var(--color-deep);
}
.post-page .entry-content blockquote p {
	margin: 0;
	font-family: var(--font-heading);
	font-size: 20px;
	font-weight: 500;
	line-height: 1.45;
	text-wrap: pretty;
}
.post-page .entry-content blockquote p + p { margin-top: 12px; }
.post-page .entry-content blockquote cite {
	display: block;
	margin-top: 12px;
	font-family: var(--font-mono);
	font-size: 13px;
	font-style: normal;
	font-weight: 500;
	letter-spacing: .06em;
	text-transform: uppercase;
	color: var(--color-indigo);
}
@media (min-width: 760px) { .post-page .entry-content blockquote p { font-size: 22px; } }

/* ---------- pa-takeaways ---------- */
.pa-takeaways {
	margin-top: 32px;
	padding: var(--pa-box);
	background: var(--color-lavender);
	border-left: 4px solid var(--color-accent);
	border-radius: 0 12px 12px 0;
}
.post-page .entry-content .pa-takeaways p { margin: 0; text-wrap: initial; }
.pa-takeaways__title { display: flex; align-items: center; gap: 10px; font-family: var(--font-heading); font-size: 20px; font-weight: 700; color: var(--color-deep); }
.pa-takeaways__title svg { color: var(--color-indigo); flex-shrink: 0; }
.post-page .entry-content .pa-takeaways__list { display: flex; flex-direction: column; gap: 12px; margin: 16px 0 0; padding: 0; list-style: none; font-size: 16px; line-height: 1.6; }
.pa-takeaways__list li { display: flex; gap: 12px; margin: 0; }
.post-page .entry-content .pa-takeaways__list li::before { display: none; }
.pa-takeaways__ic { flex-shrink: 0; margin-top: 3px; color: var(--color-accent); }
.pa-takeaways__ic path { stroke-width: 2; }
.post-page .entry-content .pa-takeaways__foot { margin-top: 18px; padding-top: 14px; border-top: 1px solid var(--color-border); font-size: 13px; font-weight: 500; color: var(--color-indigo); }

/* ---------- pa-callout ---------- */
.pa-callout {
	--pa-c: var(--color-accent);
	display: flex;
	gap: 14px;
	margin-top: 32px;
	padding: 20px 24px;
	background: #fff;
	border: 1px solid var(--color-lavender);
	border-left: 4px solid var(--pa-c);
	border-radius: 0 12px 12px 0;
	font-size: 16px;
	line-height: 1.65;
}
.pa-callout--rodo { --pa-c: var(--color-indigo); }
.pa-callout--warn { --pa-c: var(--color-deep); }
.pa-callout--note,
.pa-callout--read { --pa-c: var(--color-primary); }
.pa-callout__ic { flex-shrink: 0; margin-top: 2px; color: var(--pa-c); }
.pa-callout--read .pa-callout__ic { color: var(--color-indigo); }
.pa-callout__body { min-width: 0; }
.post-page .entry-content .pa-callout__body p { margin: 0; }
.post-page .entry-content .pa-callout__body p + p { margin-top: 10px; }
.pa-callout__t { font-family: var(--font-heading); font-weight: 700; }
.post-page .entry-content .pa-callout a { color: var(--color-indigo); font-weight: 600; text-decoration-color: var(--color-primary); }
.post-page .entry-content .pa-callout a:hover { color: var(--color-deep); }

/* ---------- pa-prompt ---------- */
.pa-prompt { margin: 32px 0 0; }
.post-page .entry-content .pa-prompt__title { margin: 0 0 10px; font-family: var(--font-heading); font-size: 16px; font-weight: 600; line-height: 1.4; text-align: left; color: var(--color-deep); }
.pa-prompt__box { overflow: hidden; border-radius: 12px; background: var(--color-prompt); }
.pa-prompt__bar { display: flex; align-items: center; justify-content: space-between; padding: 8px 8px 8px 20px; border-bottom: 1px solid rgba(238, 237, 254, .12); }
.pa-prompt__tag { font-size: 12px; font-weight: 500; letter-spacing: .1em; color: var(--color-lavender); }
.pa-prompt__copy {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	min-height: 40px;
	padding: 0 14px;
	border: 1px solid rgba(238, 237, 254, .24);
	border-radius: 8px;
	color: var(--color-lavender);
	font-size: 12px;
	font-weight: 500;
	transition: border-color .2s;
}
.pa-prompt__copy:hover { border-color: var(--color-primary); }
.pa-prompt__copy.is-copied { border-color: var(--color-primary); }
.pa-prompt__text {
	padding: 20px;
	font-family: var(--font-mono);
	font-size: 15px;
	line-height: 1.7;
	color: var(--color-lavender);
	word-break: break-word;
}
.pa-prompt__text p { white-space: pre-wrap; }
.post-page .entry-content .pa-prompt__text p { margin: 0; text-wrap: initial; }
.post-page .entry-content .pa-prompt__text p + p { margin-top: 12px; }
.post-page .entry-content .pa-prompt__text strong { font-weight: 400; color: inherit; }

/* ---------- pa-check ---------- */
.post-page .entry-content .pa-check-title { margin: 32px 0 0; font-family: var(--font-heading); font-size: 18px; font-weight: 600; line-height: 1.4; }
.post-page .entry-content .pa-check-title + ul.pa-check { margin-top: 12px; }
.post-page .entry-content ul.pa-check { display: flex; flex-direction: column; gap: 10px; margin: 24px 0 0; padding: 0; list-style: none; }
.post-page .entry-content ul.pa-check > li {
	position: relative;
	margin: 0;
	padding: 14px 18px 14px 56px;
	background: #fff;
	border: 1px solid var(--color-lavender);
	border-radius: 12px;
	font-size: 16px;
	line-height: 1.55;
}
.post-page .entry-content ul.pa-check > li::before {
	content: "";
	position: absolute;
	top: 14px;
	left: 18px;
	width: 24px;
	height: 24px;
	background: var(--color-accent);
	-webkit-mask: var(--icon-check-circle) center / contain no-repeat;
	mask: var(--icon-check-circle) center / contain no-repeat;
}

/* ---------- pa-table ---------- */
.pa-table { margin: 32px 0 0; }
.pa-table__wrap { position: relative; }
.pa-table__scroll { overflow-x: auto; border: 1px solid var(--color-lavender); border-radius: 12px; -webkit-overflow-scrolling: touch; }
.pa-table table { width: max-content; min-width: 100%; border-collapse: collapse; font-size: 15px; line-height: 1.4; }
.pa-table thead tr { background: var(--color-deep); color: #fff; font-family: var(--font-heading); font-weight: 600; text-align: left; }
.pa-table th { padding: 14px 16px; border: 0; font-weight: 600; text-align: left; vertical-align: bottom; }
.pa-table td { min-width: 110px; max-width: 280px; padding: 12px 16px; border: 0; vertical-align: top; }
.pa-table tbody tr:nth-child(even) { background: rgba(238, 237, 254, .5); }
.pa-table tbody td:first-child { font-weight: 600; }
.pa-table td:has(.pa-yn) { text-align: center; }
.pa-table tbody td:first-child a { color: var(--color-deep); font-weight: 600; text-decoration: none; }
.pa-table tbody td:first-child a:hover { color: var(--color-indigo); }
.pa-yn { display: inline-grid; place-items: center; }
.pa-yn--y { color: var(--color-accent); }
.pa-yn--y path { stroke-width: 2; }
.pa-yn--n { color: var(--color-indigo); opacity: .6; }
.pa-yn--n path { stroke-width: 2; }
.pa-table__fade { display: none; position: absolute; top: 1px; right: 1px; bottom: 1px; width: 28px; border-radius: 0 12px 12px 0; background: linear-gradient(90deg, rgba(38, 33, 92, 0), rgba(38, 33, 92, .16)); pointer-events: none; }
@media (max-width: 699px) { .pa-table__fade { display: block; } }
.post-page .entry-content .pa-table__cap,
.post-page .entry-content .pa-table figcaption { margin-top: 10px; font-family: var(--font-mono); font-size: 12px; line-height: 1.5; color: var(--color-indigo); text-align: left; }

/* ---------- pa-tool (inline tool card) ---------- */
.pa-tool {
	display: flex;
	flex-direction: column;
	gap: 20px;
	margin-top: 32px;
	padding: 24px;
	background: #fff;
	border: 1px solid var(--color-lavender);
	border-radius: 12px;
	box-shadow: var(--shadow-sm);
}
.pa-tool__logo { flex-shrink: 0; width: 56px; height: 56px; }
.pa-tool__logo .tool-initials {
	display: grid;
	place-items: center;
	width: 56px;
	height: 56px;
	border: 0;
	border-radius: 12px;
	background: var(--color-lavender);
	color: var(--color-indigo);
	font-family: var(--font-heading);
	font-size: 18px;
	font-weight: 700;
}
.pa-tool__logo .tool-logo-img { border-radius: 12px; object-fit: contain; background: var(--color-lavender); }
.pa-tool__main { flex: 1; min-width: 0; }
.post-page .entry-content .pa-tool p { margin: 0; text-wrap: initial; }
.pa-tool__name { font-family: var(--font-heading); font-size: 20px; font-weight: 700; line-height: 1.25; }
.post-page .entry-content .pa-tool__desc { margin-top: 4px; font-size: 16px; line-height: 1.55; }
.post-page .entry-content .pa-tool__badges { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 12px 0 0; padding: 0; list-style: none; }
.post-page .entry-content .pa-tool__badges li { margin: 0; padding: 0; }
.post-page .entry-content .pa-tool__badges li::before { display: none; }
.pa-tool__badge { padding: 4px 10px !important; border-radius: 999px; background: var(--color-lavender); color: var(--color-indigo); font-size: 12px; font-weight: 500; }
.pa-tool__price { padding: 4px 2px !important; font-size: 13px; font-weight: 600; }
.pa-tool__cta { display: flex; flex-direction: column; gap: 8px; flex-shrink: 0; }
@media (min-width: 760px) {
	.pa-tool { flex-direction: row; align-items: center; }
	.pa-tool__cta { width: auto; }
}
.post-page .entry-content a.pa-btn { text-decoration: none; }
.post-page .entry-content a.pa-btn--primary { color: #fff; }
.post-page .entry-content a.pa-btn--ghost { color: var(--color-indigo); }

/* ---------- pa-compare ---------- */
.pa-compare { margin-top: 32px; overflow: hidden; border: 1px solid var(--color-lavender); border-radius: 12px; }
.post-page .entry-content .pa-compare p { margin: 0; text-wrap: initial; }
.pa-compare__head { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); align-items: center; gap: 12px; padding: 18px 20px; background: var(--color-deep); color: #fff; text-align: center; font-family: var(--font-heading); font-size: 18px; font-weight: 700; }
.pa-compare__head span { padding: 3px 10px; border: 1px solid rgba(238, 237, 254, .35); border-radius: 999px; color: var(--color-lavender); font-size: 12px; font-weight: 400; }
.pa-compare__row { padding: 14px 20px; border-top: 1px solid var(--color-lavender); }
.pa-compare__row.is-alt { background: rgba(238, 237, 254, .5); }
.pa-compare__k { font-size: 12px; font-weight: 500; letter-spacing: .06em; text-align: center; text-transform: uppercase; color: var(--color-indigo); }
.pa-compare__v { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin-top: 4px; text-align: center; font-size: 16px; font-weight: 500; }
.pa-compare__foot { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; padding: 14px 20px; border-top: 1px solid var(--color-lavender); }
.pa-compare__foot > span { font-size: 12px; color: var(--color-indigo); }
.pa-compare__foot .pa-btn { min-height: 44px; padding: 0 20px; }

/* ---------- pa-perspective ---------- */
.pa-perspective { position: relative; overflow: hidden; margin-top: 40px; padding: var(--pa-box); background: var(--color-lavender); border-radius: 12px; }
.pa-perspective__mesh { position: absolute; top: 0; right: 0; width: 50%; height: 65%; pointer-events: none; }
.pa-perspective__mesh svg { position: absolute; inset: 0; width: 100%; height: 100%; }
.pa-perspective__in { position: relative; }
.post-page .entry-content .pa-perspective__label { margin: 0; font-size: 12px; font-weight: 600; letter-spacing: .08em; color: var(--color-indigo); }
.post-page .entry-content .pa-perspective__text p { margin: 14px 0 0; font-size: 17px; line-height: 1.7; }
.pa-perspective__by { display: flex; align-items: center; gap: 10px; margin-top: 22px; padding-top: 16px; border-top: 1px solid var(--color-border); font-size: 14px; }
.pa-perspective__av { display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; background: #fff; color: var(--color-indigo); }
.pa-perspective__role { color: var(--color-indigo); }

/* ---------- pa-banner ---------- */
.pa-banner { position: relative; display: grid; grid-template-columns: minmax(0, 1fr); min-height: 240px; overflow: hidden; margin-top: 48px; background: var(--color-deep); border-radius: 12px; }
.pa-banner__in { position: relative; z-index: 1; display: flex; flex-direction: column; align-items: flex-start; justify-content: center; padding: 24px; }
.post-page .entry-content .pa-banner p { margin: 0; text-wrap: initial; }
.pa-banner__kick { font-size: 12px; font-weight: 500; letter-spacing: .06em; text-transform: uppercase; color: var(--color-lavender); }
.pa-banner__h { margin-top: 12px !important; font-family: var(--font-heading); font-size: 24px; font-weight: 700; line-height: 1.2; color: #fff; text-wrap: balance !important; }
.pa-banner .pa-btn { margin-top: 24px; }
.pa-banner__mesh { position: absolute; inset: 0; min-height: 200px; opacity: .35; }
.pa-banner__mesh svg { position: absolute; inset: 0; width: 100%; height: 100%; }
@media (min-width: 760px) {
	.pa-banner { grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); }
	.pa-banner__in { padding: 36px; }
	.pa-banner__h { font-size: 28px; }
	.pa-banner__mesh { position: relative; opacity: 1; }
}

/* ---------- FAQ (accordion) ---------- */
.pa-h2--faq { position: relative; overflow: hidden; padding-top: 70px; }
.pa-h2__wm {
	position: absolute;
	top: 0;
	left: -6px;
	font-family: var(--font-heading);
	font-size: 110px;
	font-weight: 700;
	line-height: 1;
	letter-spacing: -.04em;
	color: var(--color-lavender);
	pointer-events: none;
	user-select: none;
}
.pa-h2--faq .pa-h2__num,
.pa-h2--faq h2 { position: relative; }
@media (min-width: 760px) {
	.pa-h2--faq { padding-top: 104px; }
	.pa-h2__wm { top: 0; font-size: 160px; }
}
.post-page .entry-content :is(.wp-block-rank-math-faq-block, .rank-math-block) { margin-top: 20px; }
.post-page .entry-content :is(.wp-block-rank-math-faq-block, .rank-math-block, .rank-math-list) { display: flex; flex-direction: column; gap: 8px; }
.pa-faq__item { border: 1px solid transparent; border-radius: 12px; background: rgba(238, 237, 254, .5); transition: box-shadow .2s; }
.pa-faq__item[open] { background: #fff; border-color: var(--color-lavender); box-shadow: var(--shadow-sm); }
.pa-faq__q {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	min-height: 56px;
	padding: 14px 20px;
	list-style: none;
	cursor: pointer;
	font-family: var(--font-heading);
	font-size: 17px;
	font-weight: 600;
	line-height: 1.35;
	color: var(--color-deep);
}
.pa-faq__q::-webkit-details-marker { display: none; }
.pa-faq__item[open] > .pa-faq__q { color: var(--color-accent); }
.pa-faq__chev { flex-shrink: 0; transition: transform .2s; }
.pa-faq__item[open] .pa-faq__chev { transform: rotate(180deg); }
.pa-faq__a { padding: 0 20px 20px; font-size: 16px; line-height: 1.7; }
.post-page .entry-content .pa-faq__a p { margin: 0; }
.post-page .entry-content .pa-faq__a p + p { margin-top: 10px; }
.post-page .entry-content .pa-faq__a a { color: var(--color-indigo); font-weight: 500; text-decoration-color: var(--color-primary); }
@media (min-width: 760px) { .pa-faq__q { font-size: 18px; } }

/* ---------- Disclosure / tags ---------- */
.disclosure {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 8px 14px;
	margin-bottom: 30px;
	padding: 16px 20px;
	border: 1px dashed var(--color-primary);
	border-radius: 12px;
	background: #fff;
	font-size: .875rem;
	line-height: 1.55;
	color: var(--color-text-muted);
}
.disclosure__label { padding: 3px 9px; border-radius: 7px; background: var(--color-dark); color: #fff; font-size: .6875rem; letter-spacing: .08em; text-transform: uppercase; }
.disclosure p { flex: 1; min-width: 220px; margin: 0; }
.post-tags { gap: 10px; margin-top: 40px; }
.pill--sm { gap: 8px; padding: 9px 16px; font-size: .84rem; }

/* ---------- Author ---------- */
.post-author { display: flex; flex-direction: column; align-items: flex-start; gap: 24px; margin-top: 56px; padding-top: 32px; border-top: 1px solid var(--color-border); scroll-margin-top: 100px; }
.post-author .avatar { width: 96px; height: 96px; border: 2px solid var(--color-lavender); background: var(--color-lavender) !important; color: var(--color-indigo); font-size: 30px; }
.post-author__body { flex: 1; min-width: 0; }
.post-author__name { margin: 0; font-family: var(--font-heading); font-size: 22px; font-weight: 700; }
.post-author__role { margin: 4px 0 0; font-size: 13px; font-weight: 500; letter-spacing: .06em; text-transform: uppercase; color: var(--color-indigo); }
.post-author__bio { margin: 12px 0 0; font-size: 16px; line-height: 1.7; }
.post-author__links { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
.post-author__link { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 0 14px; border: 1px solid var(--color-lavender); border-radius: 8px; color: var(--color-indigo); font-size: 14px; font-weight: 500; transition: background .2s; }
.post-author__link:hover { background: var(--color-lavender); color: var(--color-indigo); }
@media (min-width: 760px) { .post-author { flex-direction: row; } }

/* ---------- Rating + share row ---------- */
.post-foot { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 32px; margin-top: 32px; padding: 16px 0; border-top: 1px solid var(--color-border); border-bottom: 1px solid var(--color-border); }
.post-rate { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 12px; }
.post-rate__label { font-size: 16px; font-weight: 600; }
.post-rate__stars { display: flex; }
.post-rate__star { display: grid; place-items: center; width: 40px; height: 44px; color: var(--color-accent); cursor: pointer; }
.post-rate__star svg { transition: fill .15s; }
.post-rate__star.is-on svg { fill: var(--color-accent); }
.post-rate__text { font-size: 13px; color: var(--color-indigo); }
.post-rate.is-done .post-rate__star { cursor: default; }

/* ---------- Sidebar ---------- */
.post-aside { display: grid; gap: 16px; align-items: start; margin-top: 48px; scrollbar-width: thin; }
@media (min-width: 760px) { .post-aside { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 980px) {
	.post-aside { grid-template-columns: minmax(0, 1fr); position: sticky; top: 96px; max-height: calc(100vh - 112px); overflow-y: auto; margin-top: 0; }
	.admin-bar .post-aside { top: 128px; max-height: calc(100vh - 144px); }
}
.post-aside p { margin: 0; }

.post-toc { padding: 20px 20px 14px; background: #fff; border: 1px solid var(--color-lavender); border-radius: 12px; }
.post-toc__title { font-size: 12px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--color-indigo); }
.post-page .post-toc__list { margin: 12px 0 0; padding: 0; list-style: none; }
.post-toc__link { display: grid; grid-template-columns: 28px 1fr; padding: 7px 0 7px 12px; border-left: 2px solid var(--color-lavender); font-size: 14px; line-height: 1.4; color: var(--color-deep); transition: color .15s, border-color .15s; }
.post-toc__link:hover { color: var(--color-indigo); }
.post-toc__num { padding-top: 1px; font-size: 12px; font-weight: 400; color: var(--color-primary); }
.post-toc__link.is-active { border-left-color: var(--color-accent); color: var(--color-accent); font-weight: 600; }
.post-page .post-toc__sub { display: none; margin: 0; padding: 0 0 6px 52px; border-left: 2px solid var(--color-lavender); list-style: none; }
[data-toc-item].is-open .post-toc__sub { display: block; }
.post-toc__sub a { display: block; padding: 4px 0; font-size: 13px; line-height: 1.4; color: var(--color-indigo); }
.post-toc__sub a:hover { color: var(--color-deep); }

.side-rank { position: relative; overflow: hidden; padding: 24px; background: var(--color-deep); border-radius: 12px; color: #fff; }
.side-rank__mesh { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; }
.side-rank__in { position: relative; }
.side-rank__label { font-size: 12px; font-weight: 500; letter-spacing: .06em; text-transform: uppercase; color: var(--color-lavender); }
.side-rank__title { margin-top: 10px !important; font-family: var(--font-heading); font-size: 22px; font-weight: 700; line-height: 1.2; }
.side-rank__desc { margin-top: 8px !important; font-size: 14px; line-height: 1.55; color: var(--color-lavender); }
.side-rank .pa-btn { margin-top: 18px; }

.side-tools { padding: 20px; background: #fff; border: 1px solid var(--color-lavender); border-radius: 12px; }
.side-tools__title { font-size: 12px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--color-indigo); }
.post-page .side-tools ul { margin: 8px 0 0; padding: 0; list-style: none; }
.side-tools li a { display: flex; align-items: center; gap: 12px; min-height: 52px; margin: 0 -8px; padding: 6px 8px; border-radius: 8px; color: var(--color-deep); transition: background .2s; }
.side-tools li a:hover { background: var(--color-lavender); color: var(--color-deep); }
.side-tools li a .icon { flex-shrink: 0; color: var(--color-indigo); }
.side-tools__logo { flex-shrink: 0; width: 28px; height: 28px; }
.side-tools__logo .tool-initials { width: 28px !important; height: 28px !important; border: 0; border-radius: 8px !important; background: var(--color-lavender); color: var(--color-indigo); font-family: var(--font-heading); font-size: 11px !important; font-weight: 700; }
.side-tools__logo .tool-logo-img { width: 28px !important; height: 28px !important; border-radius: 8px; object-fit: contain; }
.side-tools__txt { flex: 1; min-width: 0; }
.side-tools__name { display: block; font-family: var(--font-heading); font-size: 15px; font-weight: 600; line-height: 1.3; }
.side-tools__price { display: block; font-size: 12px; color: var(--color-indigo); }
.side-tools .pa-btn { margin-top: 12px; min-height: 44px; }

/* Mobile TOC (screens without the sidebar) */
.post-mtoc { margin-bottom: 32px; scroll-margin-top: 90px; background: #fff; border: 1px solid var(--color-lavender); border-radius: 12px; }
.post-mtoc summary { display: flex; align-items: center; justify-content: space-between; min-height: 52px; padding: 0 16px; list-style: none; cursor: pointer; font-size: 12px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--color-indigo); }
.post-mtoc summary::-webkit-details-marker { display: none; }
.post-mtoc summary .icon { flex-shrink: 0; width: 18px; height: 18px; transition: transform .2s; }
.post-mtoc[open] summary .icon { transform: rotate(180deg); }
.post-page .post-mtoc ol { margin: 0; padding: 0 16px 10px; list-style: none; }
.post-mtoc a { display: grid; grid-template-columns: 30px 1fr; align-items: center; min-height: 44px; border-top: 1px solid var(--color-lavender); font-size: 15px; line-height: 1.35; color: var(--color-deep); }
.post-mtoc a span { font-size: 12px; color: var(--color-primary); }
@media (min-width: 980px) { .post-mtoc { display: none; } }

/* ---------- Closing CTA ---------- */
.post-cta { margin-top: 72px; }
.post-cta__box { display: flex; flex-direction: column; align-items: flex-start; padding: var(--pa-box); background: var(--color-lavender); border-radius: 12px; }
.post-cta__box p,
.post-cta__box h2 { margin: 0; }
.post-cta__eyebrow { font-size: 12px; font-weight: 500; letter-spacing: .06em; text-transform: uppercase; color: var(--color-indigo); }
.post-cta__title { margin-top: 10px !important; font-family: var(--font-heading); font-size: 26px; font-weight: 700; line-height: 1.2; color: var(--color-deep); }
.post-cta__desc { margin-top: 8px !important; font-size: 16px; line-height: 1.6; }
.post-page .post-cta__chips { display: flex; flex-wrap: wrap; gap: 8px; margin: 20px 0 0; padding: 0; list-style: none; }
.post-cta__chips a { display: inline-flex; align-items: center; min-height: 44px; padding: 0 18px; border: 1px solid rgba(83, 74, 183, .3); border-radius: 999px; background: #fff; color: var(--color-deep); font-size: 15px; font-weight: 500; transition: border-color .2s; }
.post-cta__chips a:hover { border-color: var(--color-accent); color: var(--color-deep); }
.post-cta__all { min-height: 44px; margin-top: 20px; color: var(--color-indigo); font-size: 15px; }
.post-cta__all:hover { color: var(--color-deep); }

/* ---------- Related posts ---------- */
.post-related { margin-top: 80px; padding: 64px 0; background: rgba(238, 237, 254, .5); }
.post-related__head { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 12px; }
.post-related__head h2 { margin: 0; font-family: var(--font-heading); font-size: var(--pa-h2); font-weight: 700; line-height: 1.2; color: var(--color-deep); }
.post-related__head .arrow-link { min-height: 44px; color: var(--color-indigo); font-size: 15px; }
.post-page .post-related__grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 24px; margin: 28px 0 0; padding: 0; list-style: none; }
@media (min-width: 760px) { .post-page .post-related__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 980px) { .post-page .post-related__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.rel-card { display: flex; flex-direction: column; height: 100%; overflow: hidden; background: #fff; border: 1px solid var(--color-lavender); border-radius: 12px; color: var(--color-deep); transition: transform .2s, box-shadow .2s; }
.rel-card:hover { transform: translateY(-2px); box-shadow: var(--shadow-sm); color: var(--color-deep); }
.rel-card__media { position: relative; display: block; aspect-ratio: 16 / 9; margin: 12px 12px 0; overflow: hidden; border-radius: 12px; background: var(--color-lavender); }
.rel-card__media.is-dark { background: var(--color-deep); }
.rel-card__media img,
.rel-card__mesh { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.rel-card__body { display: flex; flex: 1; flex-direction: column; align-items: flex-start; gap: 10px; padding: 18px 20px 22px; }
.rel-card__cat { padding: 4px 10px; border-radius: 999px; background: var(--color-lavender); color: var(--color-indigo); font-size: 11px; font-weight: 500; letter-spacing: .06em; text-transform: uppercase; }
.rel-card__title { font-family: var(--font-heading); font-size: 20px; font-weight: 600; line-height: 1.3; text-wrap: balance; }
.rel-card__meta { margin-top: auto; font-size: 13px; color: var(--color-indigo); }

/* ---------- Strip before the footer ---------- */
.post-strip { position: relative; display: grid; place-items: center; min-height: 240px; overflow: hidden; padding: 56px var(--pa-pad); background: var(--color-prompt); }
.post-strip__mesh { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; }
.post-strip__in { position: relative; display: flex; flex-direction: column; align-items: center; gap: 24px; max-width: 760px; text-align: center; }
.post-strip__title { margin: 0; font-family: var(--font-heading); font-size: 26px; font-weight: 700; line-height: 1.2; color: #fff; text-wrap: balance; }
@media (min-width: 760px) { .post-strip__title { font-size: 32px; } }
.post-strip__cta { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; }
.single-post .site-footer { border-top: 1px solid rgba(238, 237, 254, .08); }

/* ---------- Bottom bar + back to top ---------- */
.post-bar {
	position: fixed;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 75;
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 10px;
	padding: 10px 16px calc(10px + env(safe-area-inset-bottom));
	background: #fff;
	border-top: 1px solid var(--color-border);
}
.post-bar .pa-btn:only-child { grid-column: 1 / -1; }
.post-top {
	position: fixed;
	right: 20px;
	bottom: 84px;
	z-index: 70;
	display: grid;
	place-items: center;
	width: 44px;
	height: 44px;
	border-radius: 50%;
	background: var(--color-accent);
	color: #fff;
	box-shadow: var(--shadow-sm);
	cursor: pointer;
}
.post-top:hover { background: var(--color-indigo); }
.post-top[hidden] { display: none; }
@media (max-width: 979px) { .single-post .site-footer { padding-bottom: 76px; } }
@media (min-width: 980px) {
	.post-bar { display: none; }
	.post-top { bottom: 24px; }
}

@media (prefers-reduced-motion: reduce) {
	.pa-faq__chev, .rel-card, .share__btn, .pa-prompt__copy { transition: none; }
}
