/* Page À propos — à charger après pages-services.css */

.page-a-propos { background: var(--creme); }

.profil-hero {
  padding-block: clamp(3.5rem, 8vw, 7rem) clamp(5rem, 10vw, 9rem);
}

.profil-hero-grille {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(320px, .85fr);
  align-items: center;
  gap: clamp(3rem, 7vw, 7rem);
}

.profil-hero h1 {
  max-width: 16ch;
  font-size: clamp(2.8rem, 6vw, 5.35rem);
  text-wrap: balance;
}

.profil-introduction {
  max-width: 760px;
  margin: 2rem 0 0;
  font-size: clamp(1.125rem, 2vw, 1.375rem);
}

.profil-portrait {
  width: min(100%, 510px);
  margin: 0;
  padding: .65rem;
  justify-self: end;
  border-top: 4px solid var(--rose);
  background: var(--blanc);
  box-shadow: 1.1rem 1.1rem 0 var(--sable);
}

.profil-portrait img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 1122 / 1402;
  object-fit: cover;
}

.profil-reperes {
  margin-top: clamp(3rem, 6vw, 5rem);
  padding: clamp(1.75rem, 3vw, 2.5rem);
  border-top: 4px solid var(--rose);
  background: var(--blanc);
}

.profil-reperes-titre {
  margin: 0 0 1.5rem;
  color: var(--rose);
  font-size: .75rem;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
}

.profil-reperes dl {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin: 0;
}
.profil-reperes dl div {
  padding: .25rem clamp(1rem, 2.5vw, 2rem);
  border-left: 1px solid var(--sable);
}
.profil-reperes dl div:first-child {
  padding-left: 0;
  border-left: 0;
}
.profil-reperes dl div:last-child { padding-right: 0; }
.profil-reperes dt { font-weight: 700; }
.profil-reperes dd { margin: .25rem 0 0; font-size: .925rem; }

.profil-section { padding-block: clamp(5rem, 10vw, 8rem); }

.profil-grille-editoriale {
  display: grid;
  grid-template-columns: minmax(250px, .65fr) minmax(0, 1.35fr);
  gap: clamp(3rem, 9vw, 8rem);
}

.profil-grille-editoriale header { align-self: start; }

.profil-grille-editoriale h2,
.profil-entete-clair h2,
.profil-appel h2 {
  max-width: 15ch;
  margin: 0;
  font-size: clamp(2.3rem, 5vw, 4.5rem);
  font-weight: 600;
  letter-spacing: -.04em;
  line-height: 1.05;
  text-wrap: balance;
}

.profil-texte {
  padding-top: 1.5rem;
  border-top: 4px solid var(--rose);
}

.profil-texte p { max-width: 760px; margin: 0; }
.profil-texte p + p { margin-top: 1.5rem; }
.profil-texte .bouton-secondaire { margin-top: 2rem; }

.profil-chapeau {
  font-size: clamp(1.15rem, 2vw, 1.4rem);
  font-weight: 600;
  line-height: 1.5;
}

.profil-parcours,
.profil-horizons { background: var(--blanc); }

.profil-expertise {
  background: var(--bleu);
  color: var(--creme);
}

.profil-entete-clair { max-width: 900px; margin-bottom: clamp(3.5rem, 7vw, 6rem); }
.profil-entete-clair .sur-titre { color: var(--sable); }
.profil-entete-clair > p:last-child {
  max-width: 680px;
  margin: 1.5rem 0 0;
  font-size: clamp(1.05rem, 1.6vw, 1.2rem);
}

.profil-cartes {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.profil-cartes article {
  min-height: 270px;
  padding: clamp(2rem, 4vw, 3rem);
  border-top: 1px solid rgb(255 255 255 / 28%);
  border-right: 1px solid rgb(255 255 255 / 28%);
}

.profil-cartes article:nth-child(2n) { border-right: 0; }
.profil-cartes .numero-bloc { color: var(--sable); }
.profil-cartes h3 { margin: 2rem 0 0; font-size: clamp(1.45rem, 2.5vw, 2rem); line-height: 1.15; }
.profil-cartes article > p:last-child { max-width: 520px; margin: 1.25rem 0 0; }

.profil-cadre { background: var(--creme); }

.profil-appel {
  padding-block: clamp(5rem, 10vw, 8rem);
  background: var(--bleu);
  color: var(--creme);
}

.profil-appel .sur-titre { color: var(--sable); }

.profil-appel-grille {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(280px, .85fr);
  align-items: start;
  gap: clamp(3rem, 8vw, 7rem);
}

.profil-appel-grille > div:last-child {
  padding-top: 1.5rem;
  border-top: 4px solid var(--sable);
}

.profil-appel-grille > div:last-child > p {
  max-width: 620px;
  margin: 0;
  font-size: clamp(1.05rem, 1.7vw, 1.2rem);
}

.bouton-secondaire-clair {
  border-color: var(--creme);
  color: var(--creme);
}

.bouton-secondaire-clair:hover {
  border-color: var(--sable);
  color: var(--sable);
}

@media (max-width: 850px) {
  .profil-hero-grille,
  .profil-grille-editoriale,
  .profil-appel-grille { grid-template-columns: 1fr; }

  .profil-portrait {
    justify-self: start;
  }

  .profil-reperes { max-width: 680px; }
  .profil-reperes dl { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .profil-reperes dl div { padding-block: 1rem; }
  .profil-reperes dl div:nth-child(odd) {
    padding-left: 0;
    border-left: 0;
  }
  .profil-reperes dl div:nth-child(n + 3) { border-top: 1px solid var(--sable); }
  .profil-cartes article { min-height: auto; }
}

@media (max-width: 650px) {
  .profil-hero { padding-top: 2.5rem; }
  .profil-portrait {
    width: calc(100% - 1rem);
    box-shadow: .75rem .75rem 0 var(--sable);
  }
  .profil-reperes dl { grid-template-columns: 1fr; }
  .profil-reperes dl div,
  .profil-reperes dl div:nth-child(odd) {
    padding-inline: 0;
    border-top: 1px solid var(--sable);
    border-left: 0;
  }
  .profil-reperes dl div:first-child { border-top: 0; }
  .profil-cartes { grid-template-columns: 1fr; }
  .profil-cartes article,
  .profil-cartes article:nth-child(2n) { padding-inline: 0; border-right: 0; }
}
