/* ==========================================================================
   SCODAA — Styles propres à la page "Nos projets"
   ========================================================================== */

.section-projet { padding: 5.5rem 0; transition: background 0.6s ease; }
.section-projet:nth-of-type(even) { background: var(--scodaa-fond); }
.section-projet.cible-surlignee { background: var(--scodaa-orange-10); }

.projet-partie-deux {
  margin-top: 1.8rem;
}

@media (max-width: 767.98px) {
  .section-projet { padding: 3rem 0; }
}

.visuel-projet { aspect-ratio: 4/3; overflow: hidden; border-radius: 16px; box-shadow: var(--ombre-image); }
.visuel-projet img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.5s ease; }
.visuel-projet:hover img { transform: scale(1.05); }

.fiche-chiffres {
  list-style: none;
  padding: 0;
  margin: 0;
  background: #fff;
  border: 1px solid #e4ded2;
  border-radius: 14px;
  overflow: hidden;
  box-shadow: var(--ombre-legere);
}
.fiche-chiffres li {
  display: flex; justify-content: space-between; align-items: center; gap: 1rem;
  padding: 1rem 1.3rem; border-bottom: 1px solid #eee6d6; font-size: 0.92rem;
}
.fiche-chiffres li:last-child { border-bottom: none; }
.fiche-chiffres li:nth-child(even) { background: var(--scodaa-fond); }
.fiche-chiffres .label { color: #555; display: flex; align-items: center; gap: 0.6rem; }
.fiche-chiffres .valeur { font-weight: 600; color: var(--scodaa-bleu-profond); text-align: right; }

.phases-suite { margin-top: 0.5rem; }

.frise-phases { display: flex; flex-direction: column; gap: 0; margin-top: 1.6rem; }
.phase-etape {
  display: flex; gap: 1.2rem; align-items: flex-start; padding: 1.3rem 0; border-top: var(--rayure);
}
.phase-etape:last-child { border-bottom: var(--rayure); }
.phase-etape .num {
  font-family: var(--font-titre); font-size: 1.4rem; color: var(--scodaa-orange);
  flex: 0 0 2.6rem;
}
.phase-etape h3 { font-size: 1.05rem; margin-bottom: 0.35rem; display: flex; align-items: center; gap: 0.55rem; }
.phase-etape p { font-size: 0.92rem; color: #555; margin: 0; }

.mini-galerie { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.mini-galerie a { display: block; aspect-ratio: 4/3; overflow: hidden; box-shadow: var(--ombre-image); }
.mini-galerie img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.4s ease; }
.mini-galerie a:hover img { transform: scale(1.06); }
@media (max-width: 767.98px) { .mini-galerie { grid-template-columns: repeat(2, 1fr); } }
