/* A AJOUTER */
@media (max-width: 767.98px) {
  .navbar-collapse.collapse {
    display: none !important;
  }
  .navbar-collapse.collapse.show {
    display: block !important;
  }
}



  /* centre le wrapper dans la collapse */
  #navHeaderCollapse {
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative; /* pour le translateX futur */
  }

  /* le wrapper s'adapte à son contenu */
  #navFlexWrapper {
    display: flex;
    align-items: center;
    transition: transform 0.2s ease;
  }

  /* espacements autour du logo */
  #navFlexWrapper .navbar-brand {
    flex: 0 0 auto;  /* taille auto */
  }

  /* les menus ne s'étirent pas */
  #navFlexWrapper .navbar-nav {
    flex: 0 0 auto;
    display: flex;
    gap: 1rem;
  }

  

  
  #page_header_bloc_1_id_navbartop_texte_gauche {
    color: black;
    font-family: 'Salma Alfasans';
    font-size: 15px;
    font-weight: 300;
    font-style: normal;
    text-align: center;
  }
  

  
  #page_header_bloc_1_id_navbartop_texte_droite {
    color: black;
    font-family: 'Salma Alfasans';
    font-size: 15px;
    font-weight: 300;
    font-style: normal;
    text-align: center;
  }
  

  .bi {
    transition: transform 0.3s ease, opacity 0.3s ease;
  }

  #btn-contact {
    background-color: #F4ACB8;
    color: black;
    border-radius: 20px;
    border: none;
    padding: 2px 20px;
    font-family: 'Salma Alfasans';
    font-size: 15px;
    font-weight: 300;
    font-style: normal;
    text-align: center;
  }

  #btn-contact:hover {
    background-color: rgba(216,227,220,1.0);
  }

  .btn-group-right {
    position: absolute;
    right: 15px; /* Ajustez selon vos besoins */
    top: 50%;
    transform: translateY(-50%);
    display: flex;
    align-items: center;
  }

  @media (max-width: 768px) {
    .btn-group-right {
      position: relative;
      right: auto;
      top: 0;
      transform: none;
      display: block;
    }
  }

  #main-navbar {
     padding: 0;
  }

  #main-navbar > .container-fluid {
    padding: 0;
    background-color: #D8E3DC;
    border-bottom: 8px solid white;
    padding: 5px 0;
  }

  #id_navbar_top {
    background-color: #F4ACB8;
    border-bottom: 8px solid white;
    border-top: 8px solid white;
    padding: 0px 10px;
    font-family: 'Salma Alfasans';
    font-size: 15px;
    font-weight: 300;
    font-style: normal;
    text-align: center;
    color: black;
  }

  .nav-link-header {
    color: black;
    text-decoration: none;
    font-family: 'Salma Alfasans';
    font-size: 15px;
    font-weight: 300;
    font-style: normal;
    text-align: center;
  }

  .nav-link-header:hover {
    text-decoration: underline;
    text-decoration-color: black;
  }

  /* Color of the navbar AFTER scroll */
  .navbar-after-scroll {
    background-color: #D8E3DC;
  }

  /* Transition after scrolling */
  .navbar-after-scroll {
    transition: background 0.5s ease-in-out, padding 0.5s ease-in-out;
  }

  /* Transition to the initial state */
  .navbar-before-scroll {
    transition: background 0.5s ease-in-out, padding 0.5s ease-in-out;
  }

  /* An optional height of the navbar AFTER scroll */
  .navbar.navbar-before-scroll.navbar-after-scroll {
    /*padding-top: 5px;*/
    padding-bottom: 5px;
  }

  /* Lorsque la navbar est ouverte (collapse avec classe "show") */
  #navHeaderCollapse.show .btn-group-right {
    margin-top: 200px;
  }

  /* Lorsque la navbar est fermée (sans la classe "show") */
  #navHeaderCollapse:not(.show) .btn-group-right {
    margin-top: 0;
  }

  /* Navbar on mobile */
  @media (max-width: 991.98px) {
    #main-navbar > .container-fluid {
    padding: 0;
    background-color: #D8E3DC;
    border-bottom: 17px solid white;
  }
  
    /* Lorsque le collapse est ouvert, appliquer margin-bottom:40px */
    #navHeaderCollapse.show .btn-group-right {
      margin-bottom: 40px !important;
    }

    /* Lorsque le collapse est fermé, remettre margin-bottom à 0 */
    #navHeaderCollapse:not(.show) .btn-group-right {
      margin-bottom: 0 !important;
    }
  }

  /* Responsive font sizes for textes */
  @media (max-width: 576px) {
    
    #page_header_bloc_1_id_navbartop_texte_gauche { font-size: valeur; }
    

    
    #page_header_bloc_1_id_navbartop_texte_droite { font-size: valeur; }
    
  }

  @media (min-width: 576px) {
    
    #page_header_bloc_1_id_navbartop_texte_gauche { font-size: valeur; }
    

    
    #page_header_bloc_1_id_navbartop_texte_droite { font-size: valeur; }
    
  }

  @media (min-width: 768px) {
    
    #page_header_bloc_1_id_navbartop_texte_gauche { font-size: attribut__page_header_bloc_1_id_navbartop_texte_gauche__size_min_768px__font_size; }
    

    
    #page_header_bloc_1_id_navbartop_texte_droite { font-size: attribut__page_header_bloc_1_id_navbartop_texte_droite__size_min_768px__font_size; }
    
  }

  @media (min-width: 992px) {
    
    #page_header_bloc_1_id_navbartop_texte_gauche { font-size: valeur; }
    

    
    #page_header_bloc_1_id_navbartop_texte_droite { font-size: valeur; }
    
  }

  @media (min-width: 1200px) {
    
    #page_header_bloc_1_id_navbartop_texte_gauche { font-size: valeur; }
    

    
    #page_header_bloc_1_id_navbartop_texte_droite { font-size: valeur; }
    
  }

  @media (min-width: 1400px) {
    
    #page_header_bloc_1_id_navbartop_texte_gauche { font-size: valeur; }
    

    
    #page_header_bloc_1_id_navbartop_texte_droite { font-size: valeur; }
    
  }
            

  /* Base styles */
  #page_footer_bloc_1 {
    margin: 0;
    background-color: rgba(158,129,137,1.0);
    background-size: cover;
    background-position: center;
    border-top: 17px solid rgba(255, 255, 255, 1);
    font-family: 'Salma Alfasans';
    font-size: 15px;
    font-weight: 300;
    font-style: normal;
    text-align: center;
  }

  #page_footer_bloc_1_page_footer_bloc_1_id_nav > ul > li.nav-item > .nav-link {
    color: white;
  }
  #page_footer_bloc_1_page_footer_bloc_1_id_nav > ul > li.nav-item > .nav-link:hover {
    color: black;
  }
  
  #page_footer_bloc_1_id_hr {
    opacity: 1;

    /* on enlève toute bordure par défaut */
    border: none;

    /* on fixe la hauteur du trait */
    height: 1px;

    /* on met un fond 100% blanc (alpha = 1) */
    background-color: rgba(255, 255, 255, 1);

    /* marges gauche/droite */
    margin-left: 10%;
    margin-right: 10%;
  }
  
  #attribut__page_footer_bloc_1_page_footer_bloc_1_id_signature_texte__text_contenu,
  #attribut__page_footer_bloc_1_page_footer_bloc_1_id_signature_texte__text_contenu * {
    color: white;
    text-decoration: none;
  }

  /* Responsive typography & spacing */
  @media (max-width: 576px) {
    
    #page_footer_bloc_1_id_lien_1 { font-size: 18px; }
    
    
    #page_footer_bloc_1_id_lien_2 { font-size: 18px; }
    
    
    #page_footer_bloc_1_id_lien_3 { font-size: 18px; }
    
    
    #page_footer_bloc_1_id_lien_4 { font-size: 18px; }
    
    
    #page_footer_bloc_1_id_lien_5 { font-size: 18px; }
    
    
    #page_footer_bloc_1_id_lien_6 { font-size: 18px; }
    
    #page_footer_bloc_1 {
      padding-top: 20px;
      padding-right: 23px;
      padding-bottom: 26px;
      padding-left: 18px;
    }
  }

  @media (min-width: 576px) {
    
    #page_footer_bloc_1_id_lien_1 { font-size: 18px; }
    
    
    #page_footer_bloc_1_id_lien_2 { font-size: 18px; }
    
    
    #page_footer_bloc_1_id_lien_3 { font-size: 18px; }
    
    
    #page_footer_bloc_1_id_lien_4 { font-size: 18px; }
    
    
    #page_footer_bloc_1_id_lien_5 { font-size: 18px; }
    
    
    #page_footer_bloc_1_id_lien_6 { font-size: 18px; }
    
    #page_footer_bloc_1 {
      padding-top: 20px;
      padding-right: 23px;
      padding-bottom: 26px;
      padding-left: 18px;
    }
  }

  @media (min-width: 768px) {
    
    #page_footer_bloc_1_id_lien_1 { font-size: 19px; }
    
    
    #page_footer_bloc_1_id_lien_2 { font-size: 19px; }
    
    
    #page_footer_bloc_1_id_lien_3 { font-size: 19px; }
    
    
    #page_footer_bloc_1_id_lien_4 { font-size: 19px; }
    
    
    #page_footer_bloc_1_id_lien_5 { font-size: 19px; }
    
    
    #page_footer_bloc_1_id_lien_6 { font-size: 19px; }
    
    #page_footer_bloc_1 {
      padding-top: 20px;
      padding-right: 23px;
      padding-bottom: 26px;
      padding-left: 18px;
    }
  }

  @media (min-width: 992px) {
    
    #page_footer_bloc_1_id_lien_1 { font-size: 19px; }
    
    
    #page_footer_bloc_1_id_lien_2 { font-size: 19px; }
    
    
    #page_footer_bloc_1_id_lien_3 { font-size: 19px; }
    
    
    #page_footer_bloc_1_id_lien_4 { font-size: 19px; }
    
    
    #page_footer_bloc_1_id_lien_5 { font-size: 19px; }
    
    
    #page_footer_bloc_1_id_lien_6 { font-size: 19px; }
    
    #page_footer_bloc_1 {
      padding-top: 20px;
      padding-right: 23px;
      padding-bottom: 26px;
      padding-left: 18px;
    }
  }

  @media (min-width: 1200px) {
    
    #page_footer_bloc_1_id_lien_1 { font-size: 20px; }
    
    
    #page_footer_bloc_1_id_lien_2 { font-size: 20px; }
    
    
    #page_footer_bloc_1_id_lien_3 { font-size: 20px; }
    
    
    #page_footer_bloc_1_id_lien_4 { font-size: 20px; }
    
    
    #page_footer_bloc_1_id_lien_5 { font-size: 20px; }
    
    
    #page_footer_bloc_1_id_lien_6 { font-size: 20px; }
    
    #page_footer_bloc_1 {
      padding-top: 20px;
      padding-right: 232px;
      padding-bottom: 26px;
      padding-left: 187px;
    }
  }

  @media (min-width: 1400px) {
    
    #page_footer_bloc_1_id_lien_1 { font-size: 20px; }
    
    
    #page_footer_bloc_1_id_lien_2 { font-size: 20px; }
    
    
    #page_footer_bloc_1_id_lien_3 { font-size: 20px; }
    
    
    #page_footer_bloc_1_id_lien_4 { font-size: 20px; }
    
    
    #page_footer_bloc_1_id_lien_5 { font-size: 20px; }
    
    
    #page_footer_bloc_1_id_lien_6 { font-size: 20px; }
    
    #page_footer_bloc_1 {
      padding-top: 20px;
      padding-right: 232px;
      padding-bottom: 26px;
      padding-left: 187px;
    }
  }


  /* à mettre quand on sera meilleurs niveau perf
    .heartbeat {
      display: inline-block;
      transform-origin: center center;
      animation: heartBeat 2s ease-in-out infinite;
    }

    @keyframes heartBeat {
      0%, 100% {
        transform: scale(1);
      }
      14%, 42% {
        transform: scale(1.3);
      }
      28%, 70% {
        transform: scale(1);
      }
    }

    @media (prefers-reduced-motion: reduce) {
      .heartbeat { animation: none; }
    }
  */