/* Publicators Compare 2026 — scoped page styles.
 *
 * SCOPING RULE, learned the hard way on the FAQ plugin: EVERY selector gets exactly ONE `.pc26`.
 * Not zero (the theme's own rules then win and the page falls apart), and not two (the specificity
 * then jumps above the theme's, which is fine until a later rule in this file needs to override an
 * earlier one and silently cannot). One `.pc26` on every selector keeps the whole file at a single,
 * predictable specificity.
 *
 * The site serves Rubik, not Heebo — see publicators-footer.php. Do not add a webfont here; the
 * font is already loaded site-wide and asking for a second one costs a render-blocking request for
 * a face nothing else on the page uses.
 *
 * RTL: these pages are Hebrew-only, and publicators-geo.php sets dir="rtl" lang="he-IL" on any URL
 * containing "heb" — which every one of our six slugs does. Logical properties are used throughout
 * so nothing here breaks if that ever changes.
 */

.pc26 {
	--pc-ink: #16130f;
	--pc-ink-2: #4b463f;
	--pc-line: #e6e1d8;
	--pc-paper: #fbfaf7;
	--pc-card: #ffffff;
	--pc-brand: #ff5b2e;
	--pc-yes: #1c7a4a;
	--pc-part: #9a6b12;
	--pc-no: #98928a;
	--pc-wrap: 1120px;

	background: var(--pc-paper);
	color: var(--pc-ink);
	font-family: "Rubik", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
	font-size: 17px;
	line-height: 1.65;
	padding-bottom: 64px;
}

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

.pc26 .pc26-wrap {
	max-width: var(--pc-wrap);
	margin-inline: auto;
	padding-inline: 20px;
}

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

