/* styles-compare.css — подключается отдельно от styles.css, см. App\Support\SiteCss. */

/* Страницы сравнения сервисов: /compare */
.compare-answer p {
    font-size: 1.02rem;
    line-height: 1.7;
}

.compare-answer p:last-child {
    margin-bottom: 1.35rem;
}

.compare-cta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 12px;
    margin: 0 0 0.85rem;
}

/*
 * Кнопки лежат внутри .store-page-body, где `.store-page-body a` перекрашивает
 * ссылки и добавляет подчёркивание. Возвращаем кнопкам их собственный вид.
 */
.compare-page .store-page-body .compare-cta a.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 2px solid transparent;
    font-weight: 600;
}

.compare-page .store-page-body .compare-cta a.btn-primary,
.compare-page .store-page-body .compare-cta a.btn-primary:hover {
    color: #fff;
}

.compare-page .store-page-body .compare-cta a.btn-outline {
    border-color: var(--primary-purple);
    color: var(--primary-purple);
}

.compare-page .store-page-body .compare-cta a.btn-outline:hover {
    background: var(--primary-purple);
    color: #fff;
}

.compare-cta-note {
    margin: 0;
    font-size: 0.9rem;
    line-height: 1.5;
    color: var(--light-text);
}

/* Если карточек преимуществ нечётное число, последняя занимает всю ширину строки */
.compare-page .store-plus-grid > :last-child:nth-child(odd) {
    grid-column: 1 / -1;
}

/* Упоминание стороннего сервиса: адрес лежит в data-link, переход навешивает script.js */
.compare-page .store-page-body a[data-link]:not([href]) {
    cursor: pointer;
}

.compare-page .compare-disclaimer {
    background: rgba(156, 39, 176, 0.04);
}

.compare-page .compare-disclaimer p {
    font-size: 0.95rem;
    color: var(--light-text);
}

@media (max-width: 767px) {
    .compare-cta {
        flex-direction: column;
    }

    .compare-cta .btn {
        width: 100%;
        text-align: center;
    }
}