/* Comparison Table — Figma 1346:432 (table + collapsed panels) / 1346:1848 (expanded). */

.rw-block-comparison-table {
	--rw-ct-line: rgba(129, 133, 141, 0.4); /* Figma-exact inner rules */
	--rw-ct-frame: rgba(65, 76, 104, 0.3); /* Figma-exact outer stroke */
	color: var(--rw-color-primary-green);
}

.rw-block-comparison-table h2 {
	margin-bottom: var(--rw-space-md);
	font-size: clamp(1.75rem, 0.38vw + 1.65rem, 2rem); /* 28 → 32 */
	line-height: 1.1875;
	letter-spacing: var(--rw-h2-tracking);
	color: var(--rw-color-primary-green);
}

.rw-block-comparison-table .table-scroll {
	/* Containing block for the absolutely positioned .sr-only labels — without it they
	   escape the scroller and widen the whole page on phones. */
	position: relative;
	overflow-x: auto;
	border: 1px solid var(--rw-ct-frame);
	border-radius: var(--rw-radius-lg);
}
.rw-block-comparison-table .table-scroll:focus-visible { outline: none; box-shadow: var(--rw-state-focus-ring); }

.rw-block-comparison-table table {
	width: 100%;
	min-width: 48rem; /* keeps 4 readable columns; scrolls horizontally below this */
	border-collapse: collapse;
	table-layout: fixed;
}
.rw-block-comparison-table th,
.rw-block-comparison-table td {
	padding: var(--rw-space-sm);
	border-top: 1px solid var(--rw-ct-line);
	border-left: 1px solid var(--rw-ct-line);
	text-align: left;
	vertical-align: top;
	font-family: var(--rw-font-text);
	font-size: var(--rw-p2-size);
	line-height: 1.75;
	letter-spacing: var(--rw-p2-tracking);
}
.rw-block-comparison-table tr > :first-child { border-left: 0; }
.rw-block-comparison-table thead th,
.rw-block-comparison-table thead td {
	border-top: 0;
	padding-block: var(--rw-space-md);
	background: var(--rw-color-bg-mist);
	font-weight: 700;
	font-size: var(--rw-space-md); /* 24px — Figma column header */
	line-height: 1.1;
	letter-spacing: -0.02em;
	color: var(--rw-color-primary-green);
	/* Figma trims the header text to its cap height (text-box-trim) → 24 + cap + 24.
	   Progressive: older browsers keep the full line box (a few px taller). */
	text-box: trim-both cap alphabetic;
}
.rw-block-comparison-table tbody th { font-weight: 700; color: var(--rw-color-primary-green); }
.rw-block-comparison-table tbody td { font-weight: 500; color: var(--rw-color-grey-01); }
/* Highlighted (last) column — white fill. */
.rw-block-comparison-table tbody td:last-child { background: var(--rw-color-white); }

.rw-block-comparison-table .cell-title,
.rw-block-comparison-table .cell-note { display: block; }
.rw-block-comparison-table .cell-title { font-weight: 700; line-height: 1.375; color: var(--rw-color-primary-green); }
.rw-block-comparison-table .cell-note {
	margin-top: 0.125rem;
	font-size: 0.875rem;
	line-height: 1.2;
	color: var(--rw-color-grey-01);
}

.rw-block-comparison-table .check-chip {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 2rem;
	height: 2rem;
	border-radius: 999px;
	background: var(--rw-color-primary-yellow);
	color: var(--rw-color-primary-green);
	vertical-align: middle;
}
.rw-block-comparison-table .check-chip .icon { display: inline-flex; }

.rw-block-comparison-table .sr-only {
	position: absolute;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
	border: 0;
}

