/* À propos — mission & positionnement v2. Backgrounds stay those of
   .about-statement--mission / --positioning (about-history.css). */

.about-statement--v2 .about-v2 {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr);
  gap: clamp(36px, 6vw, 90px);
  align-items: center;
  width: min(1160px, calc(100% - 48px));
  margin: 0 auto;
}

.about-statement--positioning.about-statement--v2 .about-v2 {
  grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr);
  grid-template-areas: "intro venn" "copy venn";
  row-gap: 26px;
  align-items: start;
}

.about-statement--positioning.about-statement--v2 .about-v2__intro { grid-area: intro; }
.about-statement--positioning.about-statement--v2 .about-v2__copy { grid-area: copy; }
.about-statement--positioning.about-statement--v2 .about-v2__venn { grid-area: venn; align-self: center; }

.about-v2__kicker {
  margin: 0 0 14px !important;
  color: #7fe9ef !important;
  font-size: .74rem !important;
  font-weight: 600;
  letter-spacing: .26em;
  text-align: left !important;
  text-transform: uppercase;
}

.about-statement--positioning .about-v2__kicker {
  color: #d6fbfd !important;
}

.about-statement--v2 .about-v2__title {
  margin: 0 !important;
  color: #fff !important;
  font-size: clamp(2.2rem, 4.6vw, 3.6rem) !important;
  font-weight: 300 !important;
  line-height: 1.05 !important;
  letter-spacing: -.02em;
  text-align: left !important;
}

.about-v2__quote {
  margin: 26px 0 0 !important;
  padding-left: 20px;
  border-left: 2px solid #7fe9ef;
  color: #fff !important;
  font-size: clamp(1.3rem, 2.2vw, 1.7rem) !important;
  font-weight: 300 !important;
  line-height: 1.3 !important;
  text-align: left !important;
}

.about-v2__pills {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 28px 0 0;
  padding: 0;
  list-style: none;
}

.about-v2__pills li {
  margin: 0;
  padding: 7px 14px;
  border: 1px solid rgba(255, 255, 255, .22);
  border-radius: 999px;
  color: rgba(255, 255, 255, .88);
  font-size: .8rem;
}

.about-v2__pills li::before {
  content: none !important;
}

.about-statement--v2 .about-v2__copy p {
  margin: 0 0 14px !important;
  max-width: 40em;
  color: rgba(255, 255, 255, .88) !important;
  font-size: clamp(1.05rem, 1.45vw, 1.22rem) !important;
  font-weight: 300 !important;
  line-height: 1.85 !important;
  text-align: left !important;
  hyphens: none;
}

.about-statement--v2 .about-v2__copy strong {
  color: #fff;
  font-weight: 500;
}

.about-statement--positioning.about-statement--v2 .about-v2__copy strong {
  color: #062b3a;
  font-weight: 600;
}

/* Three levers with the group logo in the centre. */
.about-v2__venn {
  position: relative;
  width: min(100%, 470px);
  aspect-ratio: 1 / .93;
  margin-inline: auto;
}

.about-v2__circle {
  position: absolute;
  display: grid;
  width: 62%;
  aspect-ratio: 1;
  border: 1px solid rgba(255, 255, 255, .75);
  border-radius: 50%;
  background: rgba(255, 255, 255, .08);
  color: #fff;
  font-size: .95rem;
  font-weight: 500;
  line-height: 1.3;
}

.about-v2__circle small {
  display: block;
  margin-top: 6px;
  color: rgba(255, 255, 255, .82);
  font-size: .78rem;
  font-weight: 300;
}

.about-v2__circle--1 { left: 19%; top: 0; place-items: start center; padding-top: 16%; text-align: center; }
.about-v2__circle--1 span { max-width: 70%; }
.about-v2__circle--2 { left: 0; bottom: 0; place-items: end start; padding: 0 0 20% 14%; text-align: left; }
.about-v2__circle--2 span { max-width: 52%; }
.about-v2__circle--3 { right: 0; bottom: 0; place-items: end end; padding: 0 14% 20% 0; text-align: right; }
.about-v2__circle--3 span { max-width: 52%; }

.about-v2__core {
  position: absolute;
  left: 50%;
  top: 56%;
  display: grid;
  place-items: center;
  width: 30%;
  aspect-ratio: 1;
  padding: 4%;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 18px 40px rgba(0, 40, 52, .35), 0 0 0 8px rgba(255, 255, 255, .18);
  transform: translate(-50%, -50%);
}

.about-v2__core img {
  width: 100%;
  height: auto;
}

@media (max-width: 860px) {
  .about-statement--v2 .about-v2,
  .about-statement--positioning.about-statement--v2 .about-v2 {
    grid-template-columns: 1fr;
    grid-template-areas: "intro" "copy" "venn";
  }
}

@media (max-width: 480px) {
  .about-statement--v2 .about-v2 {
    width: calc(100% - 36px);
  }

  .about-v2__circle { font-size: .8rem; }
  .about-v2__circle small { display: none; }
}

body .about-statement.about-statement--v2 h2.about-v2__title {
  display: block !important;
  width: auto !important;
  max-width: none !important;
  margin: 0 !important;
  text-align: left !important;
  justify-self: start !important;
}

body .about-statement.about-statement--v2 .about-v2__intro {
  text-align: left !important;
}

/* Mission & positioning: justified copy; the mission quote on one line (desktop). */
body .about-statement--v2 .about-v2__copy p {
  text-align: justify !important;
  text-align-last: left !important;
  hyphens: auto;
  -webkit-hyphens: auto;
}
@media (min-width: 1100px) {
  body .about-statement--v2 p.about-v2__quote {
    white-space: nowrap;
    font-size: clamp(1.15rem, 1.55vw, 1.4rem) !important;
  }
}

/* Notre mission: quote without the vertical rule. */
.about-statement--mission .about-v2__quote {
  padding-left: 0 !important;
  border-left: 0 !important;
}