/* =========================================================
   INFO CONTACTE
   ========================================================= */

.c-info-contacte {
  margin-top: var(--mar-t, 0px);
  margin-bottom: var(--mar-b, 0px);
  padding-top: var(--pad-t, 60px);
  padding-bottom: var(--pad-b, 60px);
  position: relative;
}

.c-info-contacte--bg-always,
.c-info-contacte--bg-desktop {
  background: var(--bg-block, transparent);
}

.c-info-contacte__max-width {
  max-width: var(--max-w, 1920px);
  margin: 0 auto;
}

.c-info-contacte--placeholder {
  padding: 1.5rem 2rem;
  background: #f7f7f7;
  border: 2px dashed #ddd;
  border-radius: 8px;
  text-align: center;
  color: #666;
}

.c-info-contacte__grid {
  row-gap: var(--gap-desk, 24px);
}

.c-info-contacte__card {
  display: flex;
  flex-direction: column;
  padding: 40px;
}

.c-info-contacte__icon {
  margin-bottom: 24px;
}

.c-info-contacte__icon img {
  width: auto;
  max-width: var(--logo-w, clamp(48px, 1vw + 40px, 56px));
  height: auto;
  display: block;
}

.c-info-contacte__title {
  font-size: var(--fs-title, clamp(26px, 3.5vw + 12px, 52px));
  line-height: 1.1;
  font-weight: var(--fw-titol, 700);
  margin: 0 0 12px 0;
}

.c-info-contacte__desc {
  font-size: var(--fs-desc, 16px);
  line-height: 1.5;
  font-weight: var(--fw-desc, 400);
  margin: 0;
}

.c-info-contacte__desc p { margin: 0; }

.c-info-contacte__content {
  margin-top: auto;
  padding-top: 32px;
  font-size: var(--fs-cont, clamp(18px, 1.5vw + 12px, 26px));
  line-height: 1.2;
  font-weight: var(--fw-cont, 700);
}

.c-info-contacte__content p { margin: 0; }

.c-info-contacte__card--1 {
  grid-column: span 6;
  background-color: var(--c1-bg, #f5f7fa);
  border-radius: var(--c1-br, 30px 30px 150px 30px);
}

.c-info-contacte__card--1 .c-info-contacte__title,
.c-info-contacte__card--1 .c-info-contacte__desc { color: #1e1348; }
.c-info-contacte__card--1 .c-info-contacte__content { color: #474fce; }

.c-info-contacte__card--2 {
  grid-column: span 3;
  background-color: var(--c2-bg, #474fce);
  border-radius: var(--c2-br, 30px);
}

.c-info-contacte__card--2 .c-info-contacte__title,
.c-info-contacte__card--2 .c-info-contacte__content { color: #ffffff; }
.c-info-contacte__card--2 .c-info-contacte__desc { color: rgba(255, 255, 255, 0.85); }
.c-info-contacte__card--2 .c-info-contacte__icon img { filter: brightness(0) invert(1); }

.c-info-contacte__card--3 {
  grid-column: span 3;
  background-color: var(--c3-bg, #f5f7fa);
  border-radius: var(--c3-br, 30px 150px 30px 30px);
}

.c-info-contacte__card--3 .c-info-contacte__title { color: #1e1348; }
.c-info-contacte__card--3 .c-info-contacte__desc { color: #4a4a68; }
.c-info-contacte__card--3 .c-info-contacte__content { color: #474fce; }

/* =========================================================
     RESPONSIVE
   ========================================================= */
@media (max-width: 1024px) {
  .c-info-contacte__card--1 { grid-column: 1 / -1; }
  .c-info-contacte__card--2 { grid-column: span 6; }
  .c-info-contacte__card--3 { grid-column: span 6; }
}

@media (max-width: 768px) {
  .c-info-contacte {
    margin-top: var(--mar-t-mob, 0px);
    margin-bottom: var(--mar-b-mob, 0px);
    padding-top: var(--pad-t-mob, 40px);
    padding-bottom: var(--pad-b-mob, 40px);
  }

  .c-info-contacte--bg-desktop {
    background: transparent;
  }
  .c-info-contacte--bg-mobile {
    background: var(--bg-block, transparent);
  }

  .c-info-contacte__title { font-size: var(--fs-title-mob, 26px); }
  .c-info-contacte__desc { font-size: var(--fs-desc-mob, 16px); }
  .c-info-contacte__content { font-size: var(--fs-cont-mob, 18px); }

  .c-info-contacte__icon img { max-width: var(--logo-w-mob, 48px); }

  .c-info-contacte__grid.grid-container { row-gap: var(--gap-mob, 16px); }

  .c-info-contacte__card--1 {
    grid-column: span 4;
    border-radius: var(--c1-br-mob, 20px 20px 100px 20px);
  }

  .c-info-contacte__card--2 {
    grid-column: span 2;
    border-radius: var(--c2-br-mob, 20px);
  }
  
  .c-info-contacte__card--3 { 
    grid-column: span 2;
    border-radius: var(--c3-br-mob, 20px 100px 20px 20px); 
  }

  .c-info-contacte__card { padding: 24px 20px; }
  .c-info-contacte__icon { margin-bottom: 16px; }
  .c-info-contacte__content { padding-top: 24px; }
}