/* residential-flex.responsive.css
 * Supplemental responsive overrides for the rflex-* component family.
 * Primary breakpoints are in residential-flex.css.
 * This file handles edge cases and pricing-page-specific responsive rules.
 */

/* ── Pricing page section spacing on small screens ── */
@media (max-width: 992px) {
    .rflex-pr-section { padding: 4rem 0; }
    .rflex-pr-section--alt { padding: 4rem 0; }
    .rflex-tradeoffs.rflex-pr-section { padding: 4rem 0; }
}

@media (max-width: 768px) {
    .rflex-pr-section { padding: 3rem 0; }
    .rflex-pr-section--alt { padding: 3rem 0; }
    .rflex-included-list { grid-template-columns: 1fr; }
    .rflex-pricing-card { margin-left: auto; margin-right: auto; }
}

@media (max-width: 480px) {
    .rflex-pricing-card { padding: 1.5rem 1.25rem; }
    .rflex-pricing-card__amount { font-size: 3.25rem; }
    .rflex-hero__ledger-amount { font-size: clamp(2.75rem, 14vw, 4rem); }
}