/*
 * Сторінка «Розтермінування»
 *
 * Зібрана з готового: .phero (main.css), .stats, .section-head,
 * .entry-card--static, .data-table (ui.css) і глобальна CTA.
 * Своє тут — ритм секції, сітка будинків і дрібні поправки картки.
 *
 * Чергування фонів: герой (subtle) → сітка canvas → CTA elevated.
 */

.rz-hero__stats { margin-top: 6px; }

.rz-houses {
    padding:    var(--section-gap) 0;
    background: var(--bg-canvas);
}
.rz-houses__inner {
    display:        flex;
    flex-direction: column;
    align-items:    center;
    gap:            60px;
}
.rz-houses__grid {
    display:               grid;
    grid-template-columns: repeat(2, 1fr);
    gap:                   28px;
    width:                 100%;
}

/* Картка будинку — .entry-card з ui.css. Тіло щільніше, ніж у типовій
   картці запису: тут не анонс, а специфікація, і таблиця має дихати. */
.rz-house__body { gap: 22px; }

.rz-house__header {
    display:        flex;
    flex-direction: column;
    gap:            6px;
}
.rz-house__date { margin: 0; }
.rz-house__date-value {
    color:       var(--text-secondary);
    font-weight: 600;
}

/* Примітка — приглушена, а не золота: вона уточнює умови, а не є акцентом.
   Золотим тут уже позначений тільки термін у таблиці.
   До низу картки притиснуті вже дії (.entry-card__actions), тому примітка
   лишається одразу під таблицею. */
.rz-house__note {
    margin:      0;
    padding-top: 4px;
    color:       var(--text-muted);
}
.rz-house__actions { margin-bottom: 0; }

/* ── Адаптація ──────────────────────────────────────────────────────────── */
@media (max-width: 1024px) {
    .rz-houses       { padding: 80px 0; }
    .rz-houses__inner { gap: 44px; }
    .rz-houses__grid { gap: 20px; }
}

/* 900px — той самий поріг, що всюди: нижче цього дві картки з
   чотириколонковою таблицею всередині не вміщають заголовки колонок. */
@media (max-width: 900px) {
    .rz-houses__grid { grid-template-columns: 1fr; }
}

@media (max-width: 768px) {
    .rz-houses       { padding: 64px 0; }
    .rz-houses__inner { gap: 32px; }
    .rz-house__body  { gap: 18px; }
}

@media (max-width: 480px) {
    .rz-houses { padding: 48px 0; }
}