
/* Page "La méthode" reconstruite proprement depuis la maquette validée.
   Aucun héritage des anciennes versions méthode. */

.method-clean-page .home-header .menu a[aria-current="page"]{
  color:var(--home-green);
  position:relative;
}
.method-clean-page .home-header .menu a[aria-current="page"]::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:-.6rem;
  height:1px;
  background:var(--home-green);
}

/* Hero forêt */
.method-forest-hero{
  height:520px;
  background:url("../img/foret-methode.jpg") center 48%/cover no-repeat;
}

/* Bloc méthode */
.method-core{
  background:#fbfaf7;
  padding:3rem 0 3.3rem;
}
.method-core-inner{
  width:min(1500px,calc(100% - 4rem));
  margin:0 auto;
  text-align:center;
}
.method-kicker{
  margin:0 0 .6rem;
  color:#729482;
  font-size:.74rem;
  font-weight:700;
  letter-spacing:.18em;
}
.method-core h1{
  margin:0;
  color:#17483a;
  font-family:"Cormorant Garamond",serif;
  font-size:clamp(3.25rem,4.2vw,4.5rem);
  line-height:1;
  font-weight:600;
}
.method-intro-copy{
  margin:1rem auto 0;
  max-width:960px;
  color:#262b28;
  font-family:"Cormorant Garamond",serif;
  font-size:1.16rem;
  line-height:1.5;
}
.method-rule{
  display:block;
  width:50px;
  height:1px;
  margin:1.1rem auto 0;
  background:#789889;
}
.method-steps{
  display:grid;
  grid-template-columns:minmax(0,1fr) 100px minmax(0,1fr) 100px minmax(0,1fr) 100px minmax(0,1fr);
  align-items:start;
  gap:0;
  margin-top:.8rem;
}
.method-step{
  text-align:center;
}
.method-step img{
  display:block;
  width:92px;
  height:92px;
  margin:0 auto .55rem;
  object-fit:contain;
}
.method-step h2{
  margin:0;
  color:#17483a;
  font-family:"Cormorant Garamond",serif;
  font-size:2rem;
  line-height:1;
  font-weight:600;
}
.method-mini-rule{
  display:block;
  width:38px;
  height:1px;
  margin:.65rem auto .7rem;
  background:#789889;
}
.method-step p{
  max-width:300px;
  margin:0 auto;
  color:#171b19;
  font-size:.82rem;
  line-height:1.55;
  font-weight:500;
}
.method-arrow{
  margin-top:43px;
  color:#5f907c;
  font-size:2rem;
  line-height:1;
}
.method-rule-bottom{
  margin-top:1.3rem;
}

/* Bloc "Une relation claire et responsable" */
.method-frame-clean{
  display:grid;
  grid-template-columns:1fr 1fr;
  min-height:720px;
  background:#fbfaf7;
}
.method-frame-image{
  background:url("../img/foret-methode.jpg") center center/cover no-repeat;
}
.method-frame-copy{
  display:flex;
  flex-direction:column;
  justify-content:center;
  padding:5.5rem 7vw;
}
.method-frame-kicker{
  margin:0 0 1rem;
  color:#607a6e;
  font-size:.72rem;
  font-weight:700;
  letter-spacing:.18em;
}
.method-frame-copy h2{
  margin:0 0 1.2rem;
  max-width:600px;
  color:#173b30;
  font-family:"Cormorant Garamond",serif;
  font-size:clamp(3.1rem,4.2vw,4.7rem);
  line-height:1.02;
  font-weight:600;
}
.method-frame-copy > p{
  max-width:720px;
  margin:0 0 1.6rem;
  color:#5a625e;
  font-size:1rem;
  line-height:1.7;
}
.method-frame-copy ul{
  list-style:none;
  padding:0;
  margin:0 0 1.8rem;
}
.method-frame-copy li{
  position:relative;
  padding-left:1.55rem;
  margin:.75rem 0;
  color:#25302b;
  font-size:1rem;
}
.method-frame-copy li::before{
  content:"✓";
  position:absolute;
  left:0;
  color:#789b89;
  font-weight:700;
}
.method-frame-copy .btn{
  align-self:flex-start;
}

@media(max-width:1050px){
  .method-steps{
    grid-template-columns:1fr 1fr;
    gap:3rem 2rem;
  }
  .method-arrow{display:none}
}
@media(max-width:900px){
  .method-forest-hero{height:400px}
  .method-frame-clean{grid-template-columns:1fr}
  .method-frame-image{min-height:420px}
}
@media(max-width:620px){
  .method-core-inner{width:calc(100% - 2rem)}
  .method-steps{grid-template-columns:1fr}
  .method-step p{max-width:340px}
}


