.about-main {
  max-width: 980px; margin: 0 auto; padding: 38px 12px;
}
.about-hero-immersive {
  display: flex; align-items: center; justify-content: center; flex-wrap: wrap;
  background: linear-gradient(100deg, #fff 60%, #f6f8fa 100%);
  box-shadow: 0 4px 32px #0c23400c; border-radius: 36px; margin-bottom: 40px;
  gap: 32px; padding: 38px 24px 24px 24px;
}
.about-hero-imgbox {
  flex: 0 0 auto; display: flex; align-items: center; justify-content: center;
}
.about-hero-img {
  width: 200px; height: 200px; border-radius: 120px; object-fit: cover;
  box-shadow: 0 6px 26px #f5761a25; border: 5px solid #fff; background: #f6f8fa;
}
.about-hero-txtbox {
  flex: 1 1 380px; min-width: 240px; text-align: left; align-self: center;
}
.about-hero-txtbox h1 {
  font-size: 2.2rem; color: #f5761a; font-weight: 800; margin-bottom: 16px; line-height: 1.2;
}
.about-lead { font-size: 1.18rem; color: #222; line-height: 1.6; }

.about-storyline {
  background: #fff; border-radius: 22px; box-shadow: 0 4px 24px #0c234013;
  margin-bottom: 42px; padding: 34px 22px;
}
.about-storyline h2 { font-size: 1.44rem; color: #0c2340; margin-bottom: 14px; font-weight: 700; }
.about-timeline {
  list-style: none; padding: 0; margin: 0 0 24px 0; display: flex; flex-wrap: wrap; gap: 18px;
}
.about-timeline li {
  background: #f6f8fa; border-left: 4px solid #f5761a;
  padding: 14px 20px; border-radius: 13px; min-width: 190px;
  flex: 1 1 230px; font-size: 1.07rem;
  box-shadow: 0 2px 8px #0c234011;
}
.timeline-year {
  font-weight: bold; color: #f5761a; font-size: 1.13rem; display: block; margin-bottom: 4px;
}
.about-story-txt { font-size: 1.11rem; color: #273350; margin-top: 17px; }

.about-mission-alt {
  background: #f8fafc; border-radius: 22px; box-shadow: 0 4px 20px #f5761a11;
  margin-bottom: 36px; padding: 36px 22px 24px 22px; text-align: center;
}
.about-mission-alt h2 { font-size: 1.28rem; color: #f5761a; margin-bottom: 20px; }
.about-mission-grid { display: flex; gap: 24px; flex-wrap: wrap; justify-content: center;}
.about-mission-grid > div {
  background: #fff; border-radius: 13px; box-shadow: 0 2px 8px #0c234009;
  padding: 18px 22px; font-size: 1.09rem; max-width: 260px; min-width: 160px; margin-bottom: 10px;
}
.about-mission-ico { font-size: 2.2rem; display: block; margin-bottom: 10px; }

.about-stats-badges {
  background: #fff;
  border-radius: 22px;
  box-shadow: 0 4px 16px #0c234015;
  margin-bottom: 36px;
  padding: 40px 24px;
  text-align: center;
}

.about-stats-badges h2 {
  font-size: 1.5rem;
  color: #0c2340;
  margin-bottom: 20px;
  font-weight: bold;
}

.about-stats-grid {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 22px;
  align-items: stretch; /* ✅ Uniformise hauteur */
}

.about-stat-card {
  background: #f5761a;
  color: #fff;
  border-radius: 15px;
  padding: 28px 26px;
  width: 160px;
  min-height: 140px; /* ✅ Hauteur cohérente */
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  font-weight: 600;
  box-shadow: 0 2px 14px #f5761a22;
}

.about-stat-number {
  font-size: 1.4rem;
  font-weight: bold;
  margin-bottom: 5px;
}

.about-stat-label {
  font-size: 1.07rem;
  text-align: center;
}


.about-cta-block {
  text-align: center; margin-top: 44px; background: #0c2340; color: #fff;
  border-radius: 19px; box-shadow: 0 4px 22px #0c234017; padding: 46px 12px 36px 12px;
}
.about-cta-block h2 { font-size: 1.5rem; color: #f5761a; margin-bottom: 16px;}
.about-cta-block a { margin: 16px 10px 0 10px; display: inline-block;}
.about-cta-block p { color: #e9eff8; font-size: 1.12rem;}

@media (max-width: 900px) {
  .about-hero-immersive {flex-direction: column; text-align: center;}
  .about-hero-txtbox {text-align: center;}
}
@media (max-width: 600px) {
  .about-hero-img {width: 120px; height: 120px;}
  .about-main {padding: 12px 2px;}
  .about-storyline, .about-mission-alt, .about-stats-badges, .about-cta-block {padding: 10px 2vw;}
  .about-mission-grid, .about-stats-grid {gap: 8px;}
  .about-timeline li {min-width: 120px; font-size: 1rem;}
}