/* Vendor comparison layout. Shared brand tokens, page head, panel, and buttons come
   from the active design system; this file only supplies route-specific composition. */
.versus-content{padding-block:10px 64px}
.versus-content .wfg-page-head{margin-bottom:12px}
.versus-content .wfg-panel{max-width:none}
.versus-content .wfg-panel-title{margin-bottom:0}
.versus-answer-body{padding-top:3px}
.versus-answer-body>p{max-width:72ch;margin:0;color:var(--ink-2);line-height:1.55}
.versus-answer-body strong{color:var(--ink)}
/* TL;DR rows: one line per guide on wide screens (RestedXP, then Zygor), one column on phones. */
.versus-answer-body .wfg-facts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:28px;margin-block:8px 12px;border-block:1px solid var(--hairline)}
.versus-answer-body .wfg-facts>.wfg-fact:nth-child(2){border-top:0}
.versus-answer-body .wfg-btn--enter{white-space:nowrap}
/* The comparison beside the shared table of contents (guideFrame): the grid fills the page
   column it sits in. */
.versus-content>.versus-frame{width:100%;margin-top:28px}
.versus-frame>.guide-aside{padding-top:0}
.versus-article{max-width:none}
.versus-article>*:not(.table-scroll){max-width:66ch}
.versus-article>h2{max-width:24ch;margin:56px 0 12px;color:var(--ink);font:var(--heading-weight) clamp(1.4rem,2.6vw,1.75rem)/1.2 var(--font-heading);letter-spacing:0;text-wrap:balance}
.versus-article>h2:first-child{margin-top:0}
.versus-article>h3{max-width:42ch;margin:25px 0 9px;color:var(--ink);font:var(--heading-weight) 1.65rem/1.2 var(--font-heading);letter-spacing:0}
.versus-article>p{margin:0 0 13px;color:var(--ink-2);font-size:1rem;line-height:1.6}
.versus-article p a,.versus-article li a,.versus-article table a{color:var(--accent);text-decoration:underline;text-underline-offset:2px;overflow-wrap:anywhere}
.versus-article ul{margin:12px 0 0;padding-left:1.3rem}
.versus-article li{padding-block:3px}
.versus-article .article-figure{max-width:min(100%,40rem);margin:14px 0 22px}
.versus-article .article-figure img{display:block;max-width:100%;background:var(--panel);border:1px solid var(--edge);box-shadow:var(--shadow-inner)}
.versus-article .article-figure figcaption{max-width:66ch;margin-top:7px;color:var(--ink-3);font-size:.86rem;line-height:1.4}
.versus-table-hint{display:none;color:var(--ink-3);font:400 .88rem/1.4 var(--font-ui)}
.versus-article .table-scroll{max-width:100%;margin:15px 0 12px;overflow-x:auto}
.versus-article table{width:100%;min-width:43rem}
.versus-article table th:first-child,.versus-article table td:first-child{width:21%;color:var(--ink);white-space:normal}
.versus-partners{margin-top:56px}
.versus-partners>h2{max-width:24ch;margin:14px 0;color:var(--ink);font:var(--heading-weight) clamp(1.4rem,2.6vw,1.75rem)/1.2 var(--font-heading);letter-spacing:0}
.versus-offers{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.versus-offer{min-width:0;padding:13px;border:1px solid var(--edge);background:var(--panel);box-shadow:var(--shadow-inner)}
.versus-offer h3{margin:0;color:var(--ink);font:var(--heading-weight) 1.7rem/1.25 var(--font-heading);letter-spacing:0}
.versus-offer p{max-width:38ch;margin:8px 0 13px;color:var(--ink-2);line-height:1.5}
.versus-content .source-block{max-width:none;margin-top:56px;padding:13px}
.versus-content .source-block h2{margin:0 0 10px;color:var(--ink);font:var(--heading-weight) 1.65rem/1.2 var(--font-heading);text-transform:none;letter-spacing:0}
.versus-content .source-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:5px 26px;color:var(--ink-2);font:400 .91rem/1.4 var(--font-ui)}
.versus-content .source-list li{padding-block:4px;overflow-wrap:anywhere}
@media(max-width:760px){
  .versus-content{padding-block:8px 46px}
  .versus-answer-body .wfg-facts{grid-template-columns:1fr}
  .versus-answer-body .wfg-facts>.wfg-fact:nth-child(2){border-top:1px solid var(--hairline)}
  .versus-article>h2{margin-top:32px}
  .versus-article .table-scroll{margin-top:10px}
  .versus-table-hint{display:block;margin:8px 0 -3px}
  .versus-offers,.versus-content .source-list{grid-template-columns:1fr}
  .versus-partners,.versus-content .source-block{margin-top:32px}
}
/* The partner CTA (components/partner-cta.css) right under the TL;DR. */
.versus-top{display:grid;gap:12px;align-items:start}