/* Mise en page de « accueil » — reprise telle quelle de la maquette validée le 29/08/2026. */

/* ---------- propre à la page d'accueil ---------- */
.hero{padding:clamp(32px,5.5vw,80px) 0 clamp(32px,4.5vw,64px)}
.hero-grid{display:grid; grid-template-columns:repeat(12,minmax(0,1fr)); gap:var(--gutter); align-items:center}
.hero-txt{grid-column:1/7}
.hero-media{grid-column:8/13}
.hero h1{
  font-family:Newsreader,Georgia,serif; font-weight:400;
  font-size:clamp(31px,4.2vw,56px); line-height:1.04; letter-spacing:-.022em;
  margin:0 0 var(--s5); max-width:17ch; text-wrap:balance;
}
.hero .cta{display:flex; gap:var(--s3); flex-wrap:wrap; margin-top:var(--s7)}

.why{display:grid; grid-template-columns:repeat(auto-fit,minmax(224px,1fr)); gap:var(--s7) var(--s6)}
.why .n{font-family:"IBM Plex Mono",monospace; font-size:11px; color:var(--wood); letter-spacing:.1em; margin-bottom:var(--s3)}
.why p{font-size:14.5px; color:var(--ink-2); margin:0; max-width:36ch}

.projet{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,.9fr); gap:var(--s9); align-items:start}
.steps{display:flex; flex-direction:column; gap:0; margin:0; padding:0; list-style:none; counter-reset:s}
.steps li{
  display:grid; grid-template-columns:30px 1fr; gap:var(--s4); align-items:baseline;
  font-size:15px; color:var(--ink-2); padding:var(--s4) 0; border-top:1px solid var(--line-soft);
}
.steps li:first-child{border-top:0; padding-top:0}
.steps li::before{
  counter-increment:s; content:"0" counter(s);
  font-family:"IBM Plex Mono",monospace; font-size:11px; color:var(--wood); letter-spacing:.08em;
}
.mesure{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,.8fr); gap:var(--s8); align-items:center}

@media (max-width:900px){
  .hero .cta{margin-top:var(--s5)}
  .hero-txt,.hero-media{grid-column:1/-1}
  .hero-media{margin-top:var(--s6)}
  .hero h1{max-width:20ch}
  .projet,.mesure{grid-template-columns:1fr; gap:var(--s6)}
}