/* ===== STYLE AUDIT INTERNE - CORRECTIF FINAL ===== */

.titre-audit {
  text-align: center;
  font-size: 2.5rem;
  color: #3498db;
  margin-bottom: 3rem;
  line-height: 1.3;
}

.intro-audit {
  font-size: 1.2rem;
  text-align: center;
  max-width: 850px;
  margin: 0 auto 4rem auto;
  line-height: 1.8;
  color: #333;
}

.bloc {
  margin-bottom: 4rem;
  max-width: 900px;
  margin-left: auto;
  margin-right: auto;
}

.bloc h3 {
  font-size: 1.6rem;
  color: #2c3e50;
  margin-bottom: 1.5rem;
}

.bloc p {
  font-size: 1.15rem;
  line-height: 2;
  color: #444;
  margin-bottom: 2rem;
}

.comparaison {
  background-color: #eaf4fb;
  padding: 2.5rem;
  border-radius: 10px;
  max-width: 900px;
  margin: 4rem auto 0 auto;
}

.comparaison h3 {
  font-size: 1.4rem;
  color: #2c3e50;
  margin-bottom: 1.5rem;
  text-align: center;
}

.comparaison ul {
  list-style-type: none;
  padding: 0;
  margin: 0;
}

.comparaison li {
  font-size: 1.1rem;
  line-height: 1.8;
  margin-bottom: 1.2rem;
  color: #333;
}

@media (max-width: 768px) {
  .titre-audit {
    font-size: 2.1rem;
  }

  .intro-audit {
    font-size: 1.05rem;
    padding: 0 1rem;
  }

  .bloc p {
    font-size: 1.05rem;
  }

  .comparaison li {
    font-size: 1;
  }
}

/* ========== SECTION IMPORTANCE - AUDIT INTERNE & CONTRÔLE INTERNE ========== */

.importance-controle {
  background-color: var(--blanc);
  padding: 4rem 0;
}

.importance-controle .section-title {
  text-align: center;
  font-size: 2.4rem;
  color: var(--bleu);
  margin-bottom: 3rem;
}

/* Liste accordéon */
.accordion-controle {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

/* Bloc accordéon */
.accordion-item {
  background-color: var(--blanc);
  border-radius: 10px;
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.06);
  overflow: hidden;
  border-left: 5px solid var(--bleu-clair);
  opacity: 0;
  transform: translateY(30px);
  transition: all 0.6s ease;
}

.accordion-item.visible {
  opacity: 1;
  transform: translateY(0);
}

/* Bouton cliquable */
.accordion-toggle {
  width: 100%;
  text-align: left;
  background: none;
  border: none;
  padding: 1.2rem 1.5rem;
  font-size: 1.1rem;
  font-weight: 600;
  color: var(--bleu);
  display: flex;
  justify-content: space-between;
  align-items: center;
  cursor: pointer;
  gap: 1rem;
}

.accordion-toggle .emoji {
  font-size: 1.5rem;
  flex-shrink: 0;
}

/* Augmente la taille du texte des titres */
.accordion-toggle .titre {
  font-size: 1.3rem; /* Avant : 1.1rem */
  font-weight: 700;
}

/* Augmente la taille des flèches */
.accordion-toggle .chevron {
  font-size: 1.6rem; /* Avant : 1rem */
  transition: transform 0.3s ease;
}


.accordion-item.active .chevron {
  transform: rotate(180deg);
}

/* Contenu texte */
.accordion-content {
  max-height: 0;
  overflow: hidden;
  padding: 0 1.5rem;
  transition: max-height 0.5s ease, padding 0.3s ease;
  font-size: 1.05rem;
  line-height: 1.8;
  color: var(--texte);
  background-color: #f9f9f9;
}

.accordion-item.active .accordion-content {
  max-height: 800px;
  padding: 1rem 1.5rem 1.5rem;
  border-top: 1px solid #e0e0e0;
}

/* Classe utilitaire */
.bleu {
  color: var(--bleu-clair);
  font-weight: bold;
}

