/* compare.css — shared styles for compare/remio-vs-*.html (.cmp + .verdict + .egrid + .sibs).
   Extracted from per-page inline <style> (byte-identical across 13 pages) 2026-07-12. */
/* compare/*.html — comparison page-specific (proposed for nocturne.css as .cmp + .verdict + .egrid + .sibs). */
/* Feature comparison table (shared with alternative-to-*.html .cmp) */
.cmp-wrap{max-width:1000px;margin:44px auto 0;padding:0 32px;overflow-x:auto}
.cmp{width:100%;border-collapse:separate;border-spacing:0;min-width:580px;
  background:var(--glass);border:1.5px solid var(--line);border-radius:20px;overflow:hidden}
.cmp th,.cmp td{padding:14px 20px;text-align:left;font-size:15px;border-bottom:1px solid rgba(163,177,255,.12);vertical-align:top}
.cmp thead th{font-family:var(--f-head);font-weight:600;font-size:14px;color:#fff;background:rgba(126,142,255,.08);letter-spacing:.01em}
.cmp thead th.col-remio{color:var(--accent)}
.cmp tbody tr:last-child td{border-bottom:0}
.cmp td:first-child{color:var(--tx-dim);font-weight:500}
.cmp td.v-remio{color:#fff;font-weight:600}
.cmp td.v-them{color:var(--tx-faint)}
.cmp .yes{color:#57e6c4;font-weight:600}
.cmp tr.cat td{background:rgba(126,142,255,.06);font-family:var(--f-body);font-weight:600;
  font-size:12px;letter-spacing:.15em;text-transform:uppercase;color:#cdd7ff;padding:11px 20px}
/* Verdict — two-way "choose / stick with" split */
.verdict{max-width:960px;margin:52px auto 0;display:grid;grid-template-columns:1fr 1fr;gap:18px}
.vcard{padding:30px 28px;border-radius:24px;background:var(--glass);border:1.5px solid var(--line)}
.vcard.win{border-color:rgba(105,196,168,.36);background:rgba(87,230,196,.05)}
.vcard-eyebrow{display:flex;align-items:center;gap:9px;font-family:var(--f-body);font-size:12px;
  font-weight:600;letter-spacing:.15em;text-transform:uppercase;color:#cdd7ff}
.vcard.win .vcard-eyebrow{color:#8fecd3}
.vdot{width:6px;height:6px;border-radius:50%;background:var(--accent);box-shadow:0 0 8px rgba(140,160,255,.7)}
.vcard.win .vdot{background:#57e6c4;box-shadow:0 0 9px rgba(87,230,196,.85)}
.vcard h3{margin-top:13px;font-family:var(--f-head);font-weight:600;font-size:clamp(19px,2.3vw,23px);line-height:1.24;color:#fff}
.vcard p{margin-top:12px;font-size:15px;line-height:1.62;color:var(--tx-body)}
.vcard p a{color:var(--accent);text-decoration:underline;text-underline-offset:3px;text-decoration-color:rgba(169,186,255,.4)}
.vcard p a:hover{color:#fff}
@media (max-width:760px){.verdict{grid-template-columns:1fr}}
/* Narrative rows — "where each tool wins", numbered reason stack (shared .why) */
.why{max-width:920px;margin:48px auto 0;display:flex;flex-direction:column;gap:16px}
.why-row{display:grid;grid-template-columns:auto 1fr;gap:22px;padding:28px 26px;border-radius:24px;
  background:var(--glass);border:1.5px solid var(--line);transition:transform .4s var(--spring),border-color .4s var(--eo),box-shadow .4s var(--eo)}
.why-row:hover{transform:translateY(-4px);border-color:var(--line-hi);box-shadow:0 24px 60px -20px rgba(96,110,255,.4)}
.why-n{font-family:var(--f-head);font-weight:700;font-size:15px;letter-spacing:.06em;color:var(--accent);
  padding-top:3px;font-variant-numeric:tabular-nums}
.why-eyebrow{font-family:var(--f-body);font-size:12px;font-weight:600;letter-spacing:.15em;text-transform:uppercase;color:#cdd7ff}
.why-h{margin-top:9px;font-family:var(--f-head);font-weight:600;font-size:clamp(18px,2.3vw,22px);line-height:1.25;color:#fff}
.why-h em{font-style:normal;color:var(--accent)}
.why-row p{margin-top:12px;font-size:15px;line-height:1.62;color:var(--tx-body)}
.why-row p+p{margin-top:12px}
.why-row p a{color:var(--accent);text-decoration:underline;text-underline-offset:3px;text-decoration-color:rgba(169,186,255,.4)}
.why-row p a:hover{color:#fff}
@media (max-width:640px){.why-row{grid-template-columns:1fr;gap:8px;padding:24px 20px}.why-n{padding-top:0}}
/* Enterprise-readiness grid — 3-col yes/no/roadmap table */
.egrid{max-width:940px;margin:44px auto 0}
.egrid-tbl{border-radius:22px;overflow:hidden;border:1.5px solid var(--line);background:var(--glass)}
.egrid-row{display:grid;grid-template-columns:1.5fr 1fr 1fr;gap:0;border-bottom:1px solid rgba(163,177,255,.12)}
.egrid-row:last-child{border-bottom:0}
.egrid-row.head .egc{background:rgba(126,142,255,.08);font-family:var(--f-head);font-weight:600;font-size:13.5px;color:#fff}
.egc{padding:14px 18px;font-size:14.5px;color:var(--tx-body);display:flex;align-items:center;gap:9px}
.egc.feat{color:var(--tx-dim);font-weight:500}
.egc.col-remio{color:#fff}
.edot{flex:0 0 auto;width:7px;height:7px;border-radius:50%}
.edot.yes{background:#57e6c4;box-shadow:0 0 7px rgba(87,230,196,.7)}
.edot.no{background:rgba(206,212,246,.35)}
.edot.road{background:var(--accent);box-shadow:0 0 7px rgba(140,160,255,.6)}
.egrid-foot{margin-top:14px;font-size:13px;color:var(--tx-faint);text-align:center;line-height:1.5}
@media (max-width:640px){.egrid-row{grid-template-columns:1fr}.egc{border-bottom:1px solid rgba(163,177,255,.08)}
  .egc.feat{font-weight:600;color:#fff;background:rgba(126,142,255,.05)}
  .egrid-row.head{display:none}
  .egc:not(.feat)::before{content:attr(data-col);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--tx-faint);margin-right:auto}}
/* Sibling comparison strip */
.sibs{max-width:1000px;margin:40px auto 0;padding:0 32px;display:flex;flex-wrap:wrap;gap:10px;justify-content:center}
.sibs a{padding:9px 17px;border-radius:999px;background:var(--glass);border:1px solid var(--line);
  font-size:14px;color:var(--tx-body);transition:border-color .3s var(--eo),background .3s var(--eo),color .3s var(--eo)}
.sibs a:hover{border-color:var(--line-hi);background:var(--glass-hi);color:#fff}
/* FAQ details/summary (shared with faq.html) */
.faq-list{max-width:820px;margin:40px auto 0;display:flex;flex-direction:column;gap:12px}
.faq-item{border-radius:18px;background:var(--glass);border:1.5px solid var(--line);
  overflow:hidden;transition:border-color .3s var(--eo),background .3s var(--eo)}
.faq-item[open]{border-color:var(--line-hi);background:var(--glass-hi)}
.faq-item summary{list-style:none;cursor:pointer;padding:18px 22px;display:flex;align-items:center;
  justify-content:space-between;gap:16px;font-weight:600;font-size:16.5px;color:#fff}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary::after{content:"";flex:0 0 auto;width:11px;height:11px;
  border-right:2px solid var(--accent);border-bottom:2px solid var(--accent);
  transform:rotate(45deg) translateY(-2px);transition:transform .3s var(--eo)}
.faq-item[open] summary::after{transform:rotate(-135deg) translateY(-1px)}
.faq-answer{padding:0 22px 20px;font-size:15.5px;line-height:1.66;color:var(--tx-body)}
.faq-answer strong{color:#fff;font-weight:600}
.faq-answer a{color:var(--accent);text-decoration:underline;text-underline-offset:3px}
.link-more{max-width:1000px;margin:22px auto 0;padding:0 32px;font-size:15px;color:var(--tx-dim);text-align:center}
.link-more a{color:var(--accent);text-decoration:underline;text-underline-offset:3px}
.link-more a:hover{color:#fff}
@media (max-width:640px){.cmp-wrap{padding-left:20px;padding-right:20px}.cmp th,.cmp td{padding:12px 14px;font-size:14px}
  .sibs{padding-left:20px;padding-right:20px}.link-more{padding:0 20px}}