/* /compare/ hub and the Velisto vs Hootsuite, Buffer and Later pages
   (components/redesign/compare-page.tsx). Built on the scheduler lander's
   hero, answer, table, FAQ and closing styles; only the parts they lack
   live here. */
.cmp-hero{padding:48px 0 64px}
.cmp-hero h1{max-width:900px;text-wrap:balance}
.cmp-hero h1 span{display:inline-block;margin-top:10px;font-size:.62em;letter-spacing:-.035em;line-height:1.2}
.cmp-breadcrumb{display:flex;flex-wrap:wrap;gap:8px;font-size:.875rem;color:var(--muted);margin-bottom:28px}
.cmp-breadcrumb a{color:var(--muted)}
.cmp-breadcrumb a:hover{color:var(--purple)}
.cmp-answer{max-width:760px;margin:26px 0 30px}
.cmp-answer p{font-size:1.125rem;line-height:1.75;color:#40495e}
.cmp-answer p+p{margin-top:14px}
.cmp-table .lander-compare-table table{min-width:640px}
.cmp-table .lander-compare-table td,.cmp-table .lander-compare-table tbody th{vertical-align:top}
.cmp-table .lander-compare-table td:nth-child(2){color:var(--ink);font-weight:550}
.cmp-group th{background:var(--soft);color:var(--purple-deep);font-size:.8125rem;letter-spacing:.06em;text-transform:uppercase;font-weight:650}
.cmp-source{display:inline-block;margin-left:4px;font-size:.75rem;color:var(--muted);text-decoration:underline;text-underline-offset:2px}
.cmp-source:hover{color:var(--purple)}
.cmp-wins{padding:80px 0 30px}
.cmp-wins h2{font-size:clamp(1.9rem,3vw,2.5rem);line-height:1.18;letter-spacing:-.035em;max-width:760px;text-wrap:balance}
.cmp-wins-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;margin-top:36px}
.cmp-wins-grid article{border:1px solid var(--line);border-radius:var(--radius);padding:28px;background:#fff;display:flex;flex-direction:column;gap:14px}
.cmp-wins-grid h3{font-size:1.25rem;line-height:1.3;letter-spacing:-.02em}
.cmp-wins-grid h3 a{color:inherit}
.cmp-wins-grid p{font-size:1rem;line-height:1.7;color:#40495e;flex:1}
.cmp-hub-grid{margin-top:0}
.cmp-choose{padding:70px 0}
.cmp-choose-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:70px;align-items:start;border:1px solid var(--line);border-radius:var(--radius);background:var(--soft);padding:44px}
.cmp-choose h2{font-size:clamp(1.7rem,2.6vw,2.2rem);line-height:1.2;letter-spacing:-.03em}
.cmp-choose p{font-size:1.0625rem;color:#40495e;margin-bottom:12px}
.cmp-choose ul{display:grid;gap:10px;padding-left:1.2em;list-style:disc}
.cmp-choose li{font-size:1.0625rem;line-height:1.7;color:#40495e}
.cmp-steps{display:grid;gap:12px;padding-left:1.3em;list-style:decimal}
.cmp-steps li{font-size:1.0625rem;line-height:1.7;color:#40495e}
@media(max-width:1000px){.cmp-wins-grid{grid-template-columns:1fr 1fr}}
@media(max-width:850px){.cmp-choose-grid{grid-template-columns:1fr;gap:20px;padding:30px}}
@media(max-width:640px){.cmp-hero{padding:30px 0 44px}.cmp-wins{padding:56px 0 20px}.cmp-wins-grid{grid-template-columns:1fr}.cmp-wins-grid article{padding:22px}.cmp-choose{padding:50px 0}.cmp-answer p{font-size:1.0625rem}}
.compare-page .faq-intro a:not(.text-link),.compare-page .lander-compare-note a{color:var(--purple);text-decoration:underline;text-underline-offset:3px}
@media(min-width:1001px){.cmp-wins-grid article:last-child:nth-child(3n+1){grid-column:1/-1}}