/* ==================== BODY & GLOBAL ==================== */
body {
    /* Fusion des deux définitions du body */
    scroll-behavior: smooth;
    font-family: 'Arial', sans-serif;
  
    /* Fond dégradé + logo SASP */
    background-color: #007bff; 
    background-image: linear-gradient(rgba(0, 0, 0, 0.9), rgba(0, 0, 0, 0.9)), url('images/Logo_SASP.png'); 
    background-repeat: no-repeat; 
    background-position: center 35%;
    background-size: contain; 
  }
  
  /* Pour lisser l’ancrage quand on clique sur un lien (#id) */
  section,
  header {
    scroll-margin-top: 4.6875rem; /* Évite que le contenu soit caché sous la navbar */
  }
  
  /* ==================== HEADER ==================== */
  header {
    display: flex;
    justify-content: center;
    align-items: center;
    box-shadow: 0 0.25rem 0.5rem rgba(0,0,0,0.1);
  }
  
  /* Centrage des liens dans la navbar */
  .navbar-nav {
    margin: 0 auto;
  }
  
  /* ==================== HERO / HOME ==================== */
  #home {
    /* Hero en fond */
    background: linear-gradient(rgba(0,0,0,0.6), rgba(0,0,0,0.6)), 
                url('images/imagebg.png') no-repeat center center/cover;
    height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    color: white;
  }
  
  /* Alternative à #home si vous avez une classe .hero */
  .hero {
    color: white;
    height: 60vh;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
  }
  
  .hero h1 {
    font-size: 3rem;
  }
  
  /* Titres, textes dans la section #home */
  #home h2 {
    font-size: 4rem;
    font-weight: bold;
  }
  #home p {
    font-size: 1.2rem;
    margin-bottom: 2rem;
  }
  
  /* ==================== SECTIONS GÉNÉRALES ==================== */
  .section-title {
    margin-bottom: 2rem;
    font-size: 2rem;
    font-weight: bold;
    text-transform: uppercase;
  }
  
  .requirements {
    background: #f8f9fa;
    padding: 2rem;
    border-radius: 0.5rem;
  }
  
  /* ==================== SERVICES BOX ==================== */
  .service-box {
    padding: 2rem;
    background: #002752;
    border-radius: 0.625rem;
    box-shadow: 0 0.25rem 0.5rem rgba(0,0,0,0.1);
    transition: transform 0.3s ease-in-out;
  }
  .service-box:hover {
    transform: translateY(-0.3125rem);
    background: #005ab4;
  }
  
  /* ==================== RECRUITMENT ==================== */
  #recruitment {
    background: linear-gradient(135deg, #6c757d, #495057);
  }
  #recruitment p {
    font-size: 1.2rem;
  }
  .apply-form {
    max-width: 37.5rem;
    margin: 0 auto;
  }
  
  /* ==================== CONTACT ==================== */
  #contact form {
    max-width: 37.5rem;
  }
  
  /* ==================== FOOTER ==================== */
  footer {
    background: #343a40;
    color: #f8f9fa;
    padding: 1rem 0;
  }
  footer p {
    margin: 0;
  }
  
  /* ==================== BOUTONS PERSONNALISÉS ==================== */
  .btn-custom {
    background-color: #007bff;
    color: #fff;
    transition: background-color 0.3s ease;
  }
  .btn-custom:hover {
    background-color: #0056b3;
  }
  
  /* ==================== PRÉSENTATION ==================== */
  #presentation {
    background-color: #000b18;
    padding: 3.75rem 0; 
  }
  #presentation .section-title {
    /* Surchage la section-title par défaut */
    font-size: 2.5rem; 
    font-weight: bold;
    text-transform: uppercase;
    color: #343a40; 
    margin-bottom: 1.875rem;
  }
  
  /* Highlight dans la présentation */
  #presentation .highlight {
    background-color: #34343a; 
    padding: 1.875rem;
    border-radius: 0.5rem;
    margin-bottom: 2.5rem;
  }
  #presentation .highlight p {
    font-size: 1.2rem;
    line-height: 1.6;
    color: #495057; 
  }
  
  /* Listes : Missions, Valeurs */
  #presentation .mission-list,
  #presentation .value-list {
    list-style-type: none;
    padding-left: 0;
    margin-bottom: 1.875rem;
  }
  #presentation .mission-list li,
  #presentation .value-list li {
    font-size: 1.1rem;
    line-height: 1.6;
    color: #495057;
    padding-left: 1.25rem;
    position: relative;
  }
  #presentation .mission-list li::before,
  #presentation .value-list li::before {
    content: '•';
    font-size: 1.5rem;
    position: absolute;
    left: 0;
    top: 0;
  }
  
  /* Cartes de la présentation */
  #presentation .row {
    margin-top: 2.5rem;
  }
  #presentation .card {
    border: none;
    border-radius: 0.5rem;
    transition: transform 0.3s ease, background-color 0.3s ease;
    box-shadow: 0 0.25rem 0.5rem rgba(0,0,0,0.1);
  }
  #presentation .card-body {
    padding: 1.875rem;
  }
  #presentation .card:hover {
    transform: translateY(-0.3125rem); 
  }
  #presentation .card-title {
    font-size: 1.5rem;
    font-weight: bold;
    margin-bottom: 1.25rem;
  }
  #presentation .card-text {
    font-size: 1rem;
    color: #343a40;
    line-height: 1.6;
  }
  
  /* Exemples de cartes de couleur */
  #presentation .card.bg-info {
    background-color: #0f6b79;
    color: white;
  }
  #presentation .card.bg-success {
    background-color: #155724;
    color: white;
  }
  #presentation .card.bg-warning {
    background-color: #635016;
    color: #343a40;
  }
  #presentation .card.bg-info:hover {
    background-color: #407077;
  }
  #presentation .card.bg-success:hover {
    background-color: #0d461a;
  }
  #presentation .card.bg-warning:hover {
    background-color: #3f320c;
  }
  
  /* Textes divers */
  #presentation p {
    font-size: 1.1rem;
    line-height: 1.6;
    margin-bottom: 1.25rem;
  }
  #presentation ul {
    margin-bottom: 1.875rem;
  }