/* ==========================================================================
   Page Quai 31 (Notre vision & notre équipe)
   ========================================================================== */

/* ---------- Hero ---------- */
.page-quai31 .titre-hero {
  font-size: clamp(28px, 5.2vw, 66px);
  letter-spacing: .26em;
  text-indent: .26em;
  white-space: nowrap;
}
.page-quai31 .hero-logo-quai31 {
  position: relative;
  width: min(clamp(257px, 30.8vw, 410px), calc(100vw - 32px));
  height: clamp(62px, 8vw, 92px);
  margin-inline: auto;
  overflow: visible;
}
.page-quai31 .hero-logo-quai31 img {
  position: absolute;
  top: 50%;
  left: 52.76%;
  display: block;
  width: 120.7%;
  max-width: none;
  height: auto;
  transform: translate(-50%, -50%);
}
.page-quai31 .titre-hero--sous {
  font-size: clamp(18px, 2.4vw, 27px);
  letter-spacing: .5em;
  text-indent: .5em;
  margin-top: 10px;
}
.page-quai31 .hero__texte { max-width: 720px; font-size: 17px; line-height: 1.28; }

/* ---------- Notre vision (conforme Canva : colonne unique, centrée, pleine largeur) ---------- */
.vision-seule { text-align: center; max-width: 760px; margin: 0 auto; }
.vision-seule .vision-texte { margin-top: 34px; }
.vision-seule .monogram-centre { margin-bottom: 0; }

/* ---------- Portraits Anne / Sophie (fond mocka -> texte BLANC, conforme maquette) ----------
   Anne : #cfb89d (mocka) — Sophie : #cfbea8 (mocka clair), mesurés sur le Canva p2. */
.page-quai31 .section--mocka { background: #cfb89d; }
.section--mocka-clair { background: #cfbea8; }

.portrait__diplomes--blanc { color: var(--blanc); }
.portrait__diplomes--blanc li::marker { color: var(--blanc); }

@media (max-width: 640px) {
  .page-quai31 .titre-hero:not(.hero-logo-quai31) { white-space: normal; }
  .page-quai31 .titre-hero--sous { letter-spacing: .25em; text-indent: .25em; }
}