.comparison-hub-grouped { padding-bottom: clamp(4rem, 8vw, 7rem); }
.comparison-groups { display: grid; gap: clamp(2.8rem, 6vw, 5rem); margin-top: clamp(3rem, 6vw, 5rem); }
.comparison-group { padding-top: 1.25rem; border-top: 1px solid var(--line); }
.comparison-group-heading { display: flex; align-items: baseline; gap: .75rem; margin-bottom: 1.4rem; }
.comparison-group-heading > span { color: var(--teal-700); font-size: .76rem; font-weight: 850; letter-spacing: .08em; }
.comparison-group-heading h2 { margin: 0; font-size: clamp(1.7rem, 3vw, 2.45rem); }
.comparison-tile-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; }
.comparison-tile-grid-two { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.comparison-tile-grid-one { grid-template-columns: minmax(220px, 1fr); max-width: calc((100% - 2rem) / 3); }
.comparison-tile {
	display: flex;
	min-height: 190px;
	align-items: center;
	justify-content: center;
	flex-direction: column;
	gap: 1rem;
	padding: 1.5rem;
	border: 1px solid var(--line);
	border-radius: var(--radius);
	background: #fff;
	box-shadow: 0 12px 34px rgb(13 32 60 / 5%);
	text-align: center;
	text-decoration: none;
	transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}
.comparison-tile:hover, .comparison-tile:focus-visible { border-color: rgb(8 123 112 / 45%); box-shadow: 0 18px 42px rgb(13 32 60 / 10%); transform: translateY(-3px); }
.comparison-tile-icon { display: grid; width: 70px; height: 70px; place-items: center; border-radius: 22px; background: var(--teal-100); color: var(--teal-700); }
.comparison-tile-icon svg { width: 36px; height: 36px; }
.comparison-tile h3 { max-width: 18ch; margin: 0; color: var(--navy-950); font-size: 1.08rem; letter-spacing: -.015em; }
.comparison-tile-cash .comparison-tile-icon, .comparison-tile-mortgage .comparison-tile-icon { background: #edf3fb; color: var(--navy-800); }
.comparison-tile-short .comparison-tile-icon { background: #fff3d8; color: #8a5c00; }
@media (max-width: 760px) {
	.comparison-tile-grid, .comparison-tile-grid-two { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.comparison-tile-grid-one { max-width: none; grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 520px) {
	.comparison-tile-grid, .comparison-tile-grid-two, .comparison-tile-grid-one { grid-template-columns: 1fr; }
	.comparison-tile { min-height: 165px; }
}
