/* =========================================================
   PAGE ACCOMPAGNEMENT — ZONE TDAH
   cssaccompagnement.css
   Chargé APRÈS style.css
   ========================================================= */


/* =========================================================
   PALETTE COMMUNE DU SITE
   ========================================================= */

body.page-accompagnement-site {
  --acc-bleu: #082d57;

  --acc-vert: #159b86;
  --acc-vert-fonce: #0e7568;
  --acc-vert-pale: #e8f7f3;

  --acc-texte: #263443;
  --acc-texte-doux: #5d6b77;

  --acc-blanc: #ffffff;
  --acc-fond: #f7faf9;

  --acc-bordure: #d5e7e3;

  --acc-ombre:
    0 12px 32px rgba(8, 45, 87, 0.08);

  --acc-ombre-legere:
    0 7px 20px rgba(8, 45, 87, 0.06);

  --acc-ombre-hover:
    0 18px 40px rgba(8, 45, 87, 0.13);
}


/* =========================================================
   BASE
   ========================================================= */

body.page-accompagnement-site
main.page-accompagnement {
  display: block;

  width: 100%;

  margin: 0;
  padding:
    168px
    0
    5rem;

  overflow: hidden;

  background:
    linear-gradient(
      180deg,
      #f4faf8 0%,
      #ffffff 32%,
      #f7faf9 100%
    );

  color: var(--acc-texte);

  font-family:
    "Be Vietnam Pro",
    Arial,
    sans-serif;

  text-align: left;
}


body.page-accompagnement-site
main.page-accompagnement,
body.page-accompagnement-site
main.page-accompagnement * {
  box-sizing: border-box;
}


body.page-accompagnement-site
main.page-accompagnement section,
body.page-accompagnement-site
main.page-accompagnement article,
body.page-accompagnement-site
main.page-accompagnement aside,
body.page-accompagnement-site
main.page-accompagnement div {
  float: none;
  max-height: none;
}


body.page-accompagnement-site
main.page-accompagnement p {
  margin:
    0
    0
    0.85rem;

  color: var(--acc-texte);

  line-height: 1.55;
}


body.page-accompagnement-site
main.page-accompagnement p:last-child {
  margin-bottom: 0;
}

