/* Global, cross-component responsive tweaks.
   Component-specific breakpoints live next to each component's own CSS. */

@media (max-width: 1240px) {
    :root { --container-width: 100%; }
}

@media (max-width: 991px) {
    :root { --header-height: 74px; }
    .section-padding,
    .services-section, .about-section, .smart-section,
    .why-us-section, .testimonials-section, .contact-section,
    .benefits-section, .services-list-section, .process-section,
    .gallery-section, .faq-section, .areas-section {
        padding: 70px 0;
    }
}

@media (max-width: 767px) {
    .container { padding: 0 20px; }
    .section-header { margin-bottom: 34px; }
    .cta-actions .button,
    .hero-actions .button { width: 100%; }

    /* Harmonize mobile layout: content that was left-aligned to sit next
       to a second grid column on desktop reads better centered once
       that column drops underneath on a single-column mobile layout. */
    .about-content,
    .smart-content,
    .contact-content,
    .landing-hero-content {
        text-align: center;
    }
    .about-content .button,
    .smart-actions { margin-left: auto; margin-right: auto; }
    .about-checklist { justify-items: center; }
    .about-checklist li { justify-content: center; }
    .smart-features { justify-items: center; }
    .smart-feature { max-width: 320px; }
    .smart-actions { justify-content: center; }
    .landing-hero-badges { justify-content: center; }
    .contact-info-list li { flex-direction: column; align-items: center; text-align: center; }

    .benefit-card { text-align: center; }
    .benefit-card__icon { margin-left: auto; margin-right: auto; }
    .service-card__body { text-align: center; }
    .service-card__icon { margin-left: auto; margin-right: auto; }
    .service-card__link { margin: 0 auto; }

    .footer-col { text-align: center; }
    .footer-col--brand { display: flex; flex-direction: column; align-items: center; }
    .footer-social { justify-content: center; }
    .footer-bottom-inner { justify-content: center; text-align: center; }
}