/* Plain-language comparisons with the shared workspace finish. */
.product-comparison { overflow-x:auto; border:1px solid var(--demo-border); border-radius:12px; background:#10171f; color:var(--demo-text); scrollbar-width:thin; scrollbar-color:#647181 #10171f; }
.product-comparison:focus-visible { outline:2px solid #38bdf8; outline-offset:4px; }
.product-comparison table { width:100%; min-width:660px; table-layout:fixed; border-collapse:collapse; font:400 15px/1.6 'Geist','Inter',sans-serif; text-align:left; }
.product-comparison th,.product-comparison td { padding:20px 24px; vertical-align:top; border-bottom:1px solid var(--demo-border); overflow-wrap:break-word; }
.product-comparison thead th { background:#ffffff03; font-size:17px; font-weight:500; color:#eef2f7; }
.product-comparison thead th:first-child { width:28%; }
.product-comparison thead th span { display:block; margin-top:7px; font-size:13px; font-weight:400; line-height:1.6; color:var(--demo-muted); }
.product-comparison tbody th { font-size:15px; font-weight:500; color:var(--demo-text); }
.product-comparison tbody td { color:var(--demo-muted); }
.product-comparison tr>:last-child { background:#dce7f409; color:#e7edf4; border-left:1px solid var(--demo-border); }
.product-comparison tbody tr:last-child>* { border-bottom:0; }
.product-comparison tbody tr:hover { background:#ffffff02; }
.product-comparison-note { margin:18px 0 0; max-width:760px; color:var(--demo-muted); font:400 13px/1.7 'Geist',sans-serif; }
.product-comparison-hint { display:none; margin:0 0 12px; font:400 13px/1.6 'Geist',sans-serif; color:var(--demo-muted); }
.product-comparison-intro { margin-top:88px; margin-bottom:32px; }
@media(max-width:767px) {
 .product-comparison th,.product-comparison td { padding:16px 18px; }
 .product-comparison-hint { display:block; }
 .product-comparison-intro { margin-top:56px; }
}

/* A conventional matrix: named setups, plain features, one clear symbol per cell. */
.comparison-matrix table { min-width:680px; }
.comparison-matrix thead th:first-child { width:40%; }
.comparison-matrix thead th:not(:first-child),.comparison-matrix tbody td { text-align:center; }
.comparison-matrix th,.comparison-matrix td { vertical-align:middle; padding:17px 22px; }
.comparison-matrix thead th { padding-block:24px; }
.comparison-matrix thead th:not(:first-child) { border-left:1px solid var(--demo-border); }
.comparison-mark { display:inline-flex; width:24px; height:24px; align-items:center; justify-content:center; vertical-align:middle; }
.comparison-mark svg { width:21px; height:21px; }
.comparison-mark.is-yes { color:#9dc6b4; }
.comparison-mark.is-no { color:#a99598; }
.comparison-legend { display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin-top:20px; font:400 13px/1.6 'Geist',sans-serif; color:var(--demo-muted); }
.comparison-legend>span:nth-child(2) { margin-right:18px; }
@media(max-width:767px) {
 .comparison-matrix th,.comparison-matrix td { padding:16px; }
 .comparison-matrix thead th:first-child { width:34%; }
 .comparison-matrix thead th { font-size:15px; }
 .comparison-legend { display:grid; grid-template-columns:24px 1fr; }
}
