/**
 * Smart Blog Layouts Portal — single-post visual system, version 2.3.3.
 *
 * Loaded after the compatibility palettes and scoped exclusively to plugin
 * markup. Design Center variables, when enabled, are loaded later and remain
 * the highest-priority source of colors, typography and geometry.
 */

/* ==========================================================================
 * 2.3.3 — neutral editorial redesign for all 13 single-post layouts.
 *
 * This layer deliberately comes after the historical layout rules. It keeps
 * the public markup and extension points intact while replacing the visual
 * model with shared design tokens, calm surfaces and predictable responsive
 * behavior. All selectors remain scoped to plugin-owned classes.
 * ========================================================================== */

body.sblp-layout-active {
	--sblp-single-page: var(--sblp-design-page-bg, var(--sblp-theme-bg, #f7f8fa));
	--sblp-single-surface: var(--sblp-design-surface, var(--sblp-theme-surface, #ffffff));
	--sblp-single-soft: var(--sblp-design-surface-soft, var(--sblp-theme-surface-soft, #f3f5f7));
	--sblp-single-elevated: var(--sblp-design-surface-elevated, var(--sblp-theme-surface, #ffffff));
	--sblp-single-text: var(--sblp-design-text, var(--sblp-theme-text, #1f2933));
	--sblp-single-muted: var(--sblp-design-muted, var(--sblp-theme-muted, #667085));
	--sblp-single-heading: var(--sblp-design-heading, var(--sblp-single-text));
	--sblp-single-border: var(--sblp-design-border, var(--sblp-theme-border, #dfe3e8));
	--sblp-single-accent: var(--sblp-design-accent, var(--sblp-palette-accent, #4f6f8f));
	--sblp-single-accent-strong: var(--sblp-design-accent-strong, var(--sblp-palette-accent-strong, #35556f));
	--sblp-single-accent-soft: var(--sblp-design-accent-soft, var(--sblp-palette-accent-soft, #e7eef4));
	--sblp-single-accent-foreground: var(--sblp-design-link, var(--sblp-link, var(--sblp-single-text)));
	--sblp-single-on-accent: var(--sblp-design-on-accent, var(--sblp-palette-on-accent, #ffffff));
	--sblp-single-focus: var(--sblp-design-focus, var(--sblp-palette-focus, rgba(79, 111, 143, 0.48)));
	--sblp-ink: var(--sblp-single-text);
	--sblp-muted: var(--sblp-single-muted);
	--sblp-soft: var(--sblp-single-soft);
	--sblp-line: var(--sblp-single-border);
	--sblp-surface: var(--sblp-single-surface);
	--sblp-accent: var(--sblp-single-accent);
	--sblp-accent-dark: var(--sblp-single-accent-strong);
	--sblp-accent-soft: var(--sblp-single-accent-soft);
	--sblp-on-accent: var(--sblp-single-on-accent);
	--sblp-radius-lg: var(--sblp-geometry-radius-card, 24px);
	--sblp-radius-md: var(--sblp-geometry-radius-base, 16px);
	--sblp-radius-sm: var(--sblp-geometry-radius-button, 10px);
	--sblp-control-height: var(--sblp-geometry-control-height, 44px);
	--sblp-content-width: var(--sblp-geometry-content-width, 760px);
	--sblp-wide-width: var(--sblp-geometry-wide-width, 1240px);
	--sblp-section-space: 50px;
	--sblp-card-gap: var(--sblp-geometry-card-gap, 24px);
	--sblp-shadow: var(--sblp-design-box-shadow, 0 18px 52px rgba(20, 31, 43, 0.09));
}

body.sblp-layout-active .sblp-site-main {
	background: var(--sblp-single-page);
	color: var(--sblp-single-text);
	display: flex;
	flex-direction: column;
	gap: 50px;
}

body.sblp-layout-active .sblp-site-main > * {
	margin-block: 0 !important;
}

body.sblp-layout-active :where(.sblp-post, .sblp-breadcrumbs, .sblp-after-article, .sblp-comments-shell) ::selection {
	background: var(--sblp-design-selection-bg, var(--sblp-single-accent-soft));
	color: var(--sblp-design-selection-text, var(--sblp-single-text));
}

.sblp-post.sblp-layout {
	/* Reset legacy per-layout custom properties at the post scope. The values
	 * below still inherit Design Center tokens from the managed body context,
	 * but prevent historical hard-coded layout accents from winning merely
	 * because they were declared on the article element. */
	--sblp-ink: var(--sblp-single-text);
	--sblp-muted: var(--sblp-single-muted);
	--sblp-soft: var(--sblp-single-soft);
	--sblp-line: var(--sblp-single-border);
	--sblp-surface: var(--sblp-single-surface);
	--sblp-accent: var(--sblp-single-accent);
	--sblp-accent-dark: var(--sblp-single-accent-strong);
	--sblp-accent-soft: var(--sblp-single-accent-soft);
	--sblp-on-accent: var(--sblp-single-on-accent);
	color: var(--sblp-ink);
	display: flex;
	flex-direction: column;
	font-family: var(--sblp-font-body, inherit);
	font-size: 1rem;
	gap: 50px;
	line-height: 1.68;
	isolation: isolate;
}

.sblp-post.sblp-layout > * {
	margin-block: 0 !important;
}

.sblp-post.sblp-layout :where(a, button, input, select, textarea, summary) {
	-webkit-tap-highlight-color: transparent;
}

.sblp-post.sblp-layout :where(a, button, input, select, textarea, summary):focus-visible {
	border-radius: max(4px, var(--sblp-radius-sm));
	outline: 3px solid var(--sblp-design-focus, var(--sblp-focus, rgba(79, 111, 143, 0.48)));
	outline-offset: 3px;
}

body.sblp-layout-active :where(.sblp-breadcrumbs, .sblp-after-article, .sblp-comments-shell) :where(a, button, input, select, textarea, summary):focus-visible {
	border-radius: max(4px, var(--sblp-radius-sm));
	outline: 3px solid var(--sblp-single-focus);
	outline-offset: 3px;
}

.sblp-post.sblp-layout :where(button, .button, input[type="button"], input[type="submit"], input[type="reset"], .sblp-cta__button, .sblp-back-to-top) {
	min-height: max(44px, var(--sblp-control-height));
}

.sblp-layout__shell {
	max-width: var(--sblp-wide-width);
	width: min(calc(100% - clamp(28px, 5vw, 64px)), var(--sblp-wide-width));
}

.sblp-layout__shell:not(.sblp-after-article):not([class*="-hero__inner"]) {
	display: flex;
	flex-direction: column;
	gap: 50px;
}

.sblp-layout__shell:not(.sblp-after-article):not([class*="-hero__inner"]) > * {
	margin-block: 0 !important;
}

.sblp-layout__shell--news,
.sblp-layout__shell--opinion {
	max-width: min(var(--sblp-wide-width), 1080px);
}

.sblp-layout-hero {
	background: var(--sblp-design-hero-bg, var(--sblp-surface));
	border: 1px solid var(--sblp-line);
	border-radius: var(--sblp-radius-lg);
	box-shadow: var(--sblp-shadow);
	color: var(--sblp-design-hero-text, var(--sblp-ink));
	isolation: isolate;
	position: relative;
}

.sblp-layout-hero .sblp-post-title {
	color: inherit;
}

.sblp-layout-hero .sblp-post-lead {
	color: var(--sblp-design-lead-text, var(--sblp-muted));
}

.sblp-post-title {
	font-family: var(--sblp-font-h1, inherit);
	font-size: clamp(2.25rem, 3.4vw + 1rem, 4.75rem);
	font-weight: var(--sblp-type-heading-weight, 760);
	letter-spacing: var(--sblp-type-heading-spacing, -0.045em);
	line-height: 1.035;
	max-width: 18ch;
	text-wrap: balance;
}

.sblp-post-lead {
	font-size: clamp(1.08rem, 0.6vw + 1rem, 1.38rem);
	line-height: 1.55;
	margin-top: clamp(18px, 2.8vw, 28px);
	max-width: 66ch;
	text-wrap: pretty;
}

.sblp-layout-kicker,
.sblp-type-pill,
.sblp-breaking-badge,
.sblp-announcement-badge {
	align-items: center;
	border: 1px solid var(--sblp-design-kicker-border, var(--sblp-line));
	border-radius: 999px;
	display: inline-flex;
	font-family: var(--sblp-font-accent, inherit);
	font-size: var(--sblp-type-accent-size, 0.74rem);
	font-weight: var(--sblp-type-accent-weight, 760);
	gap: 8px;
	letter-spacing: var(--sblp-type-accent-spacing, 0.075em);
	line-height: 1.2;
	max-width: 100%;
	min-height: 30px;
	overflow-wrap: anywhere;
	padding: 6px 11px;
	text-transform: var(--sblp-type-accent-transform, uppercase);
	white-space: normal;
	width: fit-content;
}

body.sblp-layout-active .sblp-layout-kicker {
	background: var(--sblp-design-kicker-bg, var(--sblp-accent-soft));
	border: 1px solid var(--sblp-design-kicker-border, var(--sblp-line));
	border-radius: 999px;
	color: var(--sblp-design-kicker-text, var(--sblp-single-accent-foreground));
	line-height: 1.2;
	margin: 16px 0 14px;
	padding: 6px 11px;
}

.sblp-category-list {
	align-items: center;
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 0;
	max-width: 100%;
}

body.sblp-layout-active .sblp-category-chip {
	align-items: center;
	background: var(--sblp-design-chip-bg, var(--sblp-surface));
	border: 1px solid var(--sblp-design-chip-border, var(--sblp-line));
	border-radius: 999px;
	color: var(--sblp-design-chip-text, var(--sblp-single-accent-foreground));
	display: inline-flex;
	font-size: 0.78rem;
	font-weight: 680;
	line-height: 1.25;
	min-height: max(44px, var(--sblp-control-height));
	padding: 8px 13px;
	text-decoration: none;
	transition: background-color 160ms ease, border-color 160ms ease, color 160ms ease;
}

body.sblp-layout-active .sblp-layout-hero .sblp-category-chip:hover,
body.sblp-layout-active .sblp-category-chip:hover {
	background: var(--sblp-accent-soft);
	border-color: var(--sblp-accent);
	color: var(--sblp-single-accent-foreground);
	transform: none;
}

/* Every redesigned hero uses a neutral surface. Override the historical
 * translucent chips that were intended for dark photographic heroes. */
body.sblp-layout-active .sblp-layout-hero .sblp-category-chip {
	background: var(--sblp-design-chip-bg, var(--sblp-surface));
	border-color: var(--sblp-design-chip-border, var(--sblp-line));
	color: var(--sblp-design-chip-text, var(--sblp-single-accent-foreground));
}

.sblp-post-meta {
	color: var(--sblp-design-metadata-text, var(--sblp-muted));
	font-family: var(--sblp-font-meta, inherit);
	font-size: var(--sblp-type-metadata-size, 0.86rem);
	gap: 8px 12px;
	line-height: 1.45;
	margin-top: clamp(20px, 3vw, 30px);
}

.sblp-post-meta a {
	font-weight: 680;
	text-decoration-thickness: 1px;
	text-underline-offset: 0.18em;
}

.sblp-post-meta__separator {
	height: 3px;
	opacity: 0.45;
	width: 3px;
}

.sblp-featured-media {
	margin-top: clamp(24px, 4vw, 48px);
}

.sblp-featured-media__image {
	background: var(--sblp-soft);
	border: 1px solid var(--sblp-line);
	border-radius: var(--sblp-radius-lg);
	box-shadow: var(--sblp-shadow);
	max-height: min(74vh, 780px);
}

.sblp-featured-media figcaption {
	color: var(--sblp-muted);
	font-size: 0.82rem;
	margin-top: 10px;
	max-width: var(--sblp-content-width);
	padding-inline: 0;
	text-align: start;
}

.sblp-reading-layout,
.sblp-guide-grid {
	column-gap: clamp(28px, 4.8vw, 64px);
	row-gap: 50px;
	margin-top: clamp(40px, 6vw, 76px);
}

.sblp-reading-layout {
	grid-template-columns: minmax(0, var(--sblp-content-width));
}

.sblp-reading-layout--with-toc,
.sblp-guide-grid--with-toc {
	grid-template-columns: minmax(220px, 270px) minmax(0, var(--sblp-content-width));
}

/* Content-adjacent modules own one top interval. This avoids the old stack of
 * prose margin + component margin + outer layout margin while leaving each
 * component's internal padding untouched. */
body.sblp-layout-active :where(.sblp-reading-layout__content, .sblp-guide-grid__content) > :where(
	.sblp-embedded-cta,
	.sblp-page-links,
	.sblp-tag-list,
	.sblp-author-card
) {
	margin: 50px 0 0 !important;
}

body.sblp-layout-active .sblp-prose > :first-child {
	margin-top: 0;
}

body.sblp-layout-active .sblp-prose > :last-child {
	margin-bottom: 0;
}

.sblp-toc {
	background: var(--sblp-design-toc-bg, var(--sblp-surface));
	border: 1px solid var(--sblp-design-toc-border, var(--sblp-line));
	border-radius: var(--sblp-radius-md);
	box-shadow: var(--sblp-shadow);
	color: var(--sblp-design-toc-text, var(--sblp-ink));
	padding: 14px 16px;
}

.sblp-toc__header {
	min-height: 44px;
}

.sblp-toc__title {
	color: inherit;
	font-size: 0.78rem;
	letter-spacing: 0.065em;
}

.sblp-toc__toggle {
	border-color: var(--sblp-line);
	border-radius: var(--sblp-radius-sm);
	min-height: 44px;
}

.sblp-toc__list {
	margin-top: 8px;
}

.sblp-toc__item {
	border-color: var(--sblp-line);
}

.sblp-toc__item a {
	color: var(--sblp-design-toc-link, var(--sblp-muted));
	align-items: center;
	display: flex;
	font-size: 0.86rem;
	font-weight: 560;
	min-height: 44px;
	padding: 10px 4px;
	transform: none;
}

.sblp-toc__item a:hover,
.sblp-toc__item a.is-active {
	color: var(--sblp-single-accent-foreground);
	transform: none;
}

.sblp-toc__item a.is-active {
	font-weight: 720;
}

.sblp-prose {
	background: transparent;
	color: var(--sblp-design-text, var(--sblp-ink));
	font-family: var(--sblp-font-body, inherit);
	font-size: clamp(1.03rem, 0.3vw + 0.98rem, 1.16rem);
	line-height: var(--sblp-type-body-line-height, 1.78);
	margin-inline: auto;
	max-width: min(100%, var(--sblp-content-width));
	padding-inline: 0;
}

.sblp-prose :where(p, li, dd) {
	text-wrap: pretty;
}

.sblp-prose :where(p, ul, ol, figure, table, pre, blockquote, details, .wp-block-group, .wp-block-columns, .wp-block-cover, .wp-block-media-text, .wp-block-gallery) {
	margin-block: 1.45em;
}

.sblp-prose :where(h2, h3, h4, h5, h6) {
	color: var(--sblp-design-heading, var(--sblp-ink));
	font-weight: var(--sblp-type-heading-weight, 740);
	letter-spacing: var(--sblp-type-heading-spacing, -0.026em);
	line-height: 1.18;
	overflow-wrap: anywhere;
	text-wrap: balance;
}

.sblp-prose h2 {
	font-family: var(--sblp-font-h2, inherit);
	font-size: clamp(1.45rem, 1.8vw, 2.05rem);
	margin: 2.15em 0 0.75em;
}

.sblp-prose h3 {
	font-family: var(--sblp-font-h3, inherit);
	font-size: clamp(1.2rem, 1.35vw, 1.5rem);
	margin: 1.9em 0 0.65em;
}

.sblp-prose h4 {
	font-family: var(--sblp-font-h4, inherit);
	font-size: clamp(1.18rem, 0.7vw + 1rem, 1.48rem);
	margin: 1.7em 0 0.55em;
}

.sblp-prose h5 {
	font-family: var(--sblp-font-h5, inherit);
	font-size: 1.08rem;
	margin: 1.55em 0 0.5em;
}

.sblp-prose h6 {
	font-family: var(--sblp-font-h6, inherit);
	font-size: 0.98rem;
	letter-spacing: 0.025em;
	margin: 1.5em 0 0.45em;
	text-transform: uppercase;
}

.sblp-prose :where(ul, ol) {
	padding-inline-start: 1.4em;
}

.sblp-prose :where(ul, ol) :where(ul, ol) {
	margin-block: 0.65em;
}

.sblp-prose li + li {
	margin-top: 0.45em;
}

.sblp-prose a {
	color: var(--sblp-design-link, var(--sblp-link, var(--sblp-single-accent-foreground)));
	font-weight: 600;
	overflow-wrap: anywhere;
	text-decoration-thickness: 0.08em;
	text-underline-offset: 0.16em;
}

.sblp-prose a:hover {
	color: var(--sblp-design-link-hover, var(--sblp-single-accent-foreground));
}

.sblp-prose a:visited {
	color: var(--sblp-design-link-visited, var(--sblp-design-link, var(--sblp-single-accent-foreground)));
}

.sblp-prose :where(img, video, audio, iframe, embed, object, svg) {
	height: auto;
	max-width: 100%;
}

.sblp-prose :where(iframe, video) {
	border: 0;
	border-radius: var(--sblp-radius-md);
	width: 100%;
}

.sblp-prose .wp-block-embed__wrapper {
	max-width: 100%;
	overflow: hidden;
}

.sblp-prose :where(.wp-block-image, .wp-block-gallery, .wp-block-cover, .wp-block-media-text) {
	max-width: 100%;
}

.sblp-prose :where(.wp-block-image img, .wp-block-gallery img, .wp-block-cover, .wp-block-media-text__media img) {
	border-radius: var(--sblp-radius-md);
}

.sblp-prose :where(figcaption, .wp-element-caption) {
	color: var(--sblp-muted);
	font-size: 0.82rem;
	line-height: 1.5;
	margin-top: 0.65em;
}

.sblp-prose blockquote,
.sblp-prose .wp-block-quote,
.sblp-prose .wp-block-pullquote {
	background: var(--sblp-design-blockquote-bg, var(--sblp-soft));
	border: 0;
	border-inline-start: 3px solid var(--sblp-design-blockquote-border, var(--sblp-accent));
	border-radius: 0 var(--sblp-radius-md) var(--sblp-radius-md) 0;
	color: var(--sblp-design-blockquote-text, var(--sblp-ink));
	font-size: 1.08em;
	font-style: normal;
	margin-inline: 0;
	padding: clamp(18px, 3vw, 28px);
}

.sblp-prose .wp-block-pullquote {
	border-block: 1px solid var(--sblp-line);
	border-inline: 0;
	border-radius: 0;
	text-align: start;
}

.sblp-prose :where(code, kbd, samp) {
	background: var(--sblp-design-code-bg, var(--sblp-accent-soft));
	border-radius: 6px;
	color: var(--sblp-design-code-text, var(--sblp-single-accent-foreground));
	font-family: var(--sblp-font-code, ui-monospace, SFMono-Regular, Consolas, monospace);
	font-size: 0.88em;
	padding: 0.14em 0.36em;
}

.sblp-prose pre {
	background: var(--sblp-design-pre-bg, #17212b);
	border: 1px solid var(--sblp-design-pre-border, var(--sblp-line));
	border-radius: var(--sblp-radius-md);
	color: var(--sblp-design-pre-text, #f4f7f9);
	font-family: var(--sblp-font-code, ui-monospace, SFMono-Regular, Consolas, monospace);
	font-size: 0.88em;
	line-height: 1.65;
	max-width: 100%;
	overflow: auto;
	padding: clamp(18px, 3vw, 26px);
	white-space: pre;
}

.sblp-prose pre code {
	background: transparent;
	color: inherit;
	font-size: inherit;
	padding: 0;
}

.sblp-prose :where(table, .wp-block-table table) {
	border-collapse: separate;
	border-spacing: 0;
	font-size: 0.92em;
	min-width: 620px;
	width: 100%;
}

.sblp-prose > table,
.sblp-prose .wp-block-table,
.sblp-prose .sblp-comparison__scroll {
	-webkit-overflow-scrolling: touch;
	border: 1px solid var(--sblp-design-table-border, var(--sblp-line));
	border-radius: var(--sblp-radius-md);
	display: block;
	max-width: 100%;
	overflow-x: auto;
	overflow-y: hidden;
}

.sblp-prose :where(th, td) {
	background: var(--sblp-design-table-row-bg, var(--sblp-surface));
	border: 0;
	border-bottom: 1px solid var(--sblp-design-table-border, var(--sblp-line));
	border-inline-end: 1px solid var(--sblp-design-table-border, var(--sblp-line));
	padding: 13px 15px;
	text-align: start;
	vertical-align: top;
}

.sblp-prose :where(th, td):last-child {
	border-inline-end: 0;
}

.sblp-prose tr:last-child td {
	border-bottom: 0;
}

.sblp-prose th {
	background: var(--sblp-design-table-head-bg, var(--sblp-accent-soft));
	color: var(--sblp-design-table-head-text, var(--sblp-ink));
	font-weight: 720;
}

.sblp-prose tbody tr:nth-child(even) td {
	background: var(--sblp-design-table-alt-bg, var(--sblp-soft));
}

.sblp-prose details {
	background: var(--sblp-surface);
	border: 1px solid var(--sblp-line);
	border-radius: var(--sblp-radius-md);
	padding: 0;
}

.sblp-prose details > summary {
	align-items: center;
	cursor: pointer;
	display: flex;
	font-weight: 680;
	justify-content: space-between;
	min-height: 52px;
	padding: 13px 16px;
}

.sblp-prose details > :not(summary) {
	margin-inline: 16px;
}

.sblp-prose .wp-block-columns {
	gap: clamp(18px, 3vw, 32px);
}

.sblp-prose .wp-block-group,
.sblp-prose .wp-block-media-text {
	min-width: 0;
}

.sblp-prose .wp-block-buttons,
.sblp-prose .wp-block-button {
	max-width: 100%;
}

.sblp-prose .wp-block-button__link,
.sblp-prose .wp-element-button {
	align-items: center;
	border-radius: var(--sblp-radius-sm);
	display: inline-flex;
	justify-content: center;
	min-height: max(44px, var(--sblp-control-height));
	padding: 10px 18px;
	white-space: normal;
}

.sblp-prose .wp-block-separator {
	border-color: var(--sblp-line);
	margin-block: 50px;
}

.sblp-author-card,
.sblp-related-post,
.sblp-post-navigation__link {
	background: var(--sblp-design-surface-elevated, var(--sblp-surface));
	border: 1px solid var(--sblp-line);
	border-radius: var(--sblp-radius-md);
	box-shadow: none;
}

.sblp-author-card,
.sblp-related-posts,
.sblp-post-navigation {
	margin-top: 50px;
}

.sblp-author-card {
	padding: clamp(20px, 4vw, 32px);
}

.sblp-related-post,
.sblp-post-navigation__link {
	transition: border-color 160ms ease, box-shadow 160ms ease, transform 160ms ease;
}

.sblp-related-post:hover,
.sblp-post-navigation__link:hover {
	border-color: var(--sblp-accent);
	box-shadow: var(--sblp-shadow);
	transform: translateY(-2px);
}

.sblp-post-navigation__link {
	min-height: 128px;
	padding: clamp(18px, 3vw, 26px);
}

.sblp-back-to-top {
	align-items: center;
	border-radius: var(--sblp-radius-sm);
	gap: 9px;
	padding: 7px 10px;
}

.sblp-back-to-top span {
	background: var(--sblp-accent-soft);
	border-radius: 50%;
	color: var(--sblp-single-accent-foreground);
	height: 32px;
	width: 32px;
}


/* Shared navigation and post-adjacent components. */
.sblp-breadcrumbs {
	color: var(--sblp-design-breadcrumbs-text, var(--sblp-muted));
	font-family: var(--sblp-font-breadcrumbs, inherit);
	font-size: 12px;
	line-height: 1.3;
	margin: 0 auto;
	max-width: var(--sblp-wide-width);
	overflow-x: auto;
	overflow-y: hidden;
	overscroll-behavior-inline: contain;
	padding: 6px 10px;
	scrollbar-width: thin;
	white-space: nowrap;
	width: min(calc(100% - clamp(28px, 5vw, 64px)), var(--sblp-wide-width));
}

.sblp-breadcrumbs__list {
	align-items: center;
	display: flex;
	width: max-content;
	min-width: 100%;
	flex-wrap: nowrap;
	gap: 0;
	list-style: none;
	margin: 0;
	padding: 0;
}

.sblp-breadcrumbs__item {
	align-items: center;
	display: inline-flex;
	min-width: 0;
	flex: 0 0 auto;
	white-space: nowrap;
}

.sblp-breadcrumbs__item + .sblp-breadcrumbs__item::before {
	color: var(--sblp-design-breadcrumbs-separator, var(--sblp-muted));
	content: "/";
	margin-inline: 8px;
	opacity: 0.6;
}

.sblp-breadcrumbs a {
	align-items: center;
	display: inline-flex;
	min-height: 0;
	padding-block: 4px;
	color: var(--sblp-design-breadcrumbs-link, var(--sblp-single-accent-foreground));
	font-weight: 620;
	text-decoration: none;
	white-space: nowrap;
}

.sblp-breadcrumbs a:hover {
	text-decoration: underline;
	text-underline-offset: 0.18em;
}

.sblp-breadcrumbs [aria-current="page"] {
	color: var(--sblp-design-breadcrumbs-current, var(--sblp-muted));
	display: inline-block;
	max-width: none;
	overflow: visible;
	text-overflow: clip;
	white-space: nowrap;
}

.sblp-tag-list,
.sblp-page-links {
	align-items: center;
	display: flex;
	flex-wrap: wrap;
	gap: 9px;
	margin-top: 50px;
}

.sblp-tag-list__title,
.sblp-page-links > span:first-child {
	color: var(--sblp-muted);
	font-size: 0.78rem;
	font-weight: 720;
	letter-spacing: 0.06em;
	text-transform: uppercase;
}

.sblp-tag-list a,
.sblp-page-links a,
.sblp-page-links > span:not(:first-child) {
	align-items: center;
	background: var(--sblp-soft);
	border: 1px solid var(--sblp-line);
	border-radius: 999px;
	color: var(--sblp-single-accent-foreground);
	display: inline-flex;
	font-size: 0.82rem;
	font-weight: 650;
	min-height: max(44px, var(--sblp-control-height));
	padding: 8px 12px;
	text-decoration: none;
}

.sblp-tag-list a:hover,
.sblp-page-links a:hover {
	background: var(--sblp-accent-soft);
	border-color: var(--sblp-accent);
	color: var(--sblp-single-accent-foreground);
}

.sblp-embedded-cta {
	background: var(--sblp-design-cta-bg, var(--sblp-soft));
	border: 1px solid var(--sblp-line);
	border-radius: var(--sblp-radius-lg);
	box-shadow: none;
	color: var(--sblp-design-cta-text, var(--sblp-ink));
	gap: clamp(18px, 4vw, 38px);
	margin-block: 50px;
	padding: clamp(22px, 4vw, 36px);
}

.sblp-embedded-cta::before {
	background: var(--sblp-accent);
	border-radius: 999px;
	inset-block: 20px;
	inset-inline-start: 0;
	width: 3px;
}

.sblp-embedded-cta__title {
	color: inherit;
	font-family: var(--sblp-font-h2, inherit);
	font-size: clamp(1.3rem, 1.4vw + 1rem, 1.85rem);
	letter-spacing: -0.025em;
	line-height: 1.18;
}

.sblp-embedded-cta__text {
	color: var(--sblp-muted);
	line-height: 1.6;
}

.sblp-embedded-cta--button .sblp-embedded-cta__content :where(a, button),
.sblp-embedded-cta__content :where(input[type="submit"], button[type="submit"]) {
	align-items: center;
	background: var(--sblp-design-cta-button-bg, var(--sblp-accent-strong, var(--sblp-accent)));
	border: 1px solid transparent;
	border-radius: var(--sblp-radius-sm);
	color: var(--sblp-design-cta-button-text, var(--sblp-on-accent));
	display: inline-flex;
	font-family: var(--sblp-font-button, inherit);
	font-weight: 720;
	justify-content: center;
	min-height: max(44px, var(--sblp-control-height));
	padding: 10px 18px;
	text-decoration: none;
}

.sblp-embedded-cta--button .sblp-embedded-cta__content :where(a, button):hover,
.sblp-embedded-cta__content :where(input[type="submit"], button[type="submit"]):hover {
	background: var(--sblp-design-cta-button-bg, var(--sblp-accent-strong, var(--sblp-accent)));
	color: var(--sblp-design-cta-button-text, var(--sblp-on-accent));
	transform: none;
}

.sblp-key-points,
.sblp-note,
.sblp-sources,
.sblp-verified,
.sblp-reading-summary,
.sblp-comparison,
.sblp-pros-cons {
	border-color: var(--sblp-line);
	border-radius: var(--sblp-radius-md);
	box-shadow: none;
}

.sblp-key-points,
.sblp-reading-summary {
	background: var(--sblp-soft);
}

.sblp-note,
.sblp-sources,
.sblp-verified {
	background: var(--sblp-surface);
}

.sblp-key-points__badge,
.sblp-note__badge,
.sblp-sources__badge,
.sblp-verified__icon {
	background: var(--sblp-accent-soft);
	color: var(--sblp-single-accent-foreground);
}

.sblp-author-card__name,
.sblp-related-posts__heading h2,
.sblp-post-navigation__link strong {
	color: var(--sblp-design-heading, var(--sblp-ink));
	font-family: var(--sblp-font-h2, inherit);
}

.sblp-author-card__bio,
.sblp-related-posts__heading p,
.sblp-related-post__body > p,
.sblp-post-navigation__link > span {
	color: var(--sblp-muted);
}

.sblp-related-posts__heading {
	align-items: center;
}

.sblp-related-posts__heading h2 {
	font-size: clamp(1.35rem, 1.7vw, 1.9rem);
	font-stretch: normal;
	letter-spacing: -0.012em;
	line-height: 1.2;
}

.sblp-related-posts__grid {
	gap: var(--sblp-card-gap);
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 340px), 1fr));
}

.sblp-related-post__media img,
.sblp-related-post__placeholder {
	border-radius: calc(var(--sblp-radius-md) - 1px) calc(var(--sblp-radius-md) - 1px) 0 0;
}

.sblp-related-post__more {
	align-items: center;
	color: var(--sblp-single-accent-foreground);
	display: inline-flex;
	font-weight: 700;
	min-height: 44px;
	text-decoration: none;
}

.sblp-editorial-trust,
.sblp-subscribe-block,
.sblp-comments-shell {
	border-color: var(--sblp-line);
	border-radius: var(--sblp-radius-lg);
	box-shadow: none;
}

.sblp-editorial-trust {
	background: var(--sblp-design-trust-bg, var(--sblp-surface));
	color: var(--sblp-design-trust-text, var(--sblp-ink));
}

.sblp-subscribe-block {
	background: var(--sblp-design-subscribe-bg, var(--sblp-soft));
	color: var(--sblp-design-subscribe-text, var(--sblp-ink));
}

.sblp-comments-shell {
	background: var(--sblp-design-comments-bg, var(--sblp-surface));
	color: var(--sblp-design-comments-text, var(--sblp-ink));
}

.sblp-comments-shell :where(input:not([type="checkbox"]):not([type="radio"]), textarea, select),
.sblp-embedded-cta__content :where(input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]), textarea, select) {
	background: var(--sblp-design-input-bg, var(--sblp-surface));
	border-color: var(--sblp-design-input-border, var(--sblp-line));
	border-radius: var(--sblp-radius-sm);
	color: var(--sblp-design-input-text, var(--sblp-ink));
	min-height: max(44px, var(--sblp-control-height));
}

/* Default: universal editorial panel with a restrained accent edge. */
.sblp-default-hero {
	background: var(--sblp-design-hero-bg, var(--sblp-surface));
	border-inline-start: 4px solid var(--sblp-accent);
	box-shadow: var(--sblp-shadow);
	padding: clamp(28px, 6vw, 72px);
}

.sblp-layout--default .sblp-post-title {
	max-width: 16ch;
}

/* News: compact metadata and clear status, without decorative noise. */
.sblp-layout--news {
	--sblp-news-alert: var(--sblp-design-error-text, #8f4f58);
	--sblp-news-alert-soft: var(--sblp-design-error-bg, rgba(143, 79, 88, 0.12));
}

.sblp-news-hero {
	background: transparent;
	border: 0;
	border-inline-start: 3px solid var(--sblp-accent);
	border-radius: 0;
	box-shadow: none;
	padding: clamp(8px, 2vw, 20px) 0 clamp(18px, 3vw, 28px) clamp(20px, 4vw, 42px);
}

.sblp-layout--main-news .sblp-news-hero {
	background: var(--sblp-design-hero-bg, var(--sblp-surface));
	border: 1px solid var(--sblp-line);
	border-inline-start: 4px solid var(--sblp-accent);
	border-radius: var(--sblp-radius-lg);
	box-shadow: var(--sblp-shadow);
	padding: clamp(24px, 5vw, 54px);
}

.sblp-news-hero__topline {
	margin-bottom: 18px;
}

.sblp-type-pill {
	background: var(--sblp-design-badge-bg, var(--sblp-accent-soft));
	border-color: var(--sblp-design-badge-border, var(--sblp-line));
	color: var(--sblp-design-badge-text, var(--sblp-single-accent-foreground));
}

.sblp-breaking-badge {
	background: var(--sblp-news-alert-soft);
	border-color: color-mix(in srgb, var(--sblp-news-alert) 36%, transparent);
	color: var(--sblp-news-alert);
}

.sblp-breaking-badge > span::after {
	animation-duration: 2.4s;
}

.sblp-news-hero .sblp-post-title {
	font-size: clamp(2.15rem, 3vw + 1rem, 4.35rem);
	max-width: 20ch;
}

.sblp-post-meta--news > time,
.sblp-post-meta--news > span {
	background: var(--sblp-soft);
	border-color: var(--sblp-line);
	border-radius: var(--sblp-radius-sm);
	padding: 8px 10px;
}

.sblp-news-known {
	background: var(--sblp-surface);
	border-color: var(--sblp-line);
	border-radius: var(--sblp-radius-md);
	box-shadow: none;
}

.sblp-news-known {
	border-inline-start: 3px solid var(--sblp-accent);
}

.sblp-news-known__badge {
	background: var(--sblp-accent-soft);
	color: var(--sblp-single-accent-foreground);
}

.sblp-news-body {
	max-width: var(--sblp-content-width);
}

.sblp-prose--news {
	font-size: clamp(1rem, 0.24vw + 0.98rem, 1.1rem);
	line-height: 1.72;
}

.sblp-prose--news > p:first-child:not(.sblp-drop-cap-target)::first-letter {
	color: inherit;
	float: none;
	font-size: inherit;
	font-weight: inherit;
	line-height: inherit;
	margin: 0;
}

.sblp-news-topics {
	color: var(--sblp-muted);
}

.sblp-news-topics__label {
	color: var(--sblp-muted);
}

.sblp-news-topics a {
	background: var(--sblp-accent-soft);
	border-color: var(--sblp-line);
	color: var(--sblp-single-accent-foreground);
	transition: background-color 160ms ease, border-color 160ms ease, color 160ms ease;
}

.sblp-news-topics a:hover {
	background: var(--sblp-surface);
	border-color: var(--sblp-accent);
	color: var(--sblp-single-accent-foreground);
	transform: none;
}

.sblp-news-topics__live,
.sblp-theme-dark .sblp-news-topics__live {
	background: var(--sblp-design-error-text, #9b5962);
	box-shadow: 0 0 0 4px var(--sblp-design-error-bg, rgba(155, 89, 98, 0.12));
}

@media (prefers-color-scheme: dark) {
	.sblp-theme-system .sblp-news-topics__live {
		background: var(--sblp-design-error-text, #d5949d);
		box-shadow: 0 0 0 4px var(--sblp-design-error-bg, rgba(213, 148, 157, 0.14));
	}
}

/* Expert: calm authority, compact author identity and no full-width color bar. */
.sblp-expert-hero {
	background: var(--sblp-design-hero-bg, var(--sblp-surface-soft));
	color: var(--sblp-design-hero-text, var(--sblp-ink));
	left: auto;
	margin-left: 0;
	overflow: hidden;
	padding: clamp(34px, 7vw, 84px) 0;
	width: 100%;
}

.sblp-expert-hero__orb {
	border-color: var(--sblp-line);
	height: 180px;
	opacity: 0.45;
	right: -76px;
	top: -96px;
	width: 180px;
}

.sblp-expert-hero__inner {
	align-items: end;
	gap: clamp(28px, 5vw, 56px);
	grid-template-columns: minmax(0, 1fr) minmax(200px, auto);
}

.sblp-expert-hero .sblp-post-title,
.sblp-expert-hero .sblp-post-lead,
.sblp-expert-hero .sblp-post-meta {
	color: inherit;
}

body.sblp-layout-active .sblp-expert-hero .sblp-layout-kicker {
	background: transparent;
	border: 0;
	border-inline-start: 2px solid var(--sblp-accent);
	border-radius: 0;
	color: var(--sblp-design-kicker-text, var(--sblp-single-accent-foreground));
	padding: 2px 0 2px 10px;
}

.sblp-expert-hero .sblp-category-chip {
	background: var(--sblp-surface);
	border-color: var(--sblp-line);
	color: var(--sblp-single-accent-foreground);
}

.sblp-expert-hero__author {
	background: var(--sblp-surface);
	border-color: var(--sblp-line);
	border-radius: var(--sblp-radius-md);
	color: var(--sblp-ink);
	min-width: 210px;
	padding: 10px 14px 10px 10px;
}

.sblp-expert-hero__author span {
	color: var(--sblp-muted);
}

.sblp-expert-hero__author a {
	color: var(--sblp-ink);
	text-decoration: none;
}

.sblp-expert-content {
	margin-top: clamp(26px, 5vw, 54px);
}

.sblp-featured-media--expert .sblp-featured-media__image {
	border: 1px solid var(--sblp-line);
	box-shadow: var(--sblp-shadow);
}

.sblp-expert-content > .sblp-reading-layout:first-child {
	background: transparent;
	border: 0;
	border-radius: 0;
	box-shadow: none;
	padding: 0;
}

/* Guide: compact step cue and structured reading rail. */
.sblp-guide-hero {
	align-items: center;
	background: var(--sblp-design-hero-bg, var(--sblp-surface));
	border-color: var(--sblp-line);
	gap: clamp(22px, 4vw, 46px);
	grid-template-columns: auto minmax(0, 1fr);
	padding: clamp(28px, 5vw, 62px);
}

.sblp-guide-hero__badge {
	background: var(--sblp-design-badge-bg, var(--sblp-surface, #ffffff));
	border: 1px solid var(--sblp-design-badge-border, var(--sblp-line));
	border-radius: var(--sblp-radius-md);
	color: var(--sblp-design-badge-text, var(--sblp-text, #1f2933));
	height: clamp(78px, 9vw, 106px);
	width: clamp(78px, 9vw, 106px);
}

.sblp-guide-hero__badge span {
	font-size: clamp(1.55rem, 2.8vw, 2.3rem);
}

.sblp-guide-hero__badge small {
	color: var(--sblp-accent);
	font-size: 1rem;
	margin-top: 4px;
}

.sblp-guide-hero .sblp-post-title {
	max-width: 17ch;
}

.sblp-prose--guide > h2 {
	min-height: 44px;
	padding-inline-start: 58px;
}

.sblp-prose--guide > h2::before {
	background: var(--sblp-accent-soft);
	border-color: var(--sblp-line);
	border-radius: var(--sblp-radius-sm);
	color: var(--sblp-single-accent-foreground);
	height: 42px;
	width: 42px;
}

/* Review: editorial split card without a heavy black slab. */
.sblp-review-hero {
	background: var(--sblp-design-hero-bg, var(--sblp-surface));
	color: var(--sblp-design-hero-text, var(--sblp-ink));
	grid-template-columns: minmax(0, 1.04fr) minmax(280px, 0.96fr);
	min-height: 460px;
}

.sblp-review-hero__copy {
	padding: clamp(30px, 6vw, 70px);
}

.sblp-review-hero .sblp-layout-kicker,
.sblp-review-hero .sblp-post-title,
.sblp-review-hero .sblp-post-meta {
	color: inherit;
}

.sblp-review-hero .sblp-category-chip {
	background: var(--sblp-soft);
	border-color: var(--sblp-line);
	color: var(--sblp-single-accent-foreground);
}

.sblp-featured-media--review .sblp-featured-media__image {
	border: 0;
	border-radius: 0;
	box-shadow: none;
	min-height: 460px;
}

.sblp-featured-media--review figcaption {
	background: var(--sblp-design-content-bg, var(--sblp-surface));
	color: var(--sblp-design-muted, var(--sblp-muted));
}

.sblp-review-summary {
	background: var(--sblp-soft);
	border-color: var(--sblp-line);
	border-radius: var(--sblp-radius-md);
	gap: 16px;
	max-width: min(940px, 100%);
}

.sblp-review-summary span {
	background: var(--sblp-accent-soft);
	color: var(--sblp-single-accent-foreground);
}

.sblp-review-summary p {
	color: var(--sblp-ink);
}

.sblp-prose--review h2 {
	border-bottom: 1px solid var(--sblp-line);
	padding-bottom: 0.38em;
}

/* Case: measurable sequence on a neutral surface. */
.sblp-case-hero {
	background: var(--sblp-design-hero-bg, var(--sblp-surface-soft));
	color: var(--sblp-design-hero-text, var(--sblp-ink));
	left: auto;
	margin-left: 0;
	padding: clamp(34px, 7vw, 80px) 0;
	width: 100%;
}

.sblp-case-hero__inner {
	gap: clamp(30px, 6vw, 72px);
	grid-template-columns: minmax(0, 1fr) minmax(250px, 350px);
}

.sblp-case-hero .sblp-layout-kicker,
.sblp-case-hero .sblp-post-title,
.sblp-case-hero .sblp-post-lead,
.sblp-case-hero .sblp-post-meta {
	color: inherit;
}

.sblp-case-hero .sblp-category-chip {
	background: var(--sblp-surface);
	border-color: var(--sblp-line);
	color: var(--sblp-single-accent-foreground);
}

.sblp-case-flow {
	background: var(--sblp-surface);
	border-color: var(--sblp-line);
	border-radius: var(--sblp-radius-md);
	color: var(--sblp-ink);
	counter-reset: none;
	gap: 0;
	list-style: none;
	margin: 0;
	padding: 8px 18px;
}

.sblp-case-flow li {
	align-items: center;
	display: flex;
	font-size: 0.9rem;
	font-weight: 650;
	gap: 12px;
	margin: 0;
	padding: 12px 0;
	position: relative;
}

.sblp-case-flow li + li {
	border-top: 1px solid var(--sblp-line);
}

.sblp-case-flow li + li::before {
	color: var(--sblp-accent);
	content: "↓";
	font-size: 0.78rem;
	left: 10px;
	position: absolute;
	top: -9px;
}

.sblp-case-flow b {
	background: var(--sblp-accent-soft);
	color: var(--sblp-single-accent-foreground);
	flex: 0 0 34px;
}

.sblp-case-content {
	margin-top: clamp(26px, 5vw, 50px);
}

.sblp-featured-media--case .sblp-featured-media__image {
	border: 1px solid var(--sblp-line);
}

.sblp-case-content > .sblp-reading-layout:first-child {
	background: transparent;
	border: 0;
	border-radius: 0;
	box-shadow: none;
	padding: 0;
}

.sblp-prose--case h2::after,
.sblp-prose--comparison h2::after {
	background: var(--sblp-accent);
	height: 3px;
	width: 48px;
}

/* Interview: balanced split hero and recognisable Q/A rhythm. */
.sblp-interview-hero {
	background: var(--sblp-design-hero-bg, var(--sblp-surface));
	border-color: var(--sblp-line);
	grid-template-columns: minmax(0, 1fr) minmax(280px, 0.82fr);
	min-height: 440px;
}

.sblp-interview-hero__copy {
	padding: clamp(30px, 6vw, 68px);
}

.sblp-interview-hero__media,
.sblp-featured-media--interview {
	min-height: 440px;
}

.sblp-featured-media--interview .sblp-featured-media__image {
	border: 0;
	border-radius: 0;
	box-shadow: none;
	height: 100%;
	min-height: 440px;
}

.sblp-interview-hero__quote {
	background: var(--sblp-surface);
	border: 1px solid var(--sblp-line);
	color: var(--sblp-accent);
	font-size: 2.6rem;
	height: 64px;
	width: 64px;
}

.sblp-interview-format {
	background: var(--sblp-soft);
	border-color: var(--sblp-line);
	border-radius: var(--sblp-radius-md);
	box-shadow: none;
}

.sblp-interview-format__mark {
	background: var(--sblp-accent-soft);
	color: var(--sblp-single-accent-foreground);
}

.sblp-prose--interview > h2::before {
	background: var(--sblp-accent-soft);
	color: var(--sblp-single-accent-foreground);
}

/* Opinion: deliberately narrow editorial column with a quiet signature. */
.sblp-layout__shell--opinion {
	max-width: 980px;
}

.sblp-opinion-hero {
	background: var(--sblp-design-hero-bg, var(--sblp-surface));
	border-color: var(--sblp-line);
	box-shadow: none;
	grid-template-columns: minmax(64px, 92px) minmax(0, 1fr);
}

.sblp-opinion-hero__label {
	background: var(--sblp-accent-soft);
	color: var(--sblp-single-accent-foreground);
	font-size: 0.72rem;
	letter-spacing: 0.12em;
}

.sblp-opinion-hero__body {
	padding: clamp(30px, 6vw, 70px);
}

.sblp-opinion-hero .sblp-post-title {
	max-width: 15ch;
}

.sblp-opinion-byline {
	border-top: 1px solid var(--sblp-line);
	margin-top: clamp(24px, 4vw, 36px);
	padding-top: 20px;
}

.sblp-opinion-byline__avatar,
.sblp-opinion-byline__avatar img {
	height: 52px;
	width: 52px;
}

.sblp-opinion-reading {
	max-width: var(--sblp-content-width);
}

.sblp-prose--opinion blockquote::before {
	color: var(--sblp-accent);
	opacity: 0.45;
}

/* Listicle: compact count marker and strong scanning rhythm. */
.sblp-listicle-hero {
	background: var(--sblp-design-hero-bg, var(--sblp-surface));
	border-color: var(--sblp-line);
	gap: clamp(24px, 5vw, 54px);
	grid-template-columns: auto minmax(0, 1fr);
	padding: clamp(28px, 5vw, 62px);
}

.sblp-listicle-hero__count {
	background: var(--sblp-accent-soft);
	border: 1px solid var(--sblp-line);
	border-radius: var(--sblp-radius-md);
	color: var(--sblp-single-accent-foreground);
	height: clamp(96px, 12vw, 132px);
	width: clamp(96px, 12vw, 132px);
}

.sblp-listicle-hero__count span {
	font-size: clamp(2rem, 4vw, 3rem);
}

.sblp-prose--listicle {
	counter-reset: sblp-list-item;
}

.sblp-prose--listicle > h2 {
	align-items: flex-start;
	display: grid;
	gap: 14px;
	grid-template-columns: 42px minmax(0, 1fr);
}

.sblp-prose--listicle > h2::before {
	align-items: center;
	background: var(--sblp-accent-soft);
	border: 1px solid var(--sblp-line);
	border-radius: var(--sblp-radius-sm);
	color: var(--sblp-single-accent-foreground);
	display: inline-flex;
	height: 40px;
	justify-content: center;
	position: static;
	width: 40px;
}

.sblp-prose--listicle > h2 + p,
.sblp-prose--listicle > h2 + figure,
.sblp-prose--listicle > h2 + .wp-block-image {
	border-inline-start: 1px solid var(--sblp-line);
	margin-inline-start: 20px;
	padding-inline-start: 34px;
}

/* FAQ: calm information surface and large native disclosure targets. */
.sblp-faq-hero {
	background: var(--sblp-design-hero-bg, var(--sblp-surface-soft));
	border-color: var(--sblp-line);
	box-shadow: none;
	padding: clamp(34px, 7vw, 80px) 0;
}

.sblp-faq-hero__inner {
	gap: clamp(28px, 6vw, 68px);
	grid-template-columns: minmax(0, 1fr) auto;
}

.sblp-faq-hero__symbol {
	background: var(--sblp-surface);
	border: 1px solid var(--sblp-line);
	border-radius: var(--sblp-radius-lg);
	color: var(--sblp-single-accent-foreground);
	height: clamp(92px, 12vw, 132px);
	width: clamp(92px, 12vw, 132px);
}

.sblp-faq-hero__symbol > span {
	font-size: clamp(2.7rem, 5vw, 4.3rem);
}

.sblp-faq-content {
	margin-top: clamp(28px, 5vw, 52px);
}

.sblp-faq-instruction {
	background: transparent;
	border: 0;
	color: var(--sblp-muted);
	font-size: 0.88rem;
	padding: 0;
}

.sblp-faq__item,
.sblp-prose--faq details {
	background: var(--sblp-surface);
	border-color: var(--sblp-line);
	border-radius: var(--sblp-radius-md);
	box-shadow: none;
}

.sblp-faq__item > summary,
.sblp-prose--faq details > summary {
	min-height: 56px;
	padding: 15px 18px;
}

/* Comparison: paired neutral cards and scroll-safe data tables. */
.sblp-comparison-hero {
	background: var(--sblp-design-hero-bg, var(--sblp-surface));
	border-color: var(--sblp-line);
	gap: clamp(28px, 6vw, 68px);
	grid-template-columns: minmax(0, 1fr) minmax(230px, 330px);
	padding: clamp(30px, 6vw, 68px);
}

.sblp-comparison-hero__visual {
	background: var(--sblp-soft);
	border: 1px solid var(--sblp-line);
	border-radius: var(--sblp-radius-md);
	gap: 10px;
	padding: 14px;
}

.sblp-comparison-hero__visual span {
	background: var(--sblp-surface);
	border-color: var(--sblp-line);
	border-radius: var(--sblp-radius-sm);
	box-shadow: none;
	color: var(--sblp-ink);
	min-height: 82px;
}

.sblp-comparison-hero__visual b {
	background: var(--sblp-accent-soft);
	color: var(--sblp-single-accent-foreground);
}

.sblp-comparison-hero__visual i {
	background: transparent;
	border-radius: 0;
	color: var(--sblp-muted);
	font-size: 0.72rem;
	height: auto;
	width: auto;
}

.sblp-comparison-hint {
	color: var(--sblp-muted);
	font-size: 0.84rem;
}

/* Announcement: restrained launch card with a compact badge. */
.sblp-announcement-hero {
	background: var(--sblp-design-hero-bg, var(--sblp-surface));
	border-color: var(--sblp-line);
	box-shadow: var(--sblp-shadow);
	color: var(--sblp-design-hero-text, var(--sblp-ink));
	left: auto;
	margin-left: 0;
	padding: 0;
	width: 100%;
}

.sblp-announcement-hero__noise {
	display: none;
}

.sblp-announcement-hero__inner {
	gap: clamp(28px, 6vw, 68px);
	grid-template-columns: minmax(0, 1fr) minmax(280px, 0.8fr);
	padding: clamp(30px, 6vw, 70px);
}

.sblp-announcement-badge {
	background: var(--sblp-design-badge-bg, var(--sblp-accent-soft));
	border-color: var(--sblp-design-badge-border, var(--sblp-line));
	color: var(--sblp-design-badge-text, var(--sblp-single-accent-foreground));
}

.sblp-announcement-badge i {
	background: currentColor;
	height: 6px;
	width: 6px;
}

.sblp-announcement-hero .sblp-post-title,
.sblp-announcement-hero .sblp-post-lead,
.sblp-announcement-hero .sblp-post-meta {
	color: inherit;
}

.sblp-announcement-hero .sblp-category-chip {
	background: var(--sblp-soft);
	border-color: var(--sblp-line);
	color: var(--sblp-single-accent-foreground);
}

.sblp-announcement-hero__media {
	transform: none;
}

.sblp-featured-media--announcement .sblp-featured-media__image {
	border: 1px solid var(--sblp-line);
	border-radius: var(--sblp-radius-md);
	box-shadow: none;
}

.sblp-featured-media--announcement figcaption {
	color: var(--sblp-muted);
}

.sblp-announcement-content {
	margin-top: clamp(32px, 6vw, 66px);
}

/* Evergreen: durable reference layout with a quiet update cue. */
.sblp-evergreen-hero {
	background: var(--sblp-design-hero-bg, var(--sblp-surface-soft));
	border-color: var(--sblp-line);
	box-shadow: none;
	gap: clamp(28px, 6vw, 68px);
	grid-template-columns: minmax(0, 1fr) auto;
	padding: clamp(30px, 6vw, 70px);
}

.sblp-evergreen-hero__mark {
	align-items: center;
	background: var(--sblp-surface);
	border: 1px solid var(--sblp-line);
	border-radius: var(--sblp-radius-md);
	display: grid;
	gap: 8px;
	height: clamp(92px, 12vw, 132px);
	justify-content: stretch;
	padding: 20px;
	width: clamp(92px, 12vw, 132px);
}

.sblp-evergreen-hero__mark span,
.sblp-evergreen-hero__mark span:nth-child(1),
.sblp-evergreen-hero__mark span:nth-child(2),
.sblp-evergreen-hero__mark span:nth-child(3) {
	background: var(--sblp-accent);
	border-radius: 999px;
	box-shadow: none;
	display: block;
	height: 4px;
	opacity: 0.55;
	width: 100%;
}

.sblp-evergreen-meta {
	gap: 8px 14px;
}

.sblp-evergreen-meta span {
	background: var(--sblp-surface);
	border: 1px solid var(--sblp-line);
	border-radius: var(--sblp-radius-sm);
	color: var(--sblp-muted);
	padding: 7px 10px;
}

.sblp-evergreen-meta i {
	color: var(--sblp-single-accent-foreground);
}

.sblp-prose--evergreen dl {
	background: var(--sblp-soft);
	border-color: var(--sblp-line);
	border-radius: var(--sblp-radius-md);
}

.sblp-prose--evergreen dt {
	color: var(--sblp-heading, var(--sblp-ink));
}

.sblp-prose--evergreen dd {
	color: var(--sblp-muted);
}

/* Shared article components: restrained surfaces, readable forms and 44px controls. */
body.sblp-layout-active .sblp-prose,
body.sblp-layout-active .sblp-prose a,
body.sblp-layout-active .sblp-post-title,
body.sblp-layout-active .sblp-post-lead {
	overflow-wrap: anywhere;
}

body.sblp-layout-active .sblp-category-chip,
body.sblp-layout-active .sblp-page-links a,
body.sblp-layout-active .sblp-page-links > span:not(:first-child),
body.sblp-layout-active .sblp-tag-list a,
body.sblp-layout-active .sblp-related-post__more,
body.sblp-layout-active .sblp-editorial-trust__links a,
body.sblp-layout-active .sblp-subscribe-block__button,
body.sblp-layout-active .sblp-comments__join,
body.sblp-layout-active .sblp-comments-navigation a,
body.sblp-layout-active .sblp-comment-form__cancel a {
	align-items: center;
	display: inline-flex;
	justify-content: center;
	min-height: max(44px, var(--sblp-geometry-control-height, 44px));
}

body.sblp-layout-active .sblp-component-heading,
body.sblp-layout-active .sblp-key-points__title,
body.sblp-layout-active .sblp-note__title,
body.sblp-layout-active .sblp-sources__title,
body.sblp-layout-active .sblp-reading-summary__title {
	color: var(--sblp-single-heading);
	font-family: var(--sblp-font-h2, inherit);
	font-weight: var(--sblp-type-heading-weight, 740);
	letter-spacing: var(--sblp-type-heading-spacing, -0.025em);
	line-height: 1.24;
	text-wrap: balance;
}

body.sblp-layout-active :where(.sblp-key-points, .sblp-note, .sblp-sources, .sblp-reading-summary) {
	background: var(--sblp-single-elevated);
	border: 1px solid var(--sblp-single-border);
	border-radius: var(--sblp-geometry-radius-card, 18px);
	box-shadow: none;
	color: var(--sblp-single-text);
	margin-block: 50px;
	max-width: 100%;
	overflow: hidden;
	padding: clamp(20px, 3.8vw, 30px);
}

body.sblp-layout-active :where(.sblp-key-points__header, .sblp-note__header, .sblp-sources__heading, .sblp-reading-summary__header) {
	align-items: center;
	display: flex;
	gap: 12px;
	margin-bottom: 16px;
}

body.sblp-layout-active :where(.sblp-key-points__badge, .sblp-note__badge, .sblp-sources__badge, .sblp-reading-summary__badge) {
	align-items: center;
	background: var(--sblp-single-accent-soft);
	border: 1px solid var(--sblp-single-border);
	border-radius: var(--sblp-geometry-radius-button, 10px);
	color: var(--sblp-single-accent-foreground);
	display: inline-flex;
	flex: 0 0 38px;
	height: 38px;
	justify-content: center;
	width: 38px;
}

body.sblp-layout-active :where(.sblp-key-points__body, .sblp-note__body, .sblp-sources__list, .sblp-reading-summary__body) {
	color: var(--sblp-single-text);
	line-height: 1.7;
}

body.sblp-layout-active :where(.sblp-key-points__body, .sblp-note__body, .sblp-reading-summary__body) > :first-child {
	margin-top: 0;
}

body.sblp-layout-active :where(.sblp-key-points__body, .sblp-note__body, .sblp-reading-summary__body) > :last-child {
	margin-bottom: 0;
}

body.sblp-layout-active .sblp-key-points,
body.sblp-layout-active .sblp-reading-summary {
	background: var(--sblp-design-info-bg, var(--sblp-single-soft));
	border-inline-start: 3px solid var(--sblp-single-accent);
}

body.sblp-layout-active .sblp-note {
	--sblp-note-bg: var(--sblp-design-info-bg, var(--sblp-single-soft));
	--sblp-note-text: var(--sblp-design-info-text, var(--sblp-single-text));
	background: var(--sblp-note-bg);
	border-inline-start: 3px solid var(--sblp-single-accent);
	color: var(--sblp-note-text);
}

body.sblp-layout-active .sblp-note--warning,
body.sblp-layout-active .sblp-note--important {
	--sblp-note-bg: var(--sblp-design-warning-bg, var(--sblp-single-soft));
	--sblp-note-text: var(--sblp-design-warning-text, var(--sblp-single-text));
}

body.sblp-layout-active .sblp-note--tip,
body.sblp-layout-active .sblp-note--conclusion {
	--sblp-note-bg: var(--sblp-design-success-bg, var(--sblp-single-soft));
	--sblp-note-text: var(--sblp-design-success-text, var(--sblp-single-text));
}

body.sblp-layout-active .sblp-note :where(.sblp-note__title, .sblp-note__body) {
	color: var(--sblp-note-text);
}

body.sblp-layout-active .sblp-sources {
	background: var(--sblp-single-soft);
}

body.sblp-layout-active .sblp-sources__list {
	display: grid;
	gap: 10px;
}

body.sblp-layout-active .sblp-source {
	align-items: center;
	background: var(--sblp-single-surface);
	border: 1px solid var(--sblp-single-border);
	border-radius: var(--sblp-geometry-radius-button, 10px);
	color: var(--sblp-design-link, var(--sblp-single-accent-foreground));
	display: grid;
	gap: 10px;
	grid-template-columns: 30px minmax(0, 1fr);
	min-height: 48px;
	padding: 9px 12px;
	text-decoration: none;
}

body.sblp-layout-active .sblp-source:hover {
	background: var(--sblp-single-accent-soft);
	border-color: var(--sblp-single-accent);
	color: var(--sblp-single-accent-foreground);
	transform: none;
}

body.sblp-layout-active .sblp-source__marker {
	align-items: center;
	background: var(--sblp-single-accent-soft);
	border-radius: 50%;
	color: var(--sblp-single-accent-foreground);
	display: inline-flex;
	height: 28px;
	justify-content: center;
	width: 28px;
}

body.sblp-layout-active .sblp-verified {
	align-items: center;
	background: var(--sblp-design-success-bg, var(--sblp-single-soft));
	border: 1px solid var(--sblp-single-border);
	border-radius: 999px;
	color: var(--sblp-design-success-text, var(--sblp-single-text));
	display: inline-flex;
	font-size: 0.84rem;
	font-weight: 680;
	gap: 8px;
	line-height: 1.35;
	max-width: 100%;
	min-height: 36px;
	padding: 7px 11px;
}

body.sblp-layout-active .sblp-verified__icon {
	align-items: center;
	background: var(--sblp-single-surface);
	border-radius: 50%;
	color: var(--sblp-single-accent-foreground);
	display: inline-flex;
	flex: 0 0 22px;
	height: 22px;
	justify-content: center;
	width: 22px;
}

body.sblp-layout-active .sblp-pros-cons__grid,
body.sblp-layout-active .wp-block-columns.sblp-pros-cons {
	gap: var(--sblp-geometry-card-gap, 18px);
}

body.sblp-layout-active .sblp-pros-cons__panel,
body.sblp-layout-active .wp-block-columns.sblp-pros-cons > .wp-block-column {
	background: var(--sblp-single-elevated);
	border-color: var(--sblp-single-border);
	border-radius: var(--sblp-geometry-radius-card, 18px);
	box-shadow: none;
	color: var(--sblp-single-text);
}

body.sblp-layout-active .sblp-pros-cons__panel--pros,
body.sblp-layout-active .sblp-pros-cons__panel--cons {
	background-image: none;
}

body.sblp-layout-active .sblp-pros-cons__panel--pros {
	border-block-start: 3px solid var(--sblp-single-accent);
}

body.sblp-layout-active .sblp-pros-cons__panel--cons {
	border-block-start: 3px solid var(--sblp-design-warning-text, var(--sblp-single-muted));
}

body.sblp-layout-active .sblp-pros-cons__panel :where(h3, li) {
	color: var(--sblp-single-text);
}

body.sblp-layout-active :where(.sblp-comparison__scroll, figure.wp-block-table.sblp-comparison) {
	background: var(--sblp-single-surface);
	border-color: var(--sblp-design-table-border, var(--sblp-single-border));
	border-radius: var(--sblp-geometry-radius-card, 18px);
	box-shadow: none;
}

body.sblp-layout-active :where(.sblp-comparison, .sblp-prose--comparison) thead th {
	background: var(--sblp-design-table-head-bg, var(--sblp-single-accent-soft));
	color: var(--sblp-design-table-head-text, var(--sblp-single-text));
}

body.sblp-layout-active :where(.sblp-comparison, .sblp-prose--comparison) tbody tr:nth-child(even) td {
	background: var(--sblp-design-table-alt-bg, var(--sblp-single-soft));
}

body.sblp-layout-active .sblp-cta {
	background: var(--sblp-design-cta-bg, var(--sblp-single-accent-soft));
	background-image: none;
	border: 1px solid var(--sblp-single-border);
	border-radius: var(--sblp-geometry-radius-card, 20px);
	box-shadow: none;
	color: var(--sblp-design-cta-text, var(--sblp-single-text));
}

body.sblp-layout-active .sblp-cta :where(.sblp-cta__copy, .sblp-cta__text, .sblp-component-heading) {
	color: var(--sblp-design-cta-text, var(--sblp-single-text));
}

body.sblp-layout-active .sblp-cta__button {
	background: var(--sblp-design-cta-button-bg, var(--sblp-single-accent-strong));
	border: 1px solid transparent;
	border-radius: var(--sblp-geometry-radius-button, 10px);
	color: var(--sblp-design-cta-button-text, var(--sblp-single-on-accent));
	min-height: max(44px, var(--sblp-geometry-control-height, 44px));
}

body.sblp-layout-active .sblp-cta__button:hover {
	box-shadow: none;
	filter: brightness(0.95);
	transform: none;
}

body.sblp-layout-active .sblp-embedded-cta {
	--sblp-cta-bg: var(--sblp-design-cta-bg, var(--sblp-single-soft));
	--sblp-cta-border: var(--sblp-single-border);
	--sblp-cta-copy: var(--sblp-design-cta-text, var(--sblp-single-text));
	--sblp-cta-muted: var(--sblp-single-muted);
	--sblp-cta-action: var(--sblp-design-cta-button-bg, var(--sblp-single-accent-strong));
	background: var(--sblp-cta-bg);
	background-image: none;
	border-color: var(--sblp-cta-border);
	border-radius: var(--sblp-geometry-radius-card, 20px);
	box-shadow: none;
}

body.sblp-layout-active .sblp-embedded-cta::before {
	display: none;
}

body.sblp-layout-active .sblp-embedded-cta :where(.sblp-embedded-cta__title, .sblp-embedded-cta__text, label) {
	color: var(--sblp-cta-copy);
}

body.sblp-layout-active .sblp-embedded-cta__text {
	opacity: 1;
}

body.sblp-layout-active .sblp-embedded-cta__content :where(input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="button"]):not([type="hidden"]), textarea, select) {
	background: var(--sblp-design-input-bg, var(--sblp-single-surface));
	border-color: var(--sblp-design-input-border, var(--sblp-single-border));
	border-radius: var(--sblp-geometry-radius-button, 10px);
	color: var(--sblp-design-input-text, var(--sblp-single-text));
	min-height: max(44px, var(--sblp-geometry-control-height, 44px));
}

body.sblp-layout-active .sblp-embedded-cta--button .sblp-embedded-cta__content :where(a, button),
body.sblp-layout-active .sblp-embedded-cta__content :where(input[type="submit"], button[type="submit"]) {
	background: var(--sblp-design-cta-button-bg, var(--sblp-single-accent-strong));
	border-radius: var(--sblp-geometry-radius-button, 10px);
	color: var(--sblp-design-cta-button-text, var(--sblp-single-on-accent));
	min-height: max(44px, var(--sblp-geometry-control-height, 44px));
}

body.sblp-layout-active .sblp-page-links,
body.sblp-layout-active .sblp-tag-list {
	gap: 8px;
}

body.sblp-layout-active .sblp-page-links a,
body.sblp-layout-active .sblp-page-links > span:not(:first-child),
body.sblp-layout-active .sblp-tag-list a {
	background: var(--sblp-single-surface);
	border: 1px solid var(--sblp-single-border);
	border-radius: var(--sblp-geometry-radius-button, 10px);
	color: var(--sblp-design-link, var(--sblp-single-accent-foreground));
	padding: 8px 12px;
	text-decoration: none;
}

body.sblp-layout-active .sblp-page-links a:hover,
body.sblp-layout-active .sblp-tag-list a:hover {
	background: var(--sblp-single-accent-soft);
	border-color: var(--sblp-single-accent);
	color: var(--sblp-single-accent-foreground);
}

body.sblp-layout-active .sblp-author-card {
	background: var(--sblp-design-author-bg, var(--sblp-single-elevated));
	color: var(--sblp-design-author-text, var(--sblp-single-text));
}

body.sblp-layout-active .sblp-author-card :where(.sblp-author-card__name, .sblp-author-card__heading) {
	color: var(--sblp-design-author-text, var(--sblp-single-text));
}

body.sblp-layout-active .sblp-author-card :where(.sblp-author-card__bio, .sblp-author-card__role, .sblp-author-card__updated) {
	color: var(--sblp-design-author-muted, var(--sblp-single-muted));
}

body.sblp-layout-active .sblp-related-post {
	background: var(--sblp-design-related-bg, var(--sblp-single-elevated));
	color: var(--sblp-design-related-text, var(--sblp-single-text));
}

body.sblp-layout-active .sblp-related-post :where(h3, h3 a, .sblp-related-post__body) {
	color: var(--sblp-design-related-text, var(--sblp-single-text));
}

body.sblp-layout-active .sblp-related-post__body > p,
body.sblp-layout-active .sblp-related-post__meta {
	color: var(--sblp-single-muted);
}

body.sblp-layout-active .sblp-editorial-trust {
	background: var(--sblp-design-trust-bg, var(--sblp-single-soft));
	background-image: none;
	border: 1px solid var(--sblp-single-border);
	border-inline-start: 3px solid var(--sblp-single-accent);
	border-radius: var(--sblp-geometry-radius-card, 18px);
	box-shadow: none;
	color: var(--sblp-design-trust-text, var(--sblp-single-text));
}

body.sblp-layout-active .sblp-editorial-trust :where(h2, h3, p) {
	color: var(--sblp-design-trust-text, var(--sblp-single-text));
}

body.sblp-layout-active .sblp-editorial-trust__item {
	background: var(--sblp-single-surface);
	border-color: var(--sblp-single-border);
	border-radius: var(--sblp-geometry-radius-button, 10px);
}

body.sblp-layout-active .sblp-editorial-trust__badge,
body.sblp-layout-active .sblp-editorial-trust__item-icon {
	background: var(--sblp-single-accent-soft);
	border-color: var(--sblp-single-border);
	color: var(--sblp-single-accent-foreground);
}

body.sblp-layout-active .sblp-editorial-trust__links a {
	background: var(--sblp-single-surface);
	border-color: var(--sblp-single-border);
	border-radius: var(--sblp-geometry-radius-button, 10px);
	color: var(--sblp-design-link, var(--sblp-single-accent-foreground));
}

body.sblp-layout-active .sblp-subscribe-block {
	background: var(--sblp-design-subscribe-bg, var(--sblp-single-soft));
	border: 1px solid var(--sblp-single-border);
	border-radius: var(--sblp-geometry-radius-card, 18px);
	box-shadow: none;
	color: var(--sblp-design-subscribe-text, var(--sblp-single-text));
}

body.sblp-layout-active .sblp-subscribe-block :where(h2, p, .sblp-subscribe-block__eyebrow) {
	color: var(--sblp-design-subscribe-text, var(--sblp-single-text));
}

body.sblp-layout-active .sblp-subscribe-block__button,
body.sblp-layout-active .sblp-subscribe-block__form :where(button, input[type="submit"]) {
	background: var(--sblp-design-button-bg, var(--sblp-single-accent-strong));
	border-color: transparent;
	border-radius: var(--sblp-geometry-radius-button, 10px);
	color: var(--sblp-design-button-text, var(--sblp-single-on-accent));
}

body.sblp-layout-active .sblp-subscribe-block__button--secondary {
	background: var(--sblp-single-surface);
	border-color: var(--sblp-single-border);
	color: var(--sblp-design-link, var(--sblp-single-accent-foreground));
}

body.sblp-layout-active .sblp-subscribe-block__form :where(input, select, textarea) {
	background: var(--sblp-design-input-bg, var(--sblp-single-surface));
	border-color: var(--sblp-design-input-border, var(--sblp-single-border));
	border-radius: var(--sblp-geometry-radius-button, 10px);
	color: var(--sblp-design-input-text, var(--sblp-single-text));
	min-height: max(44px, var(--sblp-geometry-control-height, 44px));
}

/* Native comments remain theme-compatible but use the same article tokens. */
body.sblp-layout-active .sblp-comments-shell {
	background: var(--sblp-design-comments-bg, var(--sblp-single-elevated));
	border: 1px solid var(--sblp-single-border);
	border-radius: var(--sblp-geometry-radius-card, 20px);
	box-shadow: none;
	color: var(--sblp-design-comments-text, var(--sblp-single-text));
	margin: clamp(42px, 7vw, 84px) auto;
	max-width: min(calc(100% - clamp(24px, 5vw, 64px)), var(--sblp-geometry-wide-width, 1240px));
	padding: clamp(20px, 4vw, 38px);
}

body.sblp-layout-active .sblp-comments__header {
	align-items: center;
	border-bottom: 1px solid var(--sblp-single-border);
	gap: 18px;
	padding-bottom: 20px;
}

body.sblp-layout-active .sblp-comments__title {
	font-size: clamp(1.35rem, 1.7vw, 1.9rem);
	letter-spacing: -0.012em;
	line-height: 1.2;
}

body.sblp-layout-active .sblp-comments__form-title {
	font-size: clamp(1.2rem, 1.3vw, 1.55rem);
	letter-spacing: -0.008em;
	line-height: 1.25;
}

body.sblp-layout-active .sblp-comments :where(.sblp-comments__title, .sblp-comments__form-title, .comment-author .fn, .comment-author .fn a) {
	color: var(--sblp-design-comments-text, var(--sblp-single-text));
}

body.sblp-layout-active .sblp-comments :where(.sblp-comments__eyebrow, .sblp-comments__empty, .sblp-comments__closed, .sblp-comment-form__notes, .sblp-comment-form__logged-in, .sblp-comment-form__must-log-in, .comment-metadata, .comment-awaiting-moderation) {
	color: var(--sblp-design-comments-muted, var(--sblp-single-muted));
}

body.sblp-layout-active .sblp-comments__join,
body.sblp-layout-active .sblp-comments-navigation a,
body.sblp-layout-active .sblp-comment-form__cancel a {
	background: var(--sblp-single-surface);
	border: 1px solid var(--sblp-single-border);
	border-radius: var(--sblp-geometry-radius-button, 10px);
	color: var(--sblp-design-link, var(--sblp-single-accent-foreground));
	padding: 8px 12px;
	text-decoration: none;
}

body.sblp-layout-active .sblp-comment-list,
body.sblp-layout-active .sblp-comment-list .children {
	list-style: none;
	margin-inline: 0;
	max-width: 100%;
	padding-inline-start: 0;
}

body.sblp-layout-active .sblp-comment-list .children {
	border-inline-start: 1px solid var(--sblp-single-border);
	margin-inline-start: clamp(8px, 3vw, 28px);
	padding-inline-start: clamp(10px, 3vw, 24px);
}

body.sblp-layout-active .sblp-comment-list .comment-body {
	background: var(--sblp-single-surface);
	border: 1px solid var(--sblp-single-border);
	border-radius: var(--sblp-geometry-radius-button, 12px);
	color: var(--sblp-design-comments-text, var(--sblp-single-text));
	margin-block: 14px;
	max-width: 100%;
	overflow-wrap: anywhere;
	padding: clamp(16px, 3vw, 24px);
}

body.sblp-layout-active .sblp-comment-list .avatar {
	border-radius: 50%;
	height: 48px;
	width: 48px;
}

body.sblp-layout-active .sblp-comment-list .reply a {
	align-items: center;
	color: var(--sblp-design-link, var(--sblp-single-accent-foreground));
	display: inline-flex;
	font-weight: 680;
	min-height: 44px;
}

body.sblp-layout-active .sblp-comment-respond {
	background: var(--sblp-design-form-bg, var(--sblp-single-soft));
	border: 1px solid var(--sblp-single-border);
	border-radius: var(--sblp-geometry-radius-card, 18px);
	margin-top: clamp(28px, 5vw, 48px);
	padding: clamp(18px, 4vw, 30px);
}

body.sblp-layout-active .sblp-comment-form {
	display: grid;
	gap: 16px;
	grid-template-columns: repeat(2, minmax(0, 1fr));
}

body.sblp-layout-active .sblp-comment-form__field,
body.sblp-layout-active .sblp-comment-form :where(.comment-form-cookies-consent, .form-submit, .sblp-comment-form__notes, .sblp-comment-form__logged-in, .sblp-comment-form__must-log-in) {
	margin: 0;
}

body.sblp-layout-active .sblp-comment-form__field--comment,
body.sblp-layout-active .sblp-comment-form :where(.comment-form-cookies-consent, .form-submit, .sblp-comment-form__notes, .sblp-comment-form__logged-in, .sblp-comment-form__must-log-in) {
	grid-column: 1 / -1;
}

body.sblp-layout-active .sblp-comment-form label {
	color: var(--sblp-design-form-text, var(--sblp-single-text));
	font-weight: 680;
}

body.sblp-layout-active .sblp-comment-form :where(input:not([type="checkbox"]):not([type="radio"]), textarea, select) {
	background: var(--sblp-design-input-bg, var(--sblp-single-surface));
	border: 1px solid var(--sblp-design-input-border, var(--sblp-single-border));
	border-radius: var(--sblp-geometry-radius-button, 10px);
	color: var(--sblp-design-input-text, var(--sblp-single-text));
	font: inherit;
	max-width: 100%;
	min-height: max(44px, var(--sblp-geometry-control-height, 44px));
	padding: 10px 12px;
	width: 100%;
}

body.sblp-layout-active .sblp-comment-form textarea {
	min-height: 160px;
	resize: vertical;
}

body.sblp-layout-active .sblp-comment-form__submit {
	background: var(--sblp-design-button-bg, var(--sblp-single-accent-strong));
	border: 1px solid transparent;
	border-radius: var(--sblp-geometry-radius-button, 10px);
	color: var(--sblp-design-button-text, var(--sblp-single-on-accent));
	cursor: pointer;
	font: inherit;
	font-weight: 720;
	min-height: max(44px, var(--sblp-geometry-control-height, 44px));
	padding: 10px 18px;
}

/* Shared responsive behavior for all layouts. */
@media (max-width: 980px) {
	.sblp-reading-layout--with-toc,
	.sblp-guide-grid--with-toc {
		grid-template-columns: minmax(0, var(--sblp-content-width));
	}

	.sblp-expert-hero__inner,
	.sblp-case-hero__inner,
	.sblp-faq-hero__inner,
	.sblp-evergreen-hero,
	.sblp-comparison-hero {
		grid-template-columns: minmax(0, 1fr);
	}

	.sblp-expert-hero__author {
		justify-self: start;
	}

	.sblp-case-flow {
		max-width: 720px;
	}

	.sblp-review-hero,
	.sblp-interview-hero,
	.sblp-announcement-hero__inner {
		grid-template-columns: minmax(0, 1fr);
	}

	.sblp-review-hero__media,
	.sblp-featured-media--review,
	.sblp-interview-hero__media,
	.sblp-featured-media--interview {
		max-height: 460px;
		min-height: 320px;
	}

	.sblp-featured-media--review .sblp-featured-media__image,
	.sblp-featured-media--interview .sblp-featured-media__image {
		min-height: 320px;
	}

	.sblp-comparison-hero__visual {
		max-width: 520px;
	}

	.sblp-toc {
		position: relative;
		top: auto;
	}
}

@media (max-width: 720px) {
	.sblp-site-main {
		padding-block: clamp(20px, 6vw, 42px);
	}

	.sblp-layout__shell {
		width: min(calc(100% - 28px), var(--sblp-wide-width));
	}

	.sblp-layout-hero,
	.sblp-default-hero,
	.sblp-guide-hero,
	.sblp-listicle-hero,
	.sblp-comparison-hero,
	.sblp-evergreen-hero {
		border-radius: min(var(--sblp-radius-lg), 20px);
	}

	.sblp-post-title,
	.sblp-news-hero .sblp-post-title {
		font-size: clamp(2rem, 8.7vw, 3.3rem);
		letter-spacing: -0.04em;
		line-height: 1.06;
		max-width: none;
	}

	.sblp-post-lead {
		font-size: clamp(1.02rem, 2.6vw + 0.6rem, 1.22rem);
	}

	.sblp-guide-hero,
	.sblp-listicle-hero {
		align-items: start;
		grid-template-columns: minmax(0, 1fr);
	}

	.sblp-guide-hero__badge,
	.sblp-listicle-hero__count {
		height: 76px;
		width: 76px;
	}

	.sblp-opinion-hero {
		grid-template-columns: minmax(0, 1fr);
	}

	.sblp-opinion-hero__label {
		align-items: center;
		display: flex;
		justify-content: flex-start;
		min-height: 38px;
		padding-inline: 20px;
		writing-mode: horizontal-tb;
	}

	.sblp-opinion-hero__body {
		padding: 24px 20px 30px;
	}

	.sblp-faq-hero__symbol,
	.sblp-evergreen-hero__mark {
		height: 80px;
		width: 80px;
	}

	.sblp-comparison-hero__visual {
		grid-template-columns: minmax(0, 1fr);
	}

	.sblp-comparison-hero__visual i {
		padding: 2px 0;
	}

	.sblp-review-summary,
	.sblp-interview-format {
		grid-template-columns: minmax(0, 1fr);
	}

	.sblp-prose {
		font-size: 1.03rem;
		line-height: 1.72;
	}

	.sblp-prose h2 {
		font-size: clamp(1.42rem, 5.4vw, 1.9rem);
	}

	.sblp-prose h3 {
		font-size: clamp(1.2rem, 4.1vw, 1.45rem);
	}

	.sblp-prose .wp-block-columns {
		gap: 18px;
	}

	.sblp-post-navigation__grid {
		grid-template-columns: minmax(0, 1fr);
	}
}

@media (max-width: 520px) {
	.sblp-layout__shell {
		width: min(calc(100% - 24px), var(--sblp-wide-width));
	}

	.sblp-default-hero,
	.sblp-layout--main-news .sblp-news-hero,
	.sblp-guide-hero,
	.sblp-review-hero__copy,
	.sblp-interview-hero__copy,
	.sblp-opinion-hero__body,
	.sblp-listicle-hero,
	.sblp-comparison-hero,
	.sblp-announcement-hero__inner,
	.sblp-evergreen-hero {
		padding: 24px 20px;
	}

	.sblp-expert-hero,
	.sblp-case-hero,
	.sblp-faq-hero {
		padding-block: 30px;
	}

	.sblp-news-hero {
		padding-inline-start: 16px;
	}

	.sblp-news-hero__topline {
		align-items: flex-start;
		flex-direction: column;
	}

	.sblp-post-meta {
		align-items: flex-start;
		flex-direction: column;
		gap: 6px;
	}

	.sblp-post-meta__separator {
		display: none;
	}

	.sblp-post-meta--news {
		align-items: stretch;
	}

	.sblp-post-meta--news > time,
	.sblp-post-meta--news > span {
		width: 100%;
	}

	.sblp-category-chip {
		min-height: 44px;
	}

	.sblp-reading-layout,
	.sblp-guide-grid {
		margin-top: 36px;
	}

	.sblp-prose blockquote,
	.sblp-prose .wp-block-quote,
	.sblp-prose .wp-block-pullquote {
		padding: 18px;
	}

	.sblp-prose--guide > h2 {
		padding-inline-start: 52px;
	}

	.sblp-prose--listicle > h2 {
		gap: 10px;
		grid-template-columns: 38px minmax(0, 1fr);
	}

	.sblp-prose--listicle > h2::before {
		height: 36px;
		width: 36px;
	}

	.sblp-prose--listicle > h2 + p,
	.sblp-prose--listicle > h2 + figure,
	.sblp-prose--listicle > h2 + .wp-block-image {
		border-inline-start: 0;
		margin-inline-start: 0;
		padding-inline-start: 0;
	}

	.sblp-case-flow {
		padding-inline: 14px;
	}

	.sblp-author-card {
		align-items: flex-start;
		grid-template-columns: minmax(0, 1fr);
	}

	.sblp-author-card__avatar {
		height: 72px;
		width: 72px;
	}

	.sblp-related-post:hover,
	.sblp-post-navigation__link:hover {
		transform: none;
	}
}

@media (max-width: 360px) {
	.sblp-layout__shell {
		width: min(calc(100% - 20px), var(--sblp-wide-width));
	}

	.sblp-post-title,
	.sblp-news-hero .sblp-post-title {
		font-size: clamp(1.82rem, 9.4vw, 2.55rem);
	}

	.sblp-layout-kicker,
	.sblp-type-pill,
	.sblp-breaking-badge,
	.sblp-announcement-badge {
		font-size: 0.67rem;
	}

	.sblp-guide-hero__badge,
	.sblp-listicle-hero__count,
	.sblp-faq-hero__symbol,
	.sblp-evergreen-hero__mark {
		height: 68px;
		width: 68px;
	}
}

@media (max-width: 720px) {
	body.sblp-layout-active :where(.sblp-cta, .sblp-subscribe-block) {
		grid-template-columns: minmax(0, 1fr);
	}

	body.sblp-layout-active .sblp-subscribe-block__channels {
		justify-content: flex-start;
	}

	body.sblp-layout-active .sblp-pros-cons__grid,
	body.sblp-layout-active .wp-block-columns.sblp-pros-cons {
		grid-template-columns: minmax(0, 1fr);
	}

	body.sblp-layout-active .sblp-comment-form {
		grid-template-columns: minmax(0, 1fr);
	}

	body.sblp-layout-active .sblp-comment-form__field {
		grid-column: 1 / -1;
	}
}

@media (max-width: 520px) {
	body.sblp-layout-active .sblp-comments-shell {
		border-radius: min(var(--sblp-geometry-radius-card, 18px), 16px);
		max-width: calc(100% - 20px);
		padding: 18px 14px;
	}

	body.sblp-layout-active .sblp-comments__header {
		align-items: flex-start;
		flex-direction: column;
	}

	body.sblp-layout-active .sblp-comment-list .children {
		margin-inline-start: 4px;
		padding-inline-start: 10px;
	}

	body.sblp-layout-active :where(.sblp-key-points, .sblp-note, .sblp-sources, .sblp-reading-summary, .sblp-cta, .sblp-editorial-trust, .sblp-subscribe-block) {
		border-radius: min(var(--sblp-geometry-radius-card, 18px), 16px);
		padding: 18px 16px;
	}

	body.sblp-layout-active .sblp-source {
		grid-template-columns: 26px minmax(0, 1fr);
		padding-inline: 10px;
	}
}

@media (prefers-reduced-motion: reduce) {
	.sblp-post.sblp-layout *,
	.sblp-post.sblp-layout *::before,
	.sblp-post.sblp-layout *::after {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		scroll-behavior: auto !important;
		transition-duration: 0.01ms !important;
	}
}

@media print {
	.sblp-layout-hero,
	.sblp-featured-media__image,
	.sblp-author-card,
	.sblp-related-post,
	.sblp-post-navigation__link,
	.sblp-review-summary,
	.sblp-interview-format,
	.sblp-case-flow {
		background: #ffffff !important;
		box-shadow: none !important;
		color: #000000 !important;
	}

	.sblp-layout-hero,
	.sblp-author-card,
	.sblp-related-post,
	.sblp-post-navigation__link,
	.sblp-review-summary,
	.sblp-interview-format,
	.sblp-case-flow {
		border-color: #b7b7b7 !important;
	}
}

/* ==========================================================================
 * 2.3.9 — commercial and advertising layouts.
 * ========================================================================== */

.sblp-layout--commercial,
.sblp-layout--advertising {
	--sblp-campaign-gap: clamp(20px, 3vw, 36px);
}

.sblp-commercial-hero,
.sblp-advertising-hero {
	display: grid;
	grid-template-columns: minmax(0, 1.08fr) minmax(280px, 0.92fr);
	overflow: hidden;
}

.sblp-commercial-hero__copy,
.sblp-advertising-hero__copy {
	align-self: center;
	min-width: 0;
	padding: clamp(30px, 5vw, 68px);
}

.sblp-commercial-hero__media,
.sblp-advertising-hero__media {
	min-height: 100%;
	min-width: 0;
}

.sblp-commercial-hero__media .sblp-featured-media,
.sblp-advertising-hero__media .sblp-featured-media {
	height: 100%;
	margin: 0;
}

.sblp-commercial-hero__media .sblp-featured-media__image,
.sblp-advertising-hero__media .sblp-featured-media__image {
	border-radius: 0;
	height: 100%;
	min-height: 420px;
	object-fit: cover;
	width: 100%;
}

.sblp-commercial-hero--without-media,
.sblp-advertising-hero--without-media {
	grid-template-columns: minmax(0, 1fr);
}

.sblp-campaign-label,
.sblp-advertising-disclosure__label {
	align-items: center;
	background: var(--sblp-design-badge-bg, var(--sblp-surface, #ffffff));
	border: 1px solid var(--sblp-design-badge-border, var(--sblp-line));
	border-radius: 999px;
	color: var(--sblp-design-badge-text, var(--sblp-text, #1f2933));
	display: inline-flex;
	font-family: var(--sblp-font-accent, inherit);
	font-size: 0.76rem;
	font-weight: 760;
	letter-spacing: 0.055em;
	line-height: 1.25;
	max-width: 100%;
	min-height: 32px;
	overflow-wrap: anywhere;
	padding: 7px 12px;
	text-transform: uppercase;
	width: fit-content;
}

.sblp-commercial-offer {
	background: var(--sblp-single-soft);
	border: 1px solid var(--sblp-line);
	border-radius: var(--sblp-radius-md);
	display: grid;
	gap: 7px;
	margin-top: 28px;
	max-width: 640px;
	padding: 18px 20px;
}

.sblp-commercial-offer p,
.sblp-campaign-cta p,
.sblp-campaign-disclaimer p,
.sblp-campaign-sponsor p {
	margin: 0;
	overflow-wrap: anywhere;
}

.sblp-commercial-offer__price {
	color: var(--sblp-single-heading);
	font-size: clamp(1.18rem, 1.5vw, 1.5rem);
	line-height: 1.25;
}

.sblp-commercial-benefits {
	background: var(--sblp-single-surface);
	border: 1px solid var(--sblp-line);
	border-radius: var(--sblp-radius-lg);
	display: grid;
	gap: var(--sblp-campaign-gap);
	grid-template-columns: minmax(210px, 0.72fr) minmax(0, 1.28fr);
	margin: clamp(28px, 5vw, 56px) auto 0;
	padding: clamp(24px, 4vw, 42px);
}

.sblp-commercial-benefits__heading > span,
.sblp-campaign-sponsor__eyebrow {
	color: var(--sblp-single-muted);
	font-size: 0.76rem;
	font-weight: 750;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.sblp-commercial-benefits__heading h2,
.sblp-campaign-sponsor h2 {
	color: var(--sblp-single-heading);
	font-size: clamp(1.45rem, 2.2vw, 2.05rem);
	line-height: 1.18;
	margin: 8px 0 0;
	overflow-wrap: anywhere;
}

.sblp-commercial-benefits__list {
	display: grid;
	gap: 12px;
	list-style: none;
	margin: 0;
	padding: 0;
}

.sblp-commercial-benefits__list li {
	align-items: flex-start;
	background: var(--sblp-single-soft);
	border: 1px solid var(--sblp-line);
	border-radius: var(--sblp-radius-sm);
	display: grid;
	gap: 12px;
	grid-template-columns: 24px minmax(0, 1fr);
	overflow-wrap: anywhere;
	padding: 14px 16px;
}

.sblp-commercial-benefits__list li > span:first-child {
	align-items: center;
	background: var(--sblp-design-badge-bg, var(--sblp-accent-strong, var(--sblp-accent)));
	border-radius: 50%;
	color: var(--sblp-design-badge-text, var(--sblp-on-accent));
	display: inline-flex;
	height: 24px;
	justify-content: center;
	width: 24px;
}

.sblp-campaign-cta {
	align-items: center;
	background: var(--sblp-accent-soft);
	border: 1px solid var(--sblp-line);
	border-radius: var(--sblp-radius-lg);
	display: grid;
	gap: 22px;
	grid-template-columns: minmax(0, 1fr) auto;
	margin: clamp(28px, 5vw, 52px) auto 0;
	padding: clamp(22px, 3.5vw, 34px);
}

.sblp-campaign-cta__copy {
	display: grid;
	gap: 6px;
	min-width: 0;
}

.sblp-campaign-cta__heading {
	color: var(--sblp-design-cta-text, var(--sblp-single-heading));
	font-size: clamp(1.12rem, 1.6vw, 1.42rem);
}

.sblp-campaign-cta__button {
	align-items: center;
	background: var(--sblp-design-cta-button-bg, var(--sblp-accent-strong, var(--sblp-accent)));
	border: 1px solid var(--sblp-design-cta-button-bg, var(--sblp-accent-strong, var(--sblp-accent)));
	border-radius: var(--sblp-radius-sm);
	color: var(--sblp-design-cta-button-text, var(--sblp-on-accent));
	display: inline-flex;
	font-weight: 750;
	justify-content: center;
	line-height: 1.25;
	max-width: 100%;
	min-height: 44px;
	overflow-wrap: anywhere;
	padding: 12px 20px;
	text-align: center;
	text-decoration: none;
}

.sblp-campaign-cta__button:hover {
	background: var(--sblp-design-cta-button-bg, var(--sblp-accent-strong, var(--sblp-accent)));
	border-color: var(--sblp-design-cta-button-bg, var(--sblp-accent-strong, var(--sblp-accent)));
	color: var(--sblp-design-cta-button-text, var(--sblp-on-accent));
}

.sblp-campaign-disclaimer {
	background: var(--sblp-single-soft);
	border: 1px solid var(--sblp-line);
	border-inline-start: 4px solid var(--sblp-accent);
	border-radius: var(--sblp-radius-sm);
	display: grid;
	gap: 8px;
	margin-top: 34px;
	overflow-wrap: anywhere;
	padding: 18px 20px;
}

.sblp-advertising-disclosure {
	align-items: flex-start;
	background: var(--sblp-single-surface);
	border: 1px solid var(--sblp-line);
	border-radius: var(--sblp-radius-md);
	display: flex;
	font-size: 0.9rem;
	gap: 14px;
	line-height: 1.5;
	margin: 0 0 18px;
	overflow-wrap: anywhere;
	padding: 14px 16px;
}

.sblp-advertising-disclosure__label {
	flex: 0 0 auto;
	margin: 0;
}

.sblp-campaign-sponsor {
	align-items: center;
	background: var(--sblp-single-surface);
	border: 1px solid var(--sblp-line);
	border-radius: var(--sblp-radius-lg);
	display: grid;
	gap: 24px;
	grid-template-columns: auto minmax(0, 1fr);
	margin: clamp(28px, 5vw, 52px) auto 0;
	padding: clamp(22px, 3.5vw, 34px);
}

.sblp-campaign-sponsor__media {
	align-items: center;
	background: var(--sblp-single-soft);
	border: 1px solid var(--sblp-line);
	border-radius: var(--sblp-radius-md);
	display: flex;
	justify-content: center;
	min-height: 96px;
	padding: 16px;
	width: clamp(120px, 16vw, 190px);
}

.sblp-campaign-sponsor__logo {
	height: auto;
	max-height: 88px;
	max-width: 100%;
	object-fit: contain;
	width: auto;
}

.sblp-campaign-sponsor__body {
	display: grid;
	gap: 9px;
	min-width: 0;
}

.sblp-campaign-sponsor h2 a {
	color: inherit;
	overflow-wrap: anywhere;
	text-decoration-thickness: 1px;
	text-underline-offset: 4px;
}

.sblp-prose--commercial :where(table, .wp-block-table),
.sblp-prose--advertising :where(table, .wp-block-table) {
	max-width: 100%;
	overflow-x: auto;
}

@media (max-width: 900px) {
	.sblp-commercial-hero,
	.sblp-advertising-hero {
		grid-template-columns: minmax(0, 1fr);
	}

	.sblp-commercial-hero__media,
	.sblp-advertising-hero__media {
		order: -1;
	}

	.sblp-commercial-hero__media .sblp-featured-media__image,
	.sblp-advertising-hero__media .sblp-featured-media__image {
		min-height: 260px;
		max-height: 520px;
	}
}

@media (max-width: 720px) {
	.sblp-commercial-benefits,
	.sblp-campaign-cta {
		grid-template-columns: minmax(0, 1fr);
	}

	.sblp-campaign-cta__button {
		width: 100%;
	}

	.sblp-advertising-disclosure {
		flex-direction: column;
	}
}

@media (max-width: 520px) {
	.sblp-commercial-hero__copy,
	.sblp-advertising-hero__copy {
		padding: 24px 20px;
	}

	.sblp-campaign-sponsor {
		align-items: flex-start;
		grid-template-columns: minmax(0, 1fr);
	}

	.sblp-campaign-sponsor__media {
		width: min(100%, 190px);
	}

	.sblp-commercial-benefits,
	.sblp-campaign-cta,
	.sblp-campaign-sponsor {
		border-radius: min(var(--sblp-radius-lg), 16px);
		padding: 20px 16px;
	}
}