/* =========================================================
   V5 — ajustements demandés après mise en ligne
   ========================================================= */

/* Titre sur une seule ligne */
.method-core h1{
  max-width:none;
  white-space:nowrap;
  font-size:clamp(3rem,4vw,4.25rem);
}

/* Espace plus important entre intro et progression */
.method-rule{
  margin-top:1.4rem;
}
.method-steps{
  margin-top:4.6rem;
}

/* Fond du bloc méthode identique au bandeau */
.method-core{
  background:var(--home-cream);
  padding-top:3.2rem;
  padding-bottom:6.5rem;
}

/* Reproduire un espace équivalent avant le bloc suivant */
.method-frame-clean{
  margin-top:4.6rem;
}

/* Footer : conserve strictement celui de l'accueil */
.method-clean-page .home-footer{
  margin-top:0;
}

@media(max-width:1050px){
  .method-core h1{
    white-space:normal;
  }
}


/* FORCE V6 — même règles que dans methode.html */
.method-clean-page .method-core{
  background:#f7f4ed !important;
  padding-top:3.8rem !important;
  padding-bottom:7rem !important;
}
.method-clean-page .method-core h1{
  max-width:none !important;
  width:100% !important;
  white-space:nowrap !important;
  font-size:clamp(2.9rem,3.8vw,4.05rem) !important;
  line-height:1 !important;
}
.method-clean-page .method-steps{
  margin-top:5.8rem !important;
}
.method-clean-page .method-frame-clean{
  margin-top:5.8rem !important;
}
@media(max-width:1100px){
  .method-clean-page .method-core h1{
    white-space:normal !important;
  }
}


/* =========================================================
   VERSION FINALE VALIDÉE — PAGE « LA MÉTHODE »
   ========================================================= */

/* Aucune ligne décorative sous le texte introductif */
.method-clean-page .method-rule,
.method-clean-page .method-rule-bottom,
.method-clean-page .method-center-rule,
.method-clean-page .method-bottom-rule{
  display:none !important;
}

/* Supprimer toute ligne située au-dessus des pictogrammes */
.method-clean-page .method-step::before,
.method-clean-page .method-step::after,
.method-clean-page .method-steps::before,
.method-clean-page .method-steps::after{
  content:none !important;
  display:none !important;
  border:0 !important;
  background:none !important;
}

/* Les pictogrammes restent seuls, sans ligne supérieure */
.method-clean-page .method-step{
  border-top:0 !important;
  background-image:none !important;
}

/* Supprimer toute ligne horizontale parasite sous/entre les étapes */
.method-clean-page .method-steps{
  border-top:0 !important;
  border-bottom:0 !important;
  background-image:none !important;
}
.method-clean-page .method-step + .method-arrow,
.method-clean-page .method-arrow + .method-step{
  border:0 !important;
}

/* Pictogramme Construire : version améliorée */
.method-clean-page .method-step img[src*="method-construire-final"]{
  width:96px !important;
  height:96px !important;
  object-fit:contain !important;
  filter:none !important;
}

/* Conserver uniquement les petits traits sous les TITRES des 4 étapes */
.method-clean-page .method-mini-rule{
  display:block !important;
}

/* Conserver les espacements et le fond validés */
.method-clean-page .method-core{
  background:#f7f4ed !important;
}
.method-clean-page .method-steps{
  margin-top:5.8rem !important;
}
.method-clean-page .method-frame-clean{
  margin-top:5.8rem !important;
}

/* Titre sur une seule ligne en grand écran */
.method-clean-page .method-core h1{
  white-space:nowrap !important;
}
@media(max-width:1100px){
  .method-clean-page .method-core h1{
    white-space:normal !important;
  }
}


/* =========================================================
   VERSION À PUBLIER — correction finale du pictogramme Construire
   Le reste du bloc validé reste inchangé.
   ========================================================= */
.method-clean-page .method-step img{
  width:88px !important;
  height:88px !important;
  object-fit:contain !important;
}
.method-clean-page .method-step img[src*="method-construire"]{
  width:88px !important;
  height:88px !important;
  object-fit:contain !important;
  filter:none !important;
}


/* PUBLICATION FINALE — bloc Méthode validé.
   Ne rien modifier sauf garantir le médaillon rond de Construire. */
.method-clean-page .method-step img[src*="method-construire"]{
  width:88px !important;
  height:88px !important;
  box-sizing:border-box !important;
  object-fit:contain !important;
  border-radius:50% !important;
  background:#efede6 !important;
  padding:7px !important;
  display:block !important;
  margin-left:auto !important;
  margin-right:auto !important;
}
