/* SECTION ICONES (template) */
.icones {
  column-gap: 6%;
  row-gap: 30px;
  flex-wrap: wrap;
  display: flex;
  flex-direction: row;
  width: 100%;
}

.icone {
  display: flex;
  column-gap: 4%;
  row-gap: 10px;
  flex: 0 0 29.25%;
  flex-direction: column;
}

.icone-type {
  width: 55px;
  min-width: 55px;
}

.icone-type i {
  font-size: 45px;
}

.icone-type img {
  width: 45px;
}

.texte-icone {
  display: flex;
  flex-direction: column;
  row-gap: 10px;
}

.texte-icone h3,
.texte-icone p {
  margin-bottom: 0px;
}

/* Alignements */
.icones.icone-gauche .icone {
  align-items: flex-start;
  text-align: start;
}

.icones.icone-centre .icone {
  align-items: center;
  text-align: center;
}

.icones.icone-droite .icone {
  align-items: flex-end;
  text-align: end;
}

/* Propres à la section Standard */
.section-base .section-contenu-image .icone {
  flex: 0 0 45%;
}

.section-base .section-contenus-fullwidth .icone {
  flex: 0 0 29.25%;
}

.section-base:has(.texte-centre) .icones {
  justify-content: center;
}

.section-base:has(.texte-droite) .icones {
  justify-content: flex-end;
}

/* --------------- RESPONSIVE --------------- */

@media screen and (max-width: 1270px) {
  .section-base .section-contenu-image .icones {
    row-gap: 30px;
    flex-wrap: nowrap;
    flex-direction: column;
  }

  .section-base .section-contenu-image .icone {
    flex: none;
  }
}

@media screen and (max-width: 1024px) {
  .section-base .section-contenus-fullwidth .icone {
    flex: 0 0 46.25%;
  }

  .section-base .section-contenu-image .icone {
    flex: 0 0 46.25%;
  }

  .section-base .section-contenu-image .icones {
    flex-wrap: wrap;
    flex-direction: row;
  }
}

@media screen and (max-width: 960px) {}

@media screen and (max-width: 820px) {}

@media screen and (max-width: 768px) {
  .icones {
    flex-wrap: nowrap;
    flex-direction: column;
  }

  .section-base .section-contenu-image .icones {
    flex-wrap: nowrap;
    flex-direction: column;
  }
}

@media screen and (max-width: 600px) {}

@media screen and (max-width: 450px) {}