/* ==========================================================================
   2025 landing page (Elementor post-8369) — / and /new-home-2025
   --------------------------------------------------------------------------
   NOTE ON HEADING COLOUR: the live child theme (hello-theme-child-master-yoyo)
   carries `.elementor-widget-heading .elementor-widget-container > h1, > h2
   { color: var(--e-global-color-secondary) !important; }`. Every h1/h2 on this
   page therefore renders #FBB03B, except the runs wrapped in <span class="blue">
   which the page's own custom CSS paints #003A96. Reproduced verbatim.
   ========================================================================== */

.page-h1, .page-h2 { color: var(--c-secondary); }
.blue { color: var(--c-primary); }

/* --- Hero (#52d701a) ---------------------------------------------------- */
.hero {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-height: 71vh;
  padding: 0 var(--gutter);
  background-image: url('../../img/hero5.webp');
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  isolation: isolate;
}
.hero::before {
  content: '';
  position: absolute;
  inset: 0;
  background-color: var(--c-heading-alt);
  opacity: .58;
  z-index: -1;
}
.hero__inner { width: 100%; max-width: var(--content-width); margin-inline: auto; }
.hero h1 { font-size: 51px; margin-block: 0 20px; }
.hero p {
  color: var(--c-white);
  font-size: 20px;
  font-weight: 500;
  margin-block-end: 20px;
}
@media (max-width: 767px) { .hero h1 { font-size: 37px; } }

/* --- Nos Modules heading (#047f108) ------------------------------------- */
.modules { padding: 82px var(--gutter) 39px; }
.modules h2 { text-align: center; font-size: 48px; font-weight: 600; }
@media (max-width: 767px) { .modules h2 { line-height: 1.2em; } }

/* --- Module cards (#e7914fe / #8694ec3) --------------------------------- */
.modules-cards {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  min-height: 380px;
  padding-inline: var(--gutter);
  background-image: url('../../img/path-4.svg');
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  isolation: isolate;
}
.modules-cards::before { content: ''; position: absolute; inset: 0; opacity: .19; z-index: -1; }
.modules-cards__grid {
  display: flex;
  flex-direction: row;
  gap: 40px;
  width: 100%;
  max-width: var(--content-width);
  margin-inline: auto;
}
.module-card {
  display: flex;
  flex-direction: column;
  justify-content: center;
  flex: 1 1 0;
  min-height: 320px;
  padding: 31px 30px 22px;
  background-color: var(--c-card-bg);
  border-radius: 23px;
  box-shadow: 0 0 10px 0 rgba(0, 0, 0, .06);
}
.module-card__icon { text-align: center; margin-block-end: 20px; }
.module-card__icon svg { height: 46px; width: auto; }
/* card 1 is the stacked/circle variant on the live site */
.module-card:first-child .module-card__icon span {
  display: inline-flex;
  padding: 13px;
  background-color: var(--c-white);
  border-radius: 50%;
}
.module-card:first-child .module-card__icon { margin: 1px 0 6px; }
.module-card:nth-child(2) .module-card__icon { margin: -6px 0 17px; }
.module-card:nth-child(3) .module-card__icon { margin: 0 0 22px; }
.module-card:nth-child(3) .module-card__icon svg { height: 37px; }
.module-card h3 {
  text-align: center;
  color: var(--c-heading-alt);
  font-family: var(--font-head);
  font-weight: 600;
  margin-block: .5rem 1rem;
}
.module-card p { text-align: center; font-size: 17px; font-weight: 400; margin: 0; }
@media (max-width: 1024px) {
  .modules-cards__grid { flex-direction: column; }
}
@media (max-width: 767px) {
  .modules-cards { padding: 10px var(--gutter-sm) 40px; }
}

/* --- Modules banner + CTA (#f1766fa / #b0d50d3) ------------------------- */
.modules-cta { display: flex; flex-direction: column; justify-content: center; padding-inline: var(--gutter); }
.modules-cta__inner { width: 100%; max-width: var(--content-width); margin-inline: auto; }
.modules-cta__banner {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  min-height: 334px;
  border-radius: 34px;
  background-image: url('../../img/modules-banner.png');
  background-position: top center;
  background-repeat: no-repeat;
  background-size: cover;
}
.modules-cta__banner .spacer { height: 21px; }
@media (max-width: 767px) { .modules-cta { padding-inline: var(--gutter-sm); } }

/* --- Split sections: Approche / Impact / À propos ------------------------ */
.split {
  display: flex;
  flex-direction: row;
  padding-inline: var(--gutter);
  margin-block-end: 50px;
}
.split__inner {
  display: flex;
  flex-direction: row;
  width: 100%;
  max-width: var(--content-width);
  margin-inline: auto;
}
.split__text {
  flex: 0 0 50%;
  max-width: 50%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding-inline: 18px 77px;
}
.split__media { flex: 0 0 50%; max-width: 50%; display: flex; flex-direction: column; }
.split__text h2 { font-size: 43px; font-weight: 600; margin-block: .5rem 1rem; }
.split__text h2.sub { font-size: 22px; font-weight: 600; font-style: normal; }
.split__text p { color: var(--c-copy-dark); font-family: var(--font-head); font-weight: 400; }
.split__media img { display: block; width: 100%; object-fit: cover; object-position: center center; border-radius: 19px; }