.pc26 .pc26-hero {
	background: linear-gradient(180deg, #fff 0%, var(--pc-paper) 100%);
	border-bottom: 1px solid var(--pc-line);
	padding: clamp(28px, 5vw, 64px) 0 clamp(22px, 4vw, 44px);
}

.pc26 .pc26-eyebrow {
	font-size: 13px;
	font-weight: 600;
	letter-spacing: .04em;
	color: var(--pc-ink-2);
	margin: 0 0 12px;
	text-transform: none;
}

.pc26 .pc26-eyebrow a { color: var(--pc-brand); text-decoration: none; }
.pc26 .pc26-eyebrow a:hover { text-decoration: underline; }

.pc26 h1 {
	font-size: clamp(27px, 3.6vw, 46px);
	font-weight: 800;
	line-height: 1.15;
	letter-spacing: -0.4px;
	margin: 0 0 18px;
	color: var(--pc-ink);
	text-transform: none;
}

.pc26 .pc26-lede {
	font-size: clamp(17px, 1.4vw, 20px);
	line-height: 1.6;
	color: var(--pc-ink-2);
	max-width: 78ch;
	margin: 0;
}

.pc26 .pc26-flag {
	margin: 16px 0 0;
	padding: 10px 14px;
	border-inline-start: 3px solid var(--pc-brand);
	background: #fff;
	border-radius: 0 10px 10px 0;
	font-size: 15px;
	color: var(--pc-ink-2);
}

/* ------------------------------------------------------------ sections */

.pc26 section { margin-top: clamp(34px, 5vw, 58px); }

.pc26 h2 {
	font-size: clamp(21px, 2.2vw, 29px);
	font-weight: 700;
	line-height: 1.25;
	margin: 0 0 14px;
	color: var(--pc-ink);
	text-transform: none;
}

.pc26 h3 {
	font-size: 18px;
	font-weight: 700;
	margin: 0 0 8px;
	color: var(--pc-ink);
	text-transform: none;
}

.pc26 p { margin: 0 0 14px; max-width: 82ch; }
.pc26 p:last-child { margin-bottom: 0; }

.pc26 .pc26-answer {
	background: var(--pc-card);
	border: 1px solid var(--pc-line);
	border-radius: 16px;
	padding: clamp(18px, 2.6vw, 30px);
}

.pc26 .pc26-fine {
	font-size: 14.5px;
	color: var(--pc-ink-2);
	margin-top: 12px;
}

.pc26 code {
	font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
	font-size: .9em;
	background: #f1eee8;
	padding: 1px 5px;
	border-radius: 4px;
	direction: ltr;
	display: inline-block;
}

/* -------------------------------------------------------------- tables */

/* Wide tables scroll inside their own box; the page body must never scroll sideways. */
.pc26 .pc26-tablewrap {
	overflow-x: auto;
	border: 1px solid var(--pc-line);
	border-radius: 14px;
	background: var(--pc-card);
	-webkit-overflow-scrolling: touch;
}

.pc26 .pc26-table {
	width: 100%;
	border-collapse: collapse;
	font-size: 15.5px;
	min-width: 620px;
}

.pc26 .pc26-caption {
	caption-side: bottom;
	text-align: start;
	font-size: 13.5px;
	color: var(--pc-ink-2);
	padding: 10px 16px 14px;
}

.pc26 .pc26-table th,
.pc26 .pc26-table td {
	text-align: start;
	padding: 12px 16px;
	border-bottom: 1px solid var(--pc-line);
	vertical-align: top;
}

.pc26 .pc26-table thead th {
	font-weight: 700;
	font-size: 14.5px;
	background: #f6f3ee;
	white-space: nowrap;
}

.pc26 .pc26-table tbody tr:last-child th,
.pc26 .pc26-table tbody tr:last-child td { border-bottom: 0; }

.pc26 .pc26-table tbody th[scope="row"] {
	font-weight: 600;
	color: var(--pc-ink);
	width: 26%;
}

.pc26 .pc26-table .pc26-us { background: #fff7f4; }
.pc26 .pc26-table .pc26-usrow th[scope="row"] { color: var(--pc-brand); }
.pc26 .pc26-table a { color: var(--pc-brand); }

.pc26 .pc26-note {
	display: block;
	font-size: 13px;
	font-weight: 400;
	color: var(--pc-ink-2);
	margin-top: 4px;
}

.pc26 .pc26-matrix th[scope="row"] { width: auto; white-space: nowrap; }
.pc26 .pc26-matrix td { text-align: center; font-size: 17px; }

.pc26 .pc26-yes { color: var(--pc-yes); font-weight: 700; }
.pc26 .pc26-no { color: var(--pc-no); }

.pc26 .pc26-badge {
	display: inline-block;
	font-size: 12.5px;
	font-weight: 600;
	line-height: 1.3;
	padding: 4px 10px;
	border-radius: 999px;
	white-space: nowrap;
}

.pc26 .pc26-badge--yes { background: #e6f4ec; color: var(--pc-yes); }
.pc26 .pc26-badge--part { background: #fdf3e0; color: var(--pc-part); }
.pc26 .pc26-badge--no { background: #f1eee8; color: #6d6862; }

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

.pc26 .pc26-cards {
	list-style: none;
	margin: 18px 0 0;
	padding: 0;
	display: grid;
	gap: 12px;
	grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
}

.pc26 .pc26-card a {
	display: block;
	height: 100%;
	background: var(--pc-card);
	border: 1px solid var(--pc-line);
	border-radius: 14px;
	padding: 16px 18px;
	text-decoration: none;
	color: var(--pc-ink);
	transition: border-color .15s ease, transform .15s ease;
}

.pc26 .pc26-card a:hover { border-color: var(--pc-brand); transform: translateY(-1px); }
.pc26 .pc26-card-h { display: block; font-weight: 700; margin-bottom: 4px; }
.pc26 .pc26-card-b { display: block; font-size: 13.5px; color: var(--pc-ink-2); }

/* ------------------------------------------------------------- choose */

.pc26 .pc26-choose-grid {
	display: grid;
	gap: 14px;
	grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
}

.pc26 .pc26-choose-col {
	background: var(--pc-card);
	border: 1px solid var(--pc-line);
	border-radius: 14px;
	padding: 20px;
}

.pc26 .pc26-choose-us { border-color: #ffd7c9; background: #fff9f6; }

/* A named reason inside either choose column. Both sides use it - see pc26_reasons(). */
.pc26 .pc26-reason { margin-top: 14px; }
.pc26 .pc26-reason:first-of-type { margin-top: 10px; }

.pc26 .pc26-reason h4 {
	margin: 0 0 4px;
	font-size: 15.5px;
	font-weight: 600;
	line-height: 1.4;
}

.pc26 .pc26-reason p { margin: 0; }

/* ---------------------------------------------------------- included */

.pc26 .pc26-included {
	background: var(--pc-card);
	border: 1px solid var(--pc-line);
	border-radius: 16px;
	padding: clamp(18px, 2.6vw, 30px);
	margin-bottom: 26px;
}

.pc26 .pc26-included-lede { max-width: 62ch; color: var(--pc-ink-2); }

.pc26 .pc26-included-grid {
	display: grid;
	gap: 14px 22px;
	grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
	margin-top: 18px;
}

.pc26 .pc26-included-item h3 {
	margin: 0 0 4px;
	font-size: 16px;
	font-weight: 600;
	line-height: 1.4;
}

.pc26 .pc26-included-item p { margin: 0; font-size: 15px; }

/* ------------------------------------------------------ method + notes */

.pc26 .pc26-notes,
.pc26 .pc26-method-list,
.pc26 .pc26-sources {
	margin: 0 0 14px;
	padding-inline-start: 22px;
}

.pc26 .pc26-notes li,
.pc26 .pc26-method-list li,
.pc26 .pc26-sources li { margin-bottom: 9px; }

.pc26 .pc26-method {
	background: var(--pc-card);
	border: 1px solid var(--pc-line);
	border-radius: 16px;
	padding: clamp(18px, 2.6vw, 30px);
}

.pc26 .pc26-method h3 { margin-top: 20px; }

.pc26 .pc26-sources { font-size: 14.5px; word-break: break-word; }

.pc26 .pc26-src {
	color: var(--pc-brand);
	text-decoration: underline;
	text-underline-offset: 2px;
	/* URLs are Latin inside Hebrew text; without isolation the bidi algorithm drags the
	   trailing punctuation to the wrong side of the link. */
	unicode-bidi: isolate;
	direction: ltr;
	display: inline-block;
}

/* ----------------------------------------------------------------- cta */

.pc26 .pc26-cta {
	background: var(--pc-ink);
	color: #fff;
	border-radius: 18px;
	padding: clamp(24px, 3.4vw, 40px);
}

.pc26 .pc26-cta h2 { color: #fff; }
.pc26 .pc26-cta p { color: #d8d3cb; }

.pc26 .pc26-cta-row {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin-top: 18px;
}

.pc26 .pc26-btn {
	display: inline-block;
	padding: 12px 24px;
	border-radius: 999px;
	font-weight: 600;
	font-size: 15.5px;
	text-decoration: none;
	transition: opacity .15s ease;
}

.pc26 .pc26-btn:hover { opacity: .88; }
.pc26 .pc26-btn-primary { background: var(--pc-brand); color: #fff; }
.pc26 .pc26-btn-line { background: transparent; color: #fff; box-shadow: inset 0 0 0 1px #6b655d; }

/* --------------------------------------------------------------- small */

@media (max-width: 640px) {
	.pc26 { font-size: 16px; }
	.pc26 .pc26-table { font-size: 14.5px; }
	.pc26 .pc26-table th, .pc26 .pc26-table td { padding: 10px 12px; }
}

/* The theme paints its own background behind the page; without this the paper colour stops at
   the .pc26 block and the strip below the content reverts to the theme's white. */
body.pc26-page { background: #fbfaf7; }