/* Responsive 
Design pour tout le sites web
 */
 @media (max-width: 992px) {
     .contact-container {
         grid-template-columns: 1fr;
     }

     .hero h2 {
         font-size: 2rem;
     }
 }

 @media (max-width: 768px) {
     .header-container {
         flex-direction: column;
     }

     .logo {
         margin-bottom: 15px;
     }

     nav ul {
         flex-wrap: wrap;
         justify-content: center;
     }

     nav ul li {
         margin: 0 10px 10px;
     }

     section {
         padding: 60px 0;
     }
 }

 @media (max-width: 576px) {

     .services-grid,
     .projets-grid,
     .blog-grid {
         grid-template-columns: 1fr;
     }

     .hero {
         padding: 70px 0;
     }

     .hero h2 {
         font-size: 1.8rem;
     }
 }