/* ==========================================================================
   Services Responsive Media Queries
   Extracted from css/services.css
   ========================================================================== */

@media (max-width: 1100px) {
    .services-grid-page {
        grid-template-columns: repeat(3, 1fr);
        gap: 20px;
    }
}

@media (max-width: 860px) {
    .services-grid-page {
        grid-template-columns: repeat(2, 1fr);
        gap: 18px;
    }
}

@media (max-width: 640px) {
    .services-grid-page {
        grid-template-columns: repeat(2, 1fr);
        gap: 12px;
    }
    
    .service-card-alt {
        padding: 16px 12px;
        border-radius: 16px;
    }
}

@media (max-width: 1024px) {
    .services-hero h1 {
        font-size: 52px;
    }
}

@media (max-width: 768px) {
    .services-hero {
        padding: 140px 0 80px;
    }

    .services-hero h1 {
        font-size: 40px;
    }

    .services-hero p {
        font-size: 18px;
    }

    .section-title h2 {
        font-size: 32px;
    }

    .cta-banner h2 {
        font-size: 36px;
    }
}