/* Approche adaptive (#b560c73 / #notresolution) */
.approach {
  position: relative;
  padding-block: 150px 0;
  isolation: isolate;
}
.approach::before {
  content: '';
  position: absolute;
  inset: 0;
  background-image: url('../../img/path-16.svg');
  background-position: bottom center;
  background-repeat: no-repeat;
  background-size: cover;
  opacity: .5;
  z-index: -1;
}
.approach .split__inner { gap: 0; }
.approach .lede { font-size: 20px; font-weight: 500; margin-block-end: 0; }
.approach img { height: 476px; }

/* Impact (#70c0e3a) */
.impact { position: relative; padding-block: 150px 70px; isolation: isolate; }
.impact::before {
  content: '';
  position: absolute;
  inset: 0;
  background-image: url('../../img/path-16.svg');
  background-position: bottom center;
  background-repeat: no-repeat;
  background-size: cover;
  opacity: .5;
  z-index: -1;
}
.impact .split__inner { gap: 40px; }
.impact img { height: 433px; }

/* À propos (#c69702c / #apropos) */
.about { padding-block: 104px 58px; }
.about .split__inner { gap: 0; }
.about .split__text { padding-inline: 18px 63px; }
.about img { height: 550px; }

@media (max-width: 1024px) {
  .split__inner { flex-direction: column; }
  .about .split__inner { flex-direction: column-reverse; }
  .split__text, .split__media { flex: 0 0 100%; max-width: 100%; align-items: flex-start; }
  .split__text h2 { text-align: left; }
}
@media (max-width: 767px) {
  .split { padding-inline: var(--gutter-sm); }
  .split__text { padding-inline: 0; }
  .approach { padding-block: 70px 0; }
  .approach .lede, .approach .split__text p { text-align: center; }
  .approach h2.sub { width: 100%; max-width: 100%; }
  .approach img { height: 313px; }
  .impact { padding-block: 50px 0; }
  .impact h2.sub, .impact .split__text p { text-align: center; }
  .impact img { height: 270px; }
  .about { padding-block: 70px 25px; }
  .about h2 { margin-block-start: 15px; }
  .about .split__text p { text-align: center; }
  .about img { height: 226px; }
}

/* --- Feature panel (#ecf42d5 / #71b1db2) -------------------------------- */
.features { display: flex; flex-direction: column; padding-inline: var(--gutter); }
.features__panel {
  display: flex;
  flex-direction: row;
  width: 100%;
  max-width: 1236px;
  margin-inline: auto;
  padding: 50px 36px;
  background-color: var(--c-tint-amber);
  border-radius: 12px;
}
.features__col {
  display: flex;
  flex-direction: column;
  flex: 1 1 0;
  gap: 3px;
}
.features__col + .features__col {
  gap: 5px;
  margin-inline-start: 20px;
  border-inline-start: 0;
}
.features__col:first-child { border-inline-end: 1px solid var(--c-rule-blue); }
.feature__icon svg { height: 69px; width: auto; display: block; }
.feature__icon { text-align: left; }
.features__col p {
  text-align: left;
  color: var(--c-primary);
  font-size: 17px;
  font-weight: 500;
  margin-block-end: 5px;
}
.features .spacer { height: 44px; }
@media (max-width: 767px) {
  .features { padding-inline: var(--gutter-sm); }
  .features__panel { flex-direction: column; }
  .features__col:first-child { border-inline-end: 0; }
  .features__col + .features__col { margin-inline-start: 0; }
}

/* --- Second "Nos Modules" block (#7ea7224 / #11170ab) ------------------- */
.modules2 { display: flex; flex-direction: column; padding: 108px var(--gutter) 68px; }
.modules2 h2 { text-align: center; font-size: 48px; font-weight: 600; }
.modules2-img { display: flex; flex-direction: column; padding-inline: var(--gutter); }
.modules2-img__inner { width: 100%; max-width: var(--content-width); margin-inline: auto; text-align: center; }
.modules2-img img { display: block; margin-inline: auto; }
.modules2-img .btn { margin-block-start: 28px; }
@media (max-width: 767px) {
  .modules2 { padding-inline: var(--gutter-sm); }
  .modules2-img { padding-inline: var(--gutter-sm); }
  .modules2-img img { width: 100%; }
}