body.page-accompagnement-site
main.page-accompagnement
.approche-texte p {
  margin-top: 0 !important;
  margin-bottom: 1.3rem !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

body.page-accompagnement-site
main.page-accompagnement
.approche-texte p + p {
  margin-top: 0 !important;
}


/* =========================================================
   LARGEUR GÉNÉRALE
   ========================================================= */

body.page-accompagnement-site
.hero-accompagnement,
body.page-accompagnement-site
.section-accompagnement,
body.page-accompagnement-site
.appel-final {
  width:
    min(
      1160px,
      calc(100% - 2rem)
    );

  margin-right: auto;
  margin-left: auto;
}


body.page-accompagnement-site
.section-accompagnement {
  margin-bottom: 3.6rem;
}


/* =========================================================
   SURTITRES
   ========================================================= */

body.page-accompagnement-site
main.page-accompagnement .sur-titre,
body.page-accompagnement-site
main.page-accompagnement
.hero-texte > p:first-child {
  margin:
    0
    0
    0.65rem;

  color: var(--acc-vert-fonce);

  font-size: 0.86rem;
  font-weight: 800;

  line-height: 1.35;

  letter-spacing: 0.075em;

  text-transform: uppercase;
}


/* =========================================================
   BOUTONS
   ========================================================= */

body.page-accompagnement-site
main.page-accompagnement .bouton {
  display: inline-flex;

  min-height: 48px;

  padding:
    0.78rem
    1.25rem;

  align-items: center;
  justify-content: center;

  border-radius: 999px;

  font: inherit;
  font-size: 0.93rem;
  font-weight: 750;

  text-align: center;
  text-decoration: none;

  transition:
    transform 0.2s ease,
    box-shadow 0.2s ease;
}


body.page-accompagnement-site
main.page-accompagnement .bouton:hover,
body.page-accompagnement-site
main.page-accompagnement .bouton:focus-visible {
  transform: translateY(-2px);
}


body.page-accompagnement-site
main.page-accompagnement .bouton-principal {
  border: none;

  background:
    linear-gradient(
      135deg,
      var(--acc-vert-fonce),
      var(--acc-vert)
    );

  color: #ffffff;

  box-shadow:
    0 8px 20px
    rgba(8, 45, 87, 0.14);
}


body.page-accompagnement-site
main.page-accompagnement .bouton-principal:hover,
body.page-accompagnement-site
main.page-accompagnement .bouton-principal:focus-visible {
  box-shadow:
    0 12px 26px
    rgba(8, 45, 87, 0.2);
}


body.page-accompagnement-site
main.page-accompagnement .bouton-secondaire {
  border:
    1px solid
    var(--acc-vert);

  background: var(--acc-blanc);

  color: var(--acc-vert-fonce);
}


/* =========================================================
   GRAND CADRE DU HAUT
   ========================================================= */

body.page-accompagnement-site
main.page-accompagnement
.hero-accompagnement {
  display: grid;

  grid-template-columns:
    minmax(0, 1.45fr)
    minmax(300px, 0.55fr);

  gap: 3rem;

  align-items: center;

  margin-bottom: 4.5rem;

  padding:
    2.5rem
    2.8rem;

  border:
    1px solid
    var(--acc-bordure);

  border-radius: 30px;

  background:
    radial-gradient(
      circle at 94% 8%,
      rgba(21, 155, 134, 0.09),
      transparent 30%
    ),
    linear-gradient(
      115deg,
      #ffffff 0%,
      #f5fbf9 58%,
      var(--acc-vert-pale) 100%
    );

  box-shadow: var(--acc-ombre);
}


/* =========================================================
   TEXTE DU HERO
   ========================================================= */

body.page-accompagnement-site
main.page-accompagnement .hero-texte {
  width: 100%;

  margin: 0;
  padding: 0;

  text-align: left;
}


body.page-accompagnement-site
main.page-accompagnement .hero-texte h1 {
  max-width: 760px;

  margin:
    0
    0
    1.25rem;

  padding: 0;

  color: var(--acc-bleu);

  font-size:
    clamp(
      2.45rem,
      4.4vw,
      4.15rem
    );

  line-height: 1.05;

  letter-spacing: -0.035em;

  text-align: left;
}


body.page-accompagnement-site
main.page-accompagnement .hero-intro {
  max-width: 700px;

  margin:
    0
    0
    1.5rem;

  color: var(--acc-texte-doux);

  font-size: 1.05rem;

  line-height: 1.6;
}


body.page-accompagnement-site
main.page-accompagnement .hero-actions {
  display: flex;

  flex-wrap: wrap;

  gap: 0.85rem;

  margin-top: 1.3rem;
}


/* =========================================================
   ENCADRÉ DROIT DU HERO
   ========================================================= */

body.page-accompagnement-site
main.page-accompagnement .hero-informations {
  padding: 1.8rem;

  border:
    1px solid
    var(--acc-bordure);

  border-radius: 22px;

  background:
    rgba(255, 255, 255, 0.88);

  box-shadow:
    var(--acc-ombre-legere);
}


body.page-accompagnement-site
main.page-accompagnement .hero-informations h2 {
  margin:
    0
    0
    1.1rem;

  padding: 0;

  color: var(--acc-bleu);

  font-size: 1.25rem;

  line-height: 1.3;
}


body.page-accompagnement-site
main.page-accompagnement .hero-informations ul {
  display: grid;

  gap: 0.75rem;

  margin: 0;
  padding: 0;

  list-style: none;
}


body.page-accompagnement-site
main.page-accompagnement .hero-informations li {
  position: relative;

  margin: 0;

  padding-left: 1.6rem;

  color: var(--acc-texte);

  font-size: 0.96rem;
  font-weight: 600;

  line-height: 1.45;
}


body.page-accompagnement-site
main.page-accompagnement .hero-informations li::before {
  content: "✓";

  position: absolute;

  top: 0;
  left: 0;

  color: var(--acc-vert);

  font-weight: 900;
}


/* =========================================================
   ENTÊTES DE SECTIONS
   ========================================================= */

body.page-accompagnement-site
main.page-accompagnement .section-entete {
  max-width: 820px;

  margin:
    0
    auto
    2rem;

  padding: 0;

  text-align: center;
}


body.page-accompagnement-site
main.page-accompagnement .section-entete h2,
body.page-accompagnement-site
main.page-accompagnement .rencontre-contenu h2,
body.page-accompagnement-site
main.page-accompagnement .limites-contenu h2,
body.page-accompagnement-site
main.page-accompagnement .appel-final h2 {
  margin:
    0
    0
    0.9rem;

  padding: 0;

  color: var(--acc-bleu);

  font-size:
    clamp(
      1.8rem,
      3.4vw,
      2.8rem
    );

  line-height: 1.15;

  letter-spacing: -0.02em;
}


body.page-accompagnement-site
main.page-accompagnement
.section-entete::after {
  content: "";

  display: block;

  width: 58px;
  height: 4px;

  margin:
    1.1rem
    auto
    0;

  border-radius: 999px;

  background:
    linear-gradient(
      90deg,
      var(--acc-vert),
      var(--acc-vert-fonce)
    );
}


/* =========================================================
   « VOUS VOUS RECONNAISSEZ »
   ========================================================= */

body.page-accompagnement-site
main.page-accompagnement .grille-reperes {
  display: grid;

  grid-template-columns:
    repeat(
      3,
      minmax(0, 1fr)
    );

  gap: 1.15rem;
}


body.page-accompagnement-site
main.page-accompagnement .carte-repere {
  position: relative;

  display: flex;

  min-height: 0;

  padding:
    1.25rem
    1.4rem;

  overflow: hidden;

  flex-direction: column;
  align-items: center;
  justify-content: center;

  border:
    1px solid
    var(--acc-bordure);

  border-radius: 22px;

  background:
    linear-gradient(
      180deg,
      #ffffff 0%,
      #fbfdfd 100%
    );

  box-shadow: var(--acc-ombre-legere);

  text-align: center;

  transition:
    transform 0.2s ease,
    box-shadow 0.2s ease;
}


body.page-accompagnement-site
main.page-accompagnement
.carte-repere:hover {
  transform: translateY(-3px);

  box-shadow: var(--acc-ombre-hover);
}


body.page-accompagnement-site
main.page-accompagnement
.carte-repere::before {
  content: "✓";

  display: grid;

  width: 34px;
  height: 34px;

  margin:0 auto  0.65rem;

  place-items: center;

  border-radius: 50%;

  background: var(--acc-vert-pale);

  color: var(--acc-vert-fonce);

  font-size: 0.95rem;
  font-weight: 900;
}


body.page-accompagnement-site
main.page-accompagnement .numero-carte {
  display: none;
}


body.page-accompagnement-site
main.page-accompagnement .carte-repere h3 {
  margin: 0 0 0.4rem;

  color: var(--acc-bleu);

  font-size: 1.15rem;
  line-height: 1.3;

  text-align: center;
}


body.page-accompagnement-site
main.page-accompagnement .carte-repere p {
  position: relative;

  z-index: 1;

  max-width: 320px;

  margin: 0;

  color: var(--acc-texte-doux);

  font-size: 1.05rem;

  line-height: 1.5;

  text-align: center;
}


/* =========================================================
   CE QUE L'ACCOMPAGNEMENT PEUT APPORTER
   ========================================================= */

body.page-accompagnement-site
main.page-accompagnement .section-resultats {
  padding: 2.5rem;

  border:
    1px solid
    var(--acc-bordure);

  border-radius: 26px;

  background:
    linear-gradient(
      120deg,
      #ffffff 0%,
      #f5fbf9 55%,
      var(--acc-vert-pale) 100%
    );

  box-shadow:
    var(--acc-ombre-legere);
}


body.page-accompagnement-site
main.page-accompagnement .grille-benefices {
  display: grid;

  grid-template-columns:
    repeat(
      2,
      minmax(0, 1fr)
    );

  gap: 1rem;
}


body.page-accompagnement-site
main.page-accompagnement .benefice {
  position: relative;

  padding: 1.55rem;

  border:
    1px solid
    var(--acc-bordure);

  border-radius: 20px;

  background:
    rgba(255, 255, 255, 0.88);

  box-shadow:
    0 6px 18px
    rgba(8, 45, 87, 0.05);
}


body.page-accompagnement-site
main.page-accompagnement .benefice h3 {
  position: relative;

  margin:
    0
    0
    0.55rem;

  padding-left: 1rem;

  color: var(--acc-bleu);

  font-size: 1.15rem;

  line-height: 1.35;
}


body.page-accompagnement-site
main.page-accompagnement .benefice h3::before {
  content: "";

  position: absolute;

  top: 0.1rem;
  left: 0;

  width: 4px;
  height: 1.25rem;

  border-radius: 999px;

  background: var(--acc-vert);
}


body.page-accompagnement-site
main.page-accompagnement .benefice p {
  margin: 0;

  color: var(--acc-texte-doux);
 font-size: 1.1rem;
  line-height: 1.5;
}


/* =========================================================
   MA FAÇON DE VOUS ACCOMPAGNER
   ========================================================= */

body.page-accompagnement-site
main.page-accompagnement .section-approche {
  display: grid;

  grid-template-columns:
    230px
    minmax(0, 1fr);

  gap: 1.6rem;

  align-items: start;
}


body.page-accompagnement-site
main.page-accompagnement .approche-photo {
  width: 230px;

  justify-self: center;
}


body.page-accompagnement-site
main.page-accompagnement .portrait-placeholder {
  display: grid;

  width: 230px;
  height: 300px;

  margin: 0 auto;
  padding: 1.3rem;

  place-items: center;
  align-content: center;

  border:
    2px dashed
    #8fcdbf;

  border-radius: 24px;

  background:
    radial-gradient(
      circle at 50% 15%,
      rgba(21, 155, 134, 0.14),
      transparent 40%
    ),
    linear-gradient(
      145deg,
      var(--acc-vert-pale),
      #ffffff
    );

  box-shadow:
    var(--acc-ombre-legere);

  text-align: center;
}


body.page-accompagnement-site
main.page-accompagnement
.portrait-placeholder-icone {
  margin-bottom: 0.8rem;

  color: var(--acc-vert);

  font-size: 1.7rem;
}


body.page-accompagnement-site
main.page-accompagnement
.portrait-placeholder-titre {
  color: var(--acc-bleu);

  font-weight: 750;

  text-align: center;
}


body.page-accompagnement-site
main.page-accompagnement .portrait-professionnel {
  display: block;

  width: 230px;
  height: 300px;

  margin: 0 auto;

  border-radius: 24px;

  object-fit: cover;
  object-position: center;

  box-shadow:
    var(--acc-ombre-legere);
}


body.page-accompagnement-site
main.page-accompagnement .approche-contenu {
  width: 100%;
  min-width: 0;
}


body.page-accompagnement-site
main.page-accompagnement .approche-texte {
  padding:
    1.25rem
    2rem
    1.5rem;

  border:
    1px solid
    var(--acc-bordure);

  border-radius: 22px;

  background:
    rgba(255, 255, 255, 0.9);

  box-shadow:
    var(--acc-ombre-legere);
}


body.page-accompagnement-site
main.page-accompagnement
.approche-texte .sur-titre {
  margin-bottom: 0.3rem;
}


body.page-accompagnement-site
main.page-accompagnement .approche-texte h1 {
  margin:
    0
    0
    1.5rem;

  color: var(--acc-bleu);

  font-size:
    clamp(
      2rem,
      3.5vw,
      2.8rem
    );

  line-height: 1.15;
}


body.page-accompagnement-site
main.page-accompagnement
.approche-texte p:not(.sur-titre) {
  margin: 0 0 0.45rem;

  color: var(--acc-texte-doux);

  font-size: 1.08rem;
  line-height: 1.55;
}


/* =========================================================
   DÉROULEMENT
   ========================================================= */

body.page-accompagnement-site
main.page-accompagnement .ligne-temps {
  display: grid;

  gap: 0.9rem;

  max-width: 940px;

  margin: 0 auto;
}


body.page-accompagnement-site
main.page-accompagnement .etape {
  display: grid;

  grid-template-columns:
    52px
    minmax(0, 1fr);

  gap: 1rem;

  padding:
    1.2rem
    1.4rem;

  align-items: start;

  border:
    1px solid
    var(--acc-bordure);

  border-radius: 18px;

  background: var(--acc-blanc);

  box-shadow:
    var(--acc-ombre-legere);

  transition:
    transform 0.2s ease,
    box-shadow 0.2s ease;
}


body.page-accompagnement-site
main.page-accompagnement .etape:hover {
  transform: translateX(3px);

  box-shadow: var(--acc-ombre-hover);
}


body.page-accompagnement-site
main.page-accompagnement .etape-numero {
  display: grid;

  width: 46px;
  height: 46px;

  place-items: center;

  border-radius: 50%;

  background:
    linear-gradient(
      135deg,
      var(--acc-vert-fonce),
      var(--acc-vert)
    );

  color: #ffffff;

  font-weight: 800;

  box-shadow:
    0 6px 16px
    rgba(21, 155, 134, 0.2);
}


body.page-accompagnement-site
main.page-accompagnement .etape h3 {
  margin:
    0
    0
    0.3rem;

  color: var(--acc-bleu);

  font-size: 1.25rem;

  line-height: 1.35;
}


body.page-accompagnement-site
main.page-accompagnement .etape p {
  margin: 0;

  color: var(--acc-texte-doux);

  font-size: 1.05rem;

  line-height: 1.5;
}


/* =========================================================
   RENCONTRE INDIVIDUELLE
   ========================================================= */

body.page-accompagnement-site
main.page-accompagnement .section-rencontre {
  display: block;
}


body.page-accompagnement-site
main.page-accompagnement .rencontre-contenu {
  width:
    min(
      560px,
      100%
    );

  margin: 0 auto;

  padding:
    2rem
    2.2rem
    2.2rem;

  border:
    1px solid
    var(--acc-bordure);

  border-radius: 22px;

  background:
    linear-gradient(
      135deg,
      #ffffff 0%,
      #f5fbf9 100%
    );

  box-shadow:
    var(--acc-ombre);
}


body.page-accompagnement-site
main.page-accompagnement .rencontre-contenu h2 {
  margin:
    0
    0
    1.5rem;

  text-align: left;
}


body.page-accompagnement-site
main.page-accompagnement .prix-rencontre {
  display: flex;

  margin:
    0
    0
    1.2rem;

  align-items: baseline;

  gap: 0.65rem;
}


body.page-accompagnement-site
main.page-accompagnement .prix-montant {
  color: var(--acc-bleu);

  font-size:
    clamp(
      2.25rem,
      3.6vw,
      3rem
    );

  font-weight: 800;

  line-height: 1;

  letter-spacing: -0.03em;
}


body.page-accompagnement-site
main.page-accompagnement .prix-detail {
  color: var(--acc-texte-doux);

  font-size: 1rem;
  font-weight: 700;
}


body.page-accompagnement-site
main.page-accompagnement .liste-pratique {
  display: grid;

  gap: 0.55rem;

  margin:
    0.8rem
    0
    0;

  padding: 0;

  list-style: none;
}


body.page-accompagnement-site
main.page-accompagnement .liste-pratique li {
  position: relative;

  margin: 0;

  padding-left: 1.55rem;

  color: var(--acc-texte);

  font-size: 1rem;

  line-height: 1.45;
}


body.page-accompagnement-site
main.page-accompagnement
.liste-pratique li::before {
  content: "✓";

  position: absolute;

  top: 0;
  left: 0;

  color: var(--acc-vert);

  font-weight: 900;
}


body.page-accompagnement-site
main.page-accompagnement .bouton-large {
  width: 100%;

  margin-top: 1.6rem;
}


/* =========================================================
   NATURE ET LIMITES
   ========================================================= */

body.page-accompagnement-site
main.page-accompagnement .section-limites {
  padding:
    1.7rem
    2rem;

  border:
    1px solid
    var(--acc-bordure);

  border-left:
    5px solid
    var(--acc-vert);

  border-radius: 18px;

  background:
    linear-gradient(
      90deg,
      var(--acc-vert-pale) 0%,
      #ffffff 25%
    );

  box-shadow:
    var(--acc-ombre-legere);
}


body.page-accompagnement-site
main.page-accompagnement .section-limites h2 {
  font-size:
    clamp(
      1.7rem,
      3vw,
      2.35rem
    );
}


body.page-accompagnement-site
main.page-accompagnement .section-limites p {
  margin-bottom: 0.55rem;

  color: var(--acc-texte-doux);

  line-height: 1.5;
}


/* =========================================================
   FAQ
   ========================================================= */

body.page-accompagnement-site
main.page-accompagnement .faq-liste {
  display: grid;

  gap: 0.8rem;

  max-width: 980px;

  margin: 0 auto;
}


body.page-accompagnement-site
main.page-accompagnement .faq-liste details {
  overflow: hidden;

  border:
    1px solid
    var(--acc-bordure);

  border-radius: 18px;

  background: var(--acc-blanc);

  box-shadow:
    var(--acc-ombre-legere);

  transition:
    border-color 0.2s ease,
    box-shadow 0.2s ease;
}


body.page-accompagnement-site
main.page-accompagnement
.faq-liste details[open] {
  border-color: #9dd3c8;

  background:
    linear-gradient(
      180deg,
      #ffffff,
      #f7fcfa
    );
}


body.page-accompagnement-site
main.page-accompagnement .faq-liste summary {
  position: relative;

  display: block;

  min-height: 64px;

  padding:
    1.15rem
    4rem
    1.15rem
    1.4rem;

  color: var(--acc-bleu);

  font-size: 1.08rem;
  font-weight: 750;

  line-height: 1.4;

  cursor: pointer;

  list-style: none;
}


body.page-accompagnement-site
main.page-accompagnement
.faq-liste summary::-webkit-details-marker {
  display: none;
}


body.page-accompagnement-site
main.page-accompagnement
.faq-liste summary::after {
  content: "+";

  position: absolute;

  top: 50%;
  right: 1.4rem;

  display: grid;

  width: 34px;
  height: 34px;

  place-items: center;

  border-radius: 50%;

  background: var(--acc-vert-pale);

  color: var(--acc-vert-fonce);

  font-size: 1.3rem;

  transform: translateY(-50%);
}


body.page-accompagnement-site
main.page-accompagnement
.faq-liste details[open]
summary::after {
  content: "−";
}


body.page-accompagnement-site
main.page-accompagnement
.faq-liste details p {
  margin: 0;

  padding:
    0
    1.4rem
    1.3rem;

  color: var(--acc-texte-doux);

  font-size: 1rem;

  line-height: 1.6;
}


/* =========================================================
   SERVICES À VENIR
   ========================================================= */

body.page-accompagnement-site
main.page-accompagnement .section-a-venir {
  display: flex;

  padding:
    1.6rem
    2rem;

  align-items: center;
  justify-content: space-between;

  gap: 1.5rem;

  border:
    1px dashed
    #81c8b9;

  border-radius: 22px;

  background:
    linear-gradient(
      135deg,
      var(--acc-vert-pale),
      #ffffff
    );
}


body.page-accompagnement-site
main.page-accompagnement .section-a-venir h2 {
  margin:
    0
    0
    0.4rem;

  color: var(--acc-bleu);

  font-size:
    clamp(
      1.55rem,
      2.8vw,
      2.2rem
    );

  line-height: 1.2;
}


body.page-accompagnement-site
main.page-accompagnement .badge-a-venir {
  flex:
    0
    0
    auto;

  padding:
    0.6rem
    1rem;

  border-radius: 999px;

  background:
    linear-gradient(
      135deg,
      var(--acc-vert-fonce),
      var(--acc-vert)
    );

  color: #ffffff;

  font-size: 0.85rem;
  font-weight: 800;

  box-shadow:
    0 6px 16px
    rgba(8, 45, 87, 0.1);
}


/* =========================================================
   APPEL FINAL
   ========================================================= */

body.page-accompagnement-site
main.page-accompagnement .appel-final {
  display: flex;

  margin-top: 1rem;

  padding:
    1.8rem
    2rem;

  align-items: center;
  justify-content: space-between;

  gap: 1.5rem;

  border:
    1px solid
    var(--acc-bordure);

  border-radius: 22px;

  background:
    linear-gradient(
      120deg,
      #ffffff 0%,
      #f5fbf9 55%,
      var(--acc-vert-pale) 100%
    );

  box-shadow:
    var(--acc-ombre-legere);
}


body.page-accompagnement-site
main.page-accompagnement .appel-final h2 {
  max-width: 760px;

  margin-bottom: 0.55rem;

  font-size:
    clamp(
      1.7rem,
      3vw,
      2.4rem
    );
}


/* =========================================================
   TABLETTE
   ========================================================= */

@media (max-width: 980px) {

  body.page-accompagnement-site
  main.page-accompagnement
  .hero-accompagnement {
    grid-template-columns: 1fr;

    gap: 2rem;
  }


  body.page-accompagnement-site
  main.page-accompagnement
  .grille-reperes {
    grid-template-columns:
      repeat(
        2,
        minmax(0, 1fr)
      );
  }


  body.page-accompagnement-site
  main.page-accompagnement
  .section-approche {
    grid-template-columns: 1fr;
  }


  body.page-accompagnement-site
  main.page-accompagnement
  .approche-photo {
    width: 230px;

    margin: 0 auto;
  }


  body.page-accompagnement-site
  main.page-accompagnement
  .appel-final {
    align-items: flex-start;

    flex-direction: column;
  }

}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 700px) {

  body.page-accompagnement-site
  main.page-accompagnement {
    padding-top: 105px;
  }


  body.page-accompagnement-site
  .hero-accompagnement,
  body.page-accompagnement-site
  .section-accompagnement,
  body.page-accompagnement-site
  .appel-final {
    width:
      calc(
        100% - 1rem
      );
  }


  body.page-accompagnement-site
  main.page-accompagnement
  .hero-accompagnement {
    gap: 1.5rem;

    margin-bottom: 3rem;

    padding: 1.4rem;

    border-radius: 22px;
  }


  body.page-accompagnement-site
  main.page-accompagnement
  .hero-texte h1 {
    font-size: 2.25rem;
  }


  body.page-accompagnement-site
  main.page-accompagnement
  .hero-actions {
    align-items: stretch;

    flex-direction: column;
  }


  body.page-accompagnement-site
  main.page-accompagnement
  .hero-actions .bouton {
    width: 100%;
  }


  body.page-accompagnement-site
  main.page-accompagnement
  .hero-informations {
    padding: 1.4rem;
  }


  body.page-accompagnement-site
  main.page-accompagnement
  .section-accompagnement {
    margin-bottom: 2.8rem;
  }


  body.page-accompagnement-site
  main.page-accompagnement
  .grille-reperes,
  body.page-accompagnement-site
  main.page-accompagnement
  .grille-benefices {
    grid-template-columns: 1fr;
  }


  body.page-accompagnement-site
  main.page-accompagnement
  .carte-repere {
    min-height: 0;

    padding:
      1.6rem
      1.3rem;
  }


  body.page-accompagnement-site
  main.page-accompagnement
  .section-resultats {
    padding: 1.35rem;
  }


  body.page-accompagnement-site
  main.page-accompagnement
  .approche-texte {
    padding:
      1.25rem
      1.3rem;
  }


  body.page-accompagnement-site
  main.page-accompagnement
  .portrait-placeholder,
  body.page-accompagnement-site
  main.page-accompagnement
  .portrait-professionnel {
    width: 210px;
    height: 275px;
  }


  body.page-accompagnement-site
  main.page-accompagnement
  .etape {
    grid-template-columns:
      44px
      minmax(0, 1fr);

    padding:
      1.1rem
      1rem;
  }


  body.page-accompagnement-site
  main.page-accompagnement
  .etape-numero {
    width: 40px;
    height: 40px;
  }


  body.page-accompagnement-site
  main.page-accompagnement
  .rencontre-contenu {
    padding: 1.4rem;
  }


  body.page-accompagnement-site
  main.page-accompagnement
  .prix-rencontre {
    align-items: flex-start;

    flex-direction: column;

    gap: 0.15rem;
  }


  body.page-accompagnement-site
  main.page-accompagnement
  .section-limites {
    padding:
      1.4rem
      1.25rem;
  }


  body.page-accompagnement-site
  main.page-accompagnement
  .faq-liste summary {
    min-height: 62px;

    padding:
      1.05rem
      3.5rem
      1.05rem
      1.15rem;

    font-size: 1.02rem;
  }


  body.page-accompagnement-site
  main.page-accompagnement
  .faq-liste summary::after {
    right: 0.9rem;
  }


  body.page-accompagnement-site
  main.page-accompagnement
  .faq-liste details p {
    padding:
      0
      1.15rem
      1.15rem;

    font-size: 0.98rem;
  }


  body.page-accompagnement-site
  main.page-accompagnement
  .section-a-venir {
    align-items: flex-start;

    flex-direction: column;

    padding:
      1.4rem
      1.3rem;
  }


  body.page-accompagnement-site
  main.page-accompagnement
  .appel-final {
    padding:
      1.5rem
      1.3rem;
  }

  /* =======================================================
   INTRO ACCOMPAGNEMENT — ENLEVER LES BLOCS BLANCS
   ======================================================= */

body.page-accompagnement-site
main.page-accompagnement
.hero-accompagnement
.hero-texte
p {
  padding: 0 !important;

  background: transparent !important;

  border: 0 !important;
  border-radius: 0 !important;

  box-shadow: none !important;
}

}