/* ------------------------------
   HERO IMAGE
------------------------------ */
/* Note : Les règles de base de .hero-image sont déjà dans main.css, 
   on ne garde ici que la hauteur maximale spécifique à l'accueil si nécessaire */
   .hero-image {
    max-height: 420px;
  }
  
  /* ------------------------------
     INTRO
  ------------------------------ */
  .home-intro {
    text-align: center;
    margin: 40px auto 30px;
    max-width: 700px;
  }
  
  .home-intro h1 {
    color: #1A3D6B;
    margin-bottom: 10px;
  }
  
  .hero-tagline {
    font-size: 1.1rem;
    color: #444;
  }
  
  /* ------------------------------
     SERVICES
  ------------------------------ */
  .home-services {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 25px;
    max-width: 900px;
    margin: 40px auto;
  }
  
  .service {
    background: #f5f8fc;
    padding: 20px;
    border-radius: 6px;
    border-left: 4px solid #1A3D6B;
  }
  
  .service h3 {
    color: #1A3D6B;
    margin-bottom: 10px;
  }
  
  .service p {
    color: #444;
    margin-bottom: 10px;
  }
  
  .service a {
    color: #1A3D6B;
    font-weight: 600;
    text-decoration: none;
  }
  
  .service a:hover {
    text-decoration: underline;
  }
  
  /* ------------------------------
     RESPONSIVE
  ------------------------------ */
  @media (max-width: 768px) {
    .hero-image {
      max-height: 500px;
    }
  
    .home-services {
      grid-template-columns: 1fr;
      gap: 20px;
    }
  
    .home-intro {
      margin-top: 25px;
    }
  }