/*
 * Customer Satisfaction — responsive fix.
 * log-satisfaction-extra.css unconditionally redeclares a batch of layout
 * selectors (no media guard), and since it loads after log-satisfaction.css
 * with equal selector specificity, those unconditional rules silently kill
 * log-satisfaction.css's own responsive breakpoints for the same selectors
 * at every width, including mobile (confirmed live: 3-col .pillar-grid
 * squeezed into a 390px viewport, text wrapping one character per line).
 * Re-declaring the breakpoints here (loaded last) restores them without
 * touching either source file. Audited every selector in the reference's
 * own RESPONSIVE block against extra.css's unconditional rules to find
 * the full collision set below — not just the grid-template-columns ones.
 */
@media (max-width: 980px) {
    .promise-intro { grid-template-columns: 1fr; }
    .pillar-grid { grid-template-columns: 1fr 1fr; }
    .faq-grid { grid-template-columns: 1fr; }
    .pledge-items { grid-template-columns: 1fr 1fr; }
    .quality-wrap { grid-template-columns: 1fr; }
    .q-left { border-right: none; border-bottom: 1px solid rgba(255, 255, 255, .08); }
    .trust-bento { grid-template-columns: 1fr 1fr; }
    .trust-bento-row2 { grid-template-columns: 1fr; }
    .testi-grid { grid-template-columns: 1fr; }
    .testi-card:nth-child(2),
    .testi-card:nth-child(3) { margin-top: 0; }
    .contact-band { padding: 52px 24px; }
    .contact-band-grid { flex-direction: column; align-items: flex-start; }
}

@media (max-width: 760px) {
    .pillar-grid { grid-template-columns: 1fr; }
    .pledge-items { grid-template-columns: 1fr; }
    .pledge-item { border-right: none; border-top: 1px solid var(--line); }
    .pledge-item:first-child { border-top: none; }
    .trust-bento { grid-template-columns: 1fr; }
    .tl-steps { grid-template-columns: 1fr 1fr; }
    .tl-steps::before { display: none; }
    .q-metrics { margin-top: 20px; }
}