/* ============================================================
   Калькулятор долей по маткапиталу (/calc.php)
   Базовые стили страницы живут в css.css (не трогаем — WIP);
   здесь — подсказка формы и SEO-блоки (инфо, таблица, FAQ).
   ============================================================ */
.calc-field__hint {
    display: block; margin-top: 6px;
    font-size: 13px; line-height: 1.45; color: var(--color-text-muted);
}

/* --- SEO-блоки под калькулятором --- */
.calc-info { margin-top: var(--spacing-lg); }
.calc-info__title { font-size: 22px; margin: 0 0 12px; text-align: center; }
.calc-info p { margin: 0 0 12px; color: var(--color-text-light); line-height: 1.6; }
.calc-info__table-wrap { overflow-x: auto; }
.calc-info__table { width: 100%; border-collapse: collapse; margin: 4px 0 10px; }
.calc-info__table td {
    padding: 10px 14px; border-bottom: 1px solid rgba(0, 0, 0, .08);
    font-size: 15px; color: var(--color-text-light);
}
.calc-info__table td:last-child { white-space: nowrap; font-weight: 600; color: var(--color-dark); }
.calc-info__note { font-size: 13px; color: var(--color-text-muted); }

.calc-faq { margin-top: var(--spacing-lg); }
.calc-faq__item {
    border: 1px solid rgba(0, 0, 0, .08); border-radius: 12px;
    padding: 0 16px; margin-bottom: 10px; background: #fff;
}
.calc-faq__item summary {
    cursor: pointer; list-style: none; position: relative;
    padding: 14px 32px 14px 0; font-weight: 600; color: var(--color-dark);
}
.calc-faq__item summary::-webkit-details-marker { display: none; }
.calc-faq__item summary::after {
    content: ''; position: absolute; right: 4px; top: 50%;
    width: 8px; height: 8px; border-right: 2px solid var(--color-text-muted);
    border-bottom: 2px solid var(--color-text-muted);
    transform: translateY(-70%) rotate(45deg); transition: transform 160ms ease;
}
.calc-faq__item[open] summary::after { transform: translateY(-30%) rotate(225deg); }
.calc-faq__item p { margin: 0 0 14px; color: var(--color-text-light); line-height: 1.6; }