.importance-controle {
  background-color: var(--blanc, #ffffff);
  padding: 4rem 0;
}

.importance-controle .section-title {
  text-align: center;
  font-size: 2.4rem;
  color: var(--bleu, #2c3e50);
  margin-bottom: 3rem;
}

.accordion-controle {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

.accordion-item {
  background-color: white;
  border-radius: 10px;
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.06);
  overflow: hidden;
  border-left: 5px solid var(--bleu-clair, #3498db);
  opacity: 0;
  transform: translateY(30px);
  transition: all 0.6s ease;
}

.accordion-item.visible {
  opacity: 1;
  transform: translateY(0);
}

.accordion-toggle {
  width: 100%;
  background: none;
  border: none;
  padding: 1.2rem 1.5rem;
  font-size: 1.1rem;
  font-weight: 600;
  color: var(--bleu, #2c3e50);
  display: flex;
  justify-content: space-between;
  align-items: center;
  cursor: pointer;
  gap: 1rem;
}

.accordion-toggle .emoji {
  font-size: 1.5rem;
  flex-shrink: 0;
}

.accordion-toggle .chevron {
  font-size: 1rem;
  transition: transform 0.3s ease;
}

.accordion-item.active .chevron {
  transform: rotate(180deg);
}

.accordion-content {
  max-height: 0;
  overflow: hidden;
  padding: 0 1.5rem;
  transition: max-height 0.5s ease, padding 0.3s ease;
  font-size: 1.05rem;
  line-height: 1.8;
  background-color: #f9f9f9;
  color: #333;
}

.accordion-item.active .accordion-content {
  max-height: 500px;
  padding: 1rem 1.5rem 1.5rem;
  border-top: 1px solid #ddd;
}

/* ========== SECTION COMMENT ÇA FONCTIONNE ========== */

.comment-fonctionne {
  background-color: var(--gris-fond);
  padding: 4rem 0;
}

.comment-fonctionne .section-title {
  text-align: center;
  font-size: 2.4rem;
  color: var(--bleu);
  margin-bottom: 3rem;
  font-weight: 700;
}

/* Grille : 2 colonnes fixes sur desktop, 1 colonne sur mobile */
.grid-etapes {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 2rem;
}

/* Bloc */
.etape {
  background-color: var(--blanc);
  border-radius: 1rem;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.06);
  padding: 2rem;
  opacity: 0;
  transform: translateY(30px);
  transition: all 0.8s ease;
}

/* Apparition progressive */
.etape.visible {
  opacity: 1;
  transform: translateY(0);
}

/* Titres des blocs */
.etape h3 {
  font-size: 1.3rem;
  margin-bottom: 1rem;
  color: var(--bleu);
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-weight: 700;
}

/* Texte */
.etape p {
  font-size: 1.05rem;
  line-height: 1.75;
  color: var(--texte);
}

/* Texte bleu pour les citations légales */
span.bleu {
  color: var(--bleu-clair);
  font-weight: bold;
}

/* Responsive mobile : 1 bloc par ligne */
@media (max-width: 768px) {
  .grid-etapes {
    grid-template-columns: 1fr;
  }

  .comment-fonctionne .section-title {
    font-size: 2rem;
  }
}

/* ========== SECTION PRESTATIONS – Audit interne & contrôle interne ========== */
.prestations-audit{
  background-color:#eaf2f8;
  padding:4rem 2rem;
  border-radius:12px;
  margin-top:2rem;
  text-align:center;
}

.prestations-audit .container{
  max-width:1100px;
  margin:0 auto;
}

.prestations-audit .section-title{
  text-align:center;
  font-size:2rem;
  color:var(--bleu, #2c3e50);
  margin-bottom:1.6rem;        /* plus compact */
  font-weight:800;
  letter-spacing:.2px;
}

/* Bloc liste aligné à gauche */
.prestations-liste{
  max-width:1000px;
  margin:0 auto;
  text-align:left;
}

/* Un item = un <p> : on le rend compact et on ajoute un chevron */
.prestations-liste p{
  position:relative;
  padding-left:1.6rem;         /* place pour le chevron */
  margin:0 0 1rem 0;           /* espacement réduit entre lignes */
  font-size:1.08rem;
  line-height:1.6;
  display:block;               /* neutralise d’éventuels styles hérités */
  align-items:initial;
  gap:0;
}

/* Chevron décoratif à gauche */
.prestations-liste p::before{
  content:"▸";
  color:#2980b9;
  position:absolute;
  left:0;
  top:.15rem;
  font-size:1.25rem;
  line-height:1;
}

/* Titre en gras dans chaque ligne */
.prestations-liste strong{
  color:#2c3e50;
  font-weight:700;
}

/* (Optionnel) un léger adoucissement de l’emoji s’il ouvre la ligne */
.prestations-liste p .emoji{
  margin-right:.35rem;
  font-size:1.05em;
}

/* Responsive */
@media (max-width:650px){
  .prestations-audit{ padding:3rem 1rem; }
  .prestations-audit .section-title{ font-size:1.85rem; margin-bottom:1.2rem; }
  .prestations-liste p{ font-size:1rem; padding-left:1.4rem; margin-bottom:.9rem; }
  .prestations-liste p::before{ font-size:1.1rem; top:.1rem; }
}

/* ========== SECTION CONSEILS ========== */
.conseils-audit {
  background-color: #f7f9fa;
  padding: 4rem 1rem;
}

.conseils-audit .section-title {
  text-align: center;
  font-size: 2rem;
  color: var(--bleu, #2c3e50);
  margin-bottom: 3rem;
  font-weight: 700;
}

.conseils-liste {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

.conseil {
  display: flex;
  background: white;
  border-radius: 12px;
  padding: 1.5rem;
  box-shadow: 0 2px 10px rgba(0,0,0,0.05);
  gap: 1.2rem;
  align-items: flex-start;
}

.conseil .icone img {
  width: 36px;
  height: 36px;
  flex-shrink: 0;
  margin-top: 0.3rem;
}

.conseil h3 {
  color: var(--bleu-clair, #3498db);
  font-size: 1.1rem;
  margin-bottom: 0.5rem;
}

.conseil p {
  font-size: 1rem;
  line-height: 1.6;
}

.conseil .bleu {
  color: #2980b9;
  font-weight: bold;
}