/* ------------------ Default html ------------------ */
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  line-height: 1.6;
}

html {
  scroll-behavior: smooth;
}

body {
  font-family: 'Nunito Sans', sans-serif;
  color: rgb(0, 0, 0);
  font-weight: 300;
  transition: opacity 0.5s ease;
  /* Suppression de min-width: 1000px pour permettre la responsive */
}

/* ------------------ Texts ------------------ */

strong {
  font-weight: bold !important;
}

h1 {
  font-size: 19px;
  font-weight: 650;
  line-height: 1.5;
}

h2 {
  font-size: 23px;
  font-weight: 650;
  line-height: 1.5;
}

h3 {
  font-family: 'Roboto', sans-serif;
  color: black;
  font-weight: bold;
}

a {
  color: inherit;
}

.blue-text {
  color: #1578b6;
  font-family: 'Roboto', sans-serif;
  font-weight: bold;
  font-size: 42px;
}

.titre {
  font-family: 'Roboto', sans-serif;
  color: black;
  font-weight: bold;
}

.big {
  font-family: 'Roboto', sans-serif;
  color: black;
  font-size: 30px;
  font-weight: 500;
}

/* ------------------ Containers ------------------ */

.hbox {
  display: flex;
  align-items: start;
  justify-content: start;
}

.hbox_center {
  display: flex;
  align-items: center;
  justify-content: center;
}

.vbox {
  display: flex;
  flex-direction: column; 
  justify-content: space-between;
  align-items: flex-start;
}

.vbox_center {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

.image_container {
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}

.image_container_big {
  max-width: 950px;
  min-width: 250px;
  min-height: 416px;
  max-height: 416px;
}

.image_container img {
  object-fit: cover;
  width: 100%;
}

.text_image {
  justify-content: center;
  padding: 50px 10px 60px 10px;
  width: 90%;
}

/* ------------------ Buttons ------------------ */

button {
  background-color: #1578b6;
  color: rgb(0, 0, 0);
  border: none;
  padding: 20px 30px;
  cursor: pointer;
  border: #1578b6 1px solid;
  /* Amélioration pour mobile */
  min-height: 44px;
  font-size: 16px;
}

button:hover {
  background-color: #000000;
  color: white;
}

button.no-style {
  background-color: white;
  color: black;
  border: none;
  cursor: pointer;
}

button.default-style {
  font-family: sans-serif;
  font-size: 13px;
  padding: 0px 20px;
  border: 1px solid #8b8b8b;
  border-radius: 3px;
  background-color: #f0f0f0;
  color: black;
  cursor: pointer;
  min-height: 25px;
}

button.default-style:hover {
  background-color: #e3e3e3;
}

button.default-style:active {
  background-color: #dcdcdc;
  box-shadow: inset 0 1px 2px rgba(0,0,0,0.2);
}

.hidden-file-input {
  display: none;
}

/* ------------------ Autres ------------------ */

.logo {
  width: 84px;
  height: 233px;
}

.logo img{
  object-fit: cover;
}

.intro {
  color: white;
  max-width: 675px;
  text-align: center;
  padding: 0 20px;
}

.custom-hr {
  width: 60px;
  height: 1px;
  background-color: #000;
  margin: 20px 0;
}

.map {
  min-width: 300px;
  width: 90%;
  min-height: 250px;
  height: 300px;
  border: 0;
}

/* ------------------ RESPONSIVE DESIGN ------------------ */
/* ------------------ Mobile ------------------ */
/* Mobile - écrans moyens */
@media screen and (max-width: 768px) {
  body {
    font-size: 16px;
  }
  
  /* Textes */
  .blue-text {
    font-size: 28px;
    text-align: center;
  }
  
  .big {
    font-size: 22px;
  }
  
  .intro p {
    font-size: 20px !important;
  }
  
  .intro p:first-child {
    font-size: 24px !important;
  }
  
  /* Containers */
  .hbox_center {
    flex-direction: column;
    gap: 20px;
  }

  
  .text_image {
    padding: 20px 0px;
    width: 100%;
  }

  .text_image .vbox {

    min-width: auto !important;
    max-width: none !important;
  }
  
  /* Images */
  .image_container {
    
    object-fit: cover;
    min-width: auto !important;
    max-width: 100% !important;
  }

  .image_container_big {
    max-width: none;
    min-width: 0;
    min-height: auto;
    max-height: none;
  
  }
  /* Map */
  .map {
    min-width: 250px;
    width: 95%;
    height: 250px;
  }


  
  /* -------------- Mobile Only -------------- */


  .m_remove_all {
    all: unset !important; /* réinitialise presque tout */
  }

  .m_no_margs {
    padding: 0px 20px;
    width: auto !important;
    margin-right: 0px !important;
    margin-left: 0px !important;
    max-width: none !important;
  }

  .m_no_side_pad{
    padding-left: 0px !important;
    padding-right: 0px !important;
  }

  .m_realisations {
    margin-left: 0px !important;
    padding: 0px 0px !important;
    width:95% !important;
  }
  
  .m_hbox_center {
    flex-direction: column !important;
  }

  .m_width_big {
    width:95% !important;
  }
  
  
  .m_flex_start_reverse {
    flex-direction: column-reverse !important;
    align-items: flex-start !important;
    justify-content: start !important;
  }

  .m_flex_center_reverse {
    flex-direction: column-reverse !important;
    align-items: center !important;
    justify-content: center !important;
  }
  
  .m_reverse_hbox{
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 0px !important;
    
  }

  .m_no_gap {
    gap: 0px !important;

  }
  .m_fournisseurs_image {
    max-height: 100px !important;
  }
  
  /* Boutons */
  .m_button_intro {
    flex-direction: column !important;
    gap: 15px !important;
    width: 90% !important;
    max-width: none !important;
  }
  
  .m_button_intro button {
    width: 100%;
    padding: 15px 20px;
  }
  
  .m_center {
    padding: 0px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
  }
  .m_form_head {
    width: 95% !important;
    padding: 0px 0px !important;
  }
  .m_text_box {
    width: 100% !important;
    padding: 20px 20px !important;
    margin: 0px !important;
  }

  .m_vobx {

    display: flex;
    flex-direction: column; 
    justify-content: start;
    align-items: start;
    gap: 0px !important;

  }

  .m_filter {
    width: 100%;
    padding-right: 0px;
  }
}