.ptw-comparison-layout {
	--ptw-comparison-reading-width: 52rem;
}

.ptw-comparison-article {
	display: grid;
	gap: var(--ptw-space-8);
}

.ptw-comparison-header {
	max-width: var(--ptw-comparison-reading-width);
}

.ptw-comparison-hero {
	display: grid;
	gap: var(--ptw-space-5);
	max-width: var(--ptw-comparison-reading-width);
}

.ptw-comparison-hero__media {
	overflow: hidden;
	border: var(--ptw-border-width-sm) solid var(--ptw-color-border);
	border-radius: var(--ptw-radius-lg);
	background: var(--ptw-color-surface-alt);
}

.ptw-comparison-hero__media .featured-image {
	margin: 0;
}

.ptw-comparison-hero__media .featured-image__image {
	border-radius: 0;
}

.ptw-comparison-hero__meta {
	display: flex;
	flex-wrap: wrap;
	gap: var(--ptw-space-3);
	align-items: center;
}

.ptw-comparison-hero__meta .editorial-meta,
.ptw-comparison-hero__meta .reading-time {
	margin-top: 0;
}

.ptw-comparison-summary {
	display: grid;
	gap: var(--ptw-space-5);
	margin-top: var(--ptw-space-2);
	padding: var(--ptw-space-5);
	border: var(--ptw-border-width-sm) solid var(--ptw-color-border);
	border-radius: var(--ptw-radius-lg);
	background: var(--ptw-color-surface-alt);
}

.ptw-comparison-summary__description {
	margin: 0;
	color: var(--ptw-color-text-primary);
	font-size: var(--ptw-font-size-lg);
	line-height: var(--ptw-line-height-relaxed);
}

.ptw-comparison-verdict {
	display: grid;
	gap: var(--ptw-space-2);
	padding-top: var(--ptw-space-4);
	border-top: var(--ptw-border-width-sm) solid var(--ptw-color-border);
}

.ptw-comparison-verdict__label {
	color: var(--ptw-color-text-secondary);
	font-size: var(--ptw-font-size-xs);
	font-weight: var(--ptw-font-weight-bold);
	line-height: var(--ptw-line-height-tight);
	text-transform: uppercase;
}

.ptw-comparison-verdict__text {
	color: var(--ptw-color-text-primary);
	font-size: var(--ptw-font-size-md);
	font-weight: var(--ptw-font-weight-semibold);
	line-height: var(--ptw-line-height-relaxed);
}

.ptw-comparison-layout table {
	display: block;
	max-width: 100%;
	overflow-x: auto;
	border-collapse: collapse;
}

@media (max-width: 40rem) {
	.ptw-comparison-article {
		gap: var(--ptw-space-6);
	}

	.ptw-comparison-hero {
		gap: var(--ptw-space-4);
	}

	.ptw-comparison-hero__meta {
		align-items: flex-start;
		flex-direction: column;
	}

	.ptw-comparison-summary {
		padding: var(--ptw-space-4);
	}
}