/* Expandable panels (native <details>). */
.rw-block-comparison-table .panels {
	margin-top: var(--rw-space-xl);
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: var(--rw-space-md);
	align-items: start;
}
.rw-block-comparison-table .panel {
	overflow: hidden;
	border: 1px solid var(--rw-ct-frame);
	border-radius: var(--rw-radius-sm);
	background: var(--rw-color-white);
}
.rw-block-comparison-table summary {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--rw-space-sm);
	padding: var(--rw-space-sm) var(--rw-space-md);
	background: var(--rw-color-bg-mist);
	list-style: none;
	cursor: pointer;
}
.rw-block-comparison-table summary::-webkit-details-marker { display: none; }
.rw-block-comparison-table summary:focus-visible { outline: none; box-shadow: inset var(--rw-state-focus-ring); }
.rw-block-comparison-table .panel-title {
	font-weight: 700;
	font-size: var(--rw-p1-size);
	line-height: 1.67;
	letter-spacing: -0.012em;
}
.rw-block-comparison-table .panel-toggle {
	flex: none;
	display: inline-flex;
	align-items: center;
	gap: var(--rw-space-xs);
	font-weight: 700;
	font-size: var(--rw-p2-size);
	line-height: 1.375;
}
.rw-block-comparison-table .when-open { display: none; }
.rw-block-comparison-table .panel[open]:not(.is-closing) .when-open { display: inline; }
.rw-block-comparison-table .panel[open]:not(.is-closing) .when-closed { display: none; }

/* +/− icon drawn with two bars; the vertical bar hides when open. */
.rw-block-comparison-table .toggle-icon {
	position: relative;
	width: 1.5rem;
	height: 1.5rem;
	color: var(--rw-color-grey-02);
}
.rw-block-comparison-table .toggle-icon::before,
.rw-block-comparison-table .toggle-icon::after {
	content: '';
	position: absolute;
	left: 50%;
	top: 50%;
	width: 0.875rem;
	height: 1.5px;
	background: currentColor;
	transform: translate(-50%, -50%);
}
/* Vertical bar rotates flat into the horizontal one: + → −. */
.rw-block-comparison-table .toggle-icon::after {
	transform: translate(-50%, -50%) rotate(90deg);
	transition: transform .3s cubic-bezier(0.4, 0, 0.2, 1);
}
.rw-block-comparison-table .panel[open]:not(.is-closing) .toggle-icon::after { transform: translate(-50%, -50%) rotate(0deg); }
@media (prefers-reduced-motion: reduce) {
	.rw-block-comparison-table .toggle-icon::after { transition: none; }
}

.rw-block-comparison-table .panel-rows { margin: 0; }
.rw-block-comparison-table .panel-row {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	border-top: 1px solid var(--rw-ct-line);
}
.rw-block-comparison-table .panel-row dt,
.rw-block-comparison-table .panel-row dd {
	margin: 0;
	padding: var(--rw-space-sm);
	font-size: var(--rw-p2-size);
	letter-spacing: var(--rw-p2-tracking);
}
.rw-block-comparison-table .panel-row dt { font-weight: 600; line-height: 1.75; color: var(--rw-color-primary-green); }
.rw-block-comparison-table .panel-row dd {
	border-left: 1px solid var(--rw-ct-line);
	font-weight: 500;
	line-height: 1.5;
	color: var(--rw-color-grey-01);
}

@media (max-width: 1023px) {
	.rw-block-comparison-table .panels { grid-template-columns: 1fr; }
}

@media (max-width: 767px) {
	.rw-block-comparison-table .panels { margin-top: var(--rw-space-md); gap: var(--rw-space-sm); }
	.rw-block-comparison-table summary { padding-inline: var(--rw-space-sm); }
	.rw-block-comparison-table .panel-row { grid-template-columns: 2fr 3fr; }

	/* Compact table (design review): only the table reaches 8px from the screen
	   edges; heading + panels keep the container gutter. */
	.rw-block-comparison-table .table-scroll {
		margin-inline: calc(0.5rem - var(--rw-container-px));
	}
	.rw-block-comparison-table table { min-width: 36rem; }
	.rw-block-comparison-table th,
	.rw-block-comparison-table td {
		padding: 0.625rem 0.75rem;
		font-size: 0.875rem;
		line-height: 1.43;
	}
	.rw-block-comparison-table thead th,
	.rw-block-comparison-table thead td {
		padding-block: 0.875rem;
		font-size: 1rem;
		line-height: 1.2;
	}
	.rw-block-comparison-table .cell-title { line-height: 1.3; }
	.rw-block-comparison-table .cell-note { font-size: 0.75rem; }
	.rw-block-comparison-table .check-chip { width: 1.5rem; height: 1.5rem; }
	.rw-block-comparison-table .check-chip svg { width: 0.75rem; height: 0.75rem; }
}