/* --- Testimonials (#72a9b22) -------------------------------------------- */
.testimonials {
  display: flex;
  flex-direction: row;
  gap: 40px;
  padding: 116px var(--gutter) 127px;
  background-color: var(--c-tint-amber-2);
}
.testimonials__inner {
  display: flex;
  flex-direction: row;
  gap: 40px;
  width: 100%;
  max-width: 1225px;
  margin-inline: auto;
}
.testimonials__head { flex: 0 0 30%; max-width: 30%; display: flex; flex-direction: column; justify-content: flex-start; }
.testimonials__head svg { height: 101px; width: auto; display: block; }
.testimonials__head h2 { font-size: 43px; font-weight: 600; margin-block: .5rem 1rem; }
.testimonials__body {
  flex: 0 0 70%;
  max-width: 70%;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  border-inline-start: 2px solid var(--c-rule-amber);
  padding-inline-start: 40px;
}

.carousel { position: relative; }
.carousel__viewport { overflow: hidden; }
.carousel__track {
  display: flex;
  gap: 0;
  transition: transform .5s ease;
  will-change: transform;
}
.carousel__slide { flex: 0 0 50%; min-width: 0; padding-inline-end: 0; }
.testimonial {
  height: 100%;
  border-radius: 23px;
}
.testimonial__content {
  background-color: var(--c-white);
  padding: 42px 42px 42px 55px;
  border-radius: 20px;
}
.testimonial__text { color: #000000; font-size: 19px; font-weight: 300; font-style: normal; margin: 0; }
.testimonial__footer { margin-block-start: 38px; padding: 0 42px 0 55px; }
.testimonial__name {
  color: var(--c-primary);
  font-family: var(--font-head);
  font-size: 19px;
  font-weight: 500;
  font-style: normal;
  display: block;
}
.carousel__btn {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 2;
  width: 40px; height: 40px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 20px;
  color: var(--c-primary);
  background: rgba(255, 255, 255, .85);
  border: 0;
  border-radius: 50%;
  cursor: pointer;
}
.carousel__btn:hover { background: var(--c-white); }
.carousel__btn--prev { inset-inline-start: -10px; }
.carousel__btn--next { inset-inline-end: -10px; }
.carousel__btn svg { width: 16px; height: 16px; fill: currentColor; }

@media (max-width: 1024px) {
  .testimonials__inner { flex-direction: column; }
  .testimonials__head, .testimonials__body { flex: 0 0 100%; max-width: 100%; }
  .testimonials__head { align-items: flex-start; }
  .testimonials__head h2 { text-align: left; }
  .carousel__slide { flex-basis: 100%; }
  .carousel__track { gap: 10px; }
}
@media (max-width: 767px) {
  .testimonials { padding: 40px var(--gutter-sm); }
  .testimonials__body { padding-inline-start: 0; }
  .testimonial__content { padding: 28px; }
  .testimonial__footer { padding: 0 28px; }
}

/* --- Contact (#0f46eea / #contacteznous) -------------------------------- */
.contact {
  display: flex;
  flex-direction: row;
  gap: 0 40px;
  min-height: 427px;
  background-color: var(--c-grey-band);
}
.contact__deco {
  flex: 0 0 50%;
  max-width: 50%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-end;
  padding-inline-end: 104px;
  background-image: url('../../img/union-2.webp');
  background-position: center right;
  background-repeat: no-repeat;
  background-size: cover;
}
.contact__form {
  flex: 0 0 min(50%, calc(var(--content-width) / 2));
  max-width: min(50%, calc(var(--content-width) / 2));
  display: flex;
  flex-direction: column;
  padding: 69px 0 58px;
}
.contact__form h2 {
  text-align: left;
  color: var(--c-primary);
  font-family: var(--font-head);
  font-size: 37px;
  font-weight: 600;
  line-height: 42px;
  margin: 0 0 22px;
}

.form-fields { display: flex; flex-wrap: wrap; margin-inline: -9px; margin-block-end: -15px; }
.form-field { width: 100%; padding-inline: 9px; margin-block-end: 15px; }
.form-field label {
  display: block;
  padding-block-end: 7px;
  color: var(--c-primary);
  font-family: var(--font-head);
  font-weight: 500;
}
.form-field input,
.form-field textarea {
  width: 100%;
  font-family: inherit;
  font-size: 1rem;
  color: #7A7A7A78;
  background: transparent;
  border: 0;
  border-block-end: 1px solid var(--c-primary);
  border-radius: 0;
  padding: 6px 0;
}
.form-field textarea { resize: vertical; }
.form-field input:focus, .form-field textarea:focus { color: var(--c-body); }
.form-submit { width: 100%; padding-inline: 9px; margin-block-end: 15px; }
.form-submit .btn { width: 100%; }
.form-status { margin: 12px 9px 0; font-size: 15px; color: var(--c-primary); }
.form-status:empty { margin: 0; }

@media (max-width: 1024px) {
  .contact__form { padding: 50px 50px 50px 0; }
}
@media (max-width: 767px) {
  .contact { flex-direction: column-reverse; }
  .contact__deco { flex: 0 0 100%; max-width: 100%; min-height: 180px; padding-inline-end: 0; }
  .contact__form { flex: 0 0 100%; max-width: 100%; padding: 60px 20px; }
}