/* Page-specific: comparison-card grid + cost table alignment */
/* Shared by all /comparisons/ pages: tradify, servicem8, fergus */

.vs-cards { display: grid; grid-template-columns: 1fr 1fr; gap: 22px; }
.vs-card.is-chippie { border-color: var(--orange); border-width: 2px; }
.vs-card .vs-name { font-family: "Space Grotesk", sans-serif; font-weight: 700;
    font-size: 24px; margin-bottom: 10px; }
.vs-card .vs-price { font-family: "Space Grotesk", sans-serif; font-weight: 700;
    font-size: 44px; margin-bottom: 4px; }
.vs-card .vs-price small { font-size: 16px; color: var(--text-2);
    font-family: "General Sans", sans-serif; font-weight: 400; }
.vs-card .vs-sub { font-size: 15px; color: var(--text-2); margin-bottom: 14px; }
.vs-card ul { list-style: none; padding: 0; margin: 0 0 20px; }
.vs-card ul li { padding: 7px 0; font-size: 15px; }
.vs-card ul li i { margin-right: 8px; }
.vs-card ul li i.bi-check-circle-fill { color: var(--green-paid); }
.vs-card ul li i.bi-info-circle { color: var(--text-2); }
.compare-table td.num { text-align: right; }
.compare-table .save { color: var(--green-paid); font-weight: 700; }
.compare-table td.foot { color: var(--text-2); font-size: 13px; }
.quote-card { background: var(--white); border: 1px solid var(--border);
    border-radius: 12px; padding: 32px; }
.quote-card .stars i { color: var(--yellow); }
.quote-card .quote-text { font-size: 19px; line-height: 1.6; margin: 14px 0 18px; }
.quote-card .quote-who { display: flex; align-items: center; gap: 12px; }
.quote-card .quote-who i { font-size: 2.4rem; color: var(--text-2); }

/* FAQ accordion — native details/summary, no JS (Turbo-safe by construction) */
.faq-list { max-width: 760px; margin: 0 auto; }
.faq-item { background: var(--white); border: 1px solid var(--border);
    border-radius: 10px; margin-bottom: 10px; padding: 4px 18px; }
.faq-item summary { font-weight: 600; font-size: 15.5px; cursor: pointer;
    padding: 12px 0; }
.faq-item p { color: var(--text-2); font-size: 15px; margin: 0 0 14px; }

/* Facts-verified stamp under pricing tables and page foot */
.facts-note { font-size: 13px; color: var(--text-2); text-align: center;
    margin: 18px auto 0; max-width: 760px; }

/* Cross-link chips between comparison pages */
.more-compare { display: flex; flex-wrap: wrap; gap: 10px; justify-content: center; }
.more-compare a { display: inline-block; background: var(--white);
    border: 1px solid var(--border); border-radius: 999px; padding: 9px 18px;
    font-size: 14.5px; font-weight: 600; color: var(--black);
    text-decoration: none; }
.more-compare a:hover { border-color: var(--orange); color: var(--orange); }

@media (max-width: 880px) { .vs-cards { grid-template-columns: 1fr; } }