/* =========================================================================
 * LAYOUT 1 — 3-COLUMN MATRIX TABLE (.imea-comparison--layout-1)
 * APPEND to: IMEA/assets/css/comparison.css — do not remove existing rules.
 * Scoped under --layout-1. Palette + details aligned to the layout-2 block:
 * var(--text-color) section, --base-color eyebrow, mint greens (#35D07F /
 * #42DA88 / #4ADE80), \2713 check, gradient-border stat cards.
 * ====================================================================== */

.imea-comparison--layout-1 {
	--cmp-line:       rgba(255, 255, 255, 0.10);
	--cmp-green-edge: rgba(66, 218, 136, 0.28);
	--cmp-band:       rgba(53, 208, 127, 0.07);
	--cmp-check:      #4ADE80;
	--cmp-text:       #fff;
	--cmp-muted:      rgba(255, 255, 255, 0.52);

	position: relative;
	padding: 80px 0;
	background: var(--text-color);
}

/* --- header (matches layout-2) ------------------------------------------- */
.imea-comparison--layout-1 .imea-comparison__header { margin-bottom: 40px; }
.imea-comparison--layout-1 .imea-comparison__eyebrow {
	margin: 0 0 18px;
	font-size: 14px;
	font-weight: 600;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--base-color);
}
.subtitle--blocl {margin-bottom: 30px;}

.subtitle--blocl h4 {
    font-weight: 500;
    text-transform: uppercase;
    color: var(--base-color);
    letter-spacing: 2px;
}
.imea-comparison--layout-1 .imea-comparison__title {
	margin: 0;
	font-size: 48px;
	font-weight: 400;
	letter-spacing: -0.01em;
	line-height: 1.25;
	color: #fff;
}
.imea-comparison--layout-1 .imea-comparison__title span { color: var(--base-color); }
.imea-comparison--layout-1 .imea-comparison__desc {
	margin: 18px 0 0;
	/* max-width: 62ch; */
	font-size: 18px;
	line-height: 1.6;
	color: #fff;
}

/* --- table grid ---------------------------------------------------------- */
.imea-comparison--layout-1 .imea-comparison__table {
	display: grid;
	grid-template-columns: minmax(150px, 1.05fr) minmax(260px, 1.5fr) minmax(260px, 1.5fr);
	margin-top: 8px;
}
.imea-comparison--layout-1 .imea-comparison__row { display: contents; }

.imea-comparison--layout-1 .imea-comparison__cell {
	display: flex;
	flex-direction: column;
	justify-content: center;
	padding: clamp(20px, 2.4vw, 30px) clamp(18px, 2vw, 34px);
	border-bottom: 1px solid var(--cmp-line);
}

/* featured (Gruve) column: green edges + subtle band */
.imea-comparison--layout-1 .imea-comparison__cell--a {
	border-left: 1px solid var(--cmp-green-edge);
	border-right: 1px solid var(--cmp-green-edge);
	background: var(--cmp-band);
}

