/* rents — page-local rules for /rents and /rents/:community. Token-only; shared components live
   in chrome.css. .section-title/.section-intro are page-local site-wide (D3 divergent copies;
   chrome.css scopes them only under .faq-cta) — community.css's values, verbatim.
   .section-header/.section-sub/.card were undefined for this page (RENTS_TREND_SSR emitted them
   unstyled); .card/.op-card/.rent-or-buy mirror community.css verbatim so the reused
   renderCommunityRentsCard renders as it does on the community page. No universal reset (D3). */
.section-header { display: flex; align-items: baseline; justify-content: space-between; margin-bottom: 16px; flex-wrap: wrap; gap: 8px; }
.section-sub { font-size: var(--fs-2); color: var(--text-muted); }
.section-title { font-family: 'Inter Tight', 'Inter', sans-serif; font-size: var(--fs-6); font-weight: 700; letter-spacing: -.025em; color: var(--text); margin: 0 0 8px; }
.section-intro { color: var(--text-muted); font-size: var(--fs-3); line-height: 1.65; margin: 0 0 16px; max-width: 60ch; }
.card { background: var(--surface); border: 1px solid var(--card-border); border-radius: var(--radius-xl); padding: 22px; box-shadow: var(--shadow), var(--highlight); }

/* The reused rents card (renderCommunityRentsCard) — community.css verbatim, so it renders as on the community page */
.op-card { padding: 0; overflow: hidden; }

/* R6-4 rent-or-buy arithmetic, inside the reused rents card (community.css verbatim) */
.rent-or-buy { border-top: 1px solid var(--border); padding: 14px 20px 0; }
.rent-or-buy .op-sub-title { font-size: var(--fs-2); font-weight: 600; margin: 0 0 6px; color: var(--text); }
.rent-or-buy p { margin: 0 0 10px; line-height: 1.55; }
.rent-or-buy .op-foot { border-top: 0; padding: 0 0 12px; }

/* Per-community page body (the links back to sales data / the directory) */
.rents-community-links { display: flex; gap: 16px; flex-wrap: wrap; margin-top: 16px; font-size: var(--fs-2); font-weight: 600; }

/* Rent check (section 3) — a plain GET form + a factual result card, no verdict wording */
.rent-check-form { margin-top: 4px; }
.rent-check-result { margin-top: 16px; }
.rent-check-result p { font-size: var(--fs-3); line-height: 1.65; color: var(--text-muted); margin: 0 0 10px; }
.rent-check-result p:last-child { margin-bottom: 0; }
.rent-check-pct strong { color: var(--text); }