/* header row */
.imea-comparison--layout-1 .imea-comparison__cell--head {
	padding-top: clamp(22px, 2.6vw, 34px);
	padding-bottom: clamp(22px, 2.6vw, 34px);
}
/* accent-panel echo: radial green glow + top white streak on the Gruve head */
.imea-comparison--layout-1 .imea-comparison__cell--a.imea-comparison__cell--head {
	position: relative;
	background:
		radial-gradient(120% 95% at 50% 0%, rgba(53, 208, 127, 0.32) 0%, rgba(53, 208, 127, 0.08) 46%, rgba(0, 0, 0, 0) 72%),
		var(--cmp-band);
}
.imea-comparison--layout-1 .imea-comparison__cell--a.imea-comparison__cell--head::after {
	content: "";
	position: absolute;
	top: 0; left: 0; right: 0;
	height: 3px;
	background: linear-gradient(90deg, rgba(66, 218, 136, 0) 0%, #FFFFFF 51.44%, rgba(66, 218, 136, 0) 100%);
	pointer-events: none;
}

.imea-comparison--layout-1 .imea-comparison__col-title {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	font-size: 15px;
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: #fff;
}
.imea-comparison--layout-1 .imea-comparison__cell--b .imea-comparison__col-title { color: var(--cmp-muted); }

/* header check — \2713 like layout-2, not an SVG */
.imea-comparison--layout-1 .imea-comparison__col-check {
	display: inline-flex;
	flex: none;
}
.imea-comparison--layout-1 .imea-comparison__col-check::before {
	content: "\2713";
	font-size: 16px;
	font-weight: 700;
	line-height: 1;
	color: var(--cmp-check);
}

/* left criteria column */
.imea-comparison--layout-1 .imea-comparison__cell--label {
	color: var(--cmp-muted);
	font-size: clamp(15px, 1.4vw, 18px);
	font-weight: 400;
}

/* content cells */
.imea-comparison--layout-1 .imea-comparison__cell-text {
	position: relative;
	margin: 0;
	padding-left: 28px;
	font-size: clamp(15px, 1.4vw, 18px);
	line-height: 1.5;
}
.imea-comparison--layout-1 .imea-comparison__cell--a .imea-comparison__cell-text { color: var(--cmp-text); }
.imea-comparison--layout-1 .imea-comparison__cell--b .imea-comparison__cell-text { color: var(--cmp-muted); }

.imea-comparison--layout-1 .imea-comparison__cell--a .imea-comparison__cell-text::before {
	content: "\2713";
	position: absolute;
	left: 0;
	top: 0;
	font-size: 14px;
	font-weight: 700;
	line-height: 1.5;
	color: var(--cmp-check);
}
.imea-comparison--layout-1 .imea-comparison__cell--b .imea-comparison__cell-text::before {
	content: "-";
	position: absolute;
	left: 0;
	top: 0;
	color: var(--cmp-muted);
}

/* mobile-only column tag */
.imea-comparison--layout-1 .imea-comparison__cell-tag { display: none; }

/* --- shared highlight cards (layout-2 rules are scoped to --layout-2, so
 *     re-declare for --layout-1 to keep them identical) ------------------- */
.imea-comparison--layout-1 .imea-comparison__stats { margin-top: 40px; }
.imea-comparison--layout-1 .imea-comparison__stat {
	padding: 32px 28px;
	text-align: center;
	border-radius: 16px;
	background: #FFFFFF0A;
	position: relative;
}
.imea-comparison--layout-1 .imea-comparison__stat::before {
	content: "";
	position: absolute;
	inset: 0;
	border-radius: inherit;
	padding: 1px;
	background: linear-gradient(136.56deg, rgba(255, 255, 255, 0.704) 40.11%, rgba(255, 255, 255, 0) 50.41%, rgba(255, 255, 255, 0.352) 61.23%);
	-webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
	-webkit-mask-composite: xor;
	mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
	mask-composite: exclude;
	pointer-events: none;
}
.imea-comparison--layout-1 .imea-comparison__stat-label {
	margin: 0 0 12px;
	font-size: 14px;
	font-weight: 600;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: #35D07F;
}
.imea-comparison--layout-1 .imea-comparison__stat-text {
	margin: 0;
	font-size: 24px;
	line-height: 1.35;
	color: #fff;
}

/* --- responsive ---------------------------------------------------------- */
@media (max-width: 991.98px) {
	.imea-comparison--layout-1 { padding: 64px 0 80px; }
	.imea-comparison--layout-1 .imea-comparison__title { font-size: 32px; }
}
@media (max-width: 767.98px) {
	/* stack the matrix into per-criterion cards */
	.imea-comparison--layout-1 .imea-comparison__table { display: block; }
	.imea-comparison--layout-1 .imea-comparison__row--head { display: none; }
	.imea-comparison--layout-1 .imea-comparison__row {
		display: block;
		padding: 22px 0;
		border-bottom: 1px solid var(--cmp-line);
	}
	.imea-comparison--layout-1 .imea-comparison__cell {
		display: block;
		padding: 0;
		border: 0;
		background: none;
	}
	.imea-comparison--layout-1 .imea-comparison__cell--a.imea-comparison__cell--head::after { content: none; }
	.imea-comparison--layout-1 .imea-comparison__cell--label {
		margin-bottom: 14px;
		font-size: 18px;
		font-weight: 600;
		color: #fff;
	}
	.imea-comparison--layout-1 .imea-comparison__cell--a { margin-bottom: 14px; }
	.imea-comparison--layout-1 .imea-comparison__cell-tag {
		display: block;
		margin-bottom: 6px;
		font-size: 11px;
		font-weight: 700;
		letter-spacing: 0.12em;
		text-transform: uppercase;
		color: var(--cmp-muted);
	}
}
@media (max-width: 575.98px) {
	.imea-comparison--layout-1 .imea-comparison__title { font-size: 26px; }
	.imea-comparison--layout-1 .imea-comparison__stat-text { font-size: 20px; }
}