/* Accueil */
.hm-hero { padding: clamp(36px, 6vw, 80px) 0 clamp(48px, 7vw, 96px); position: relative; overflow: hidden; }
.hm-hero::after { content: ""; position: absolute; right: -140px; top: -120px; width: 420px; height: 420px; border-radius: 50%; border: 60px solid var(--accent-voile); opacity: .55; pointer-events: none; }
.hm-hero__grille { display: grid; grid-template-columns: minmax(0, 1fr); gap: 36px; align-items: center; position: relative; z-index: 1; }
@media (min-width: 1000px) { .hm-hero__grille { grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); gap: 64px; } }
.hm-hero h1 { font-size: clamp(2.6rem, 6.2vw, 4.8rem); max-width: 9em; }
.hm-hero h1 em { display: block; }
.hm-hero .sa-chapo { max-width: 30em; }
.hm-hero__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 24px; margin-top: 28px; }
.hm-lien { color: var(--encre-2); font-weight: 600; text-decoration: underline; text-underline-offset: 3px; text-decoration-color: var(--trait-fort); }
.hm-lien:hover { color: var(--encre); text-decoration-color: currentColor; }

/* Le relevé du héros : le vrai livrable, un seul champ. */
.hm-releve { transform: rotate(-.6deg); max-width: 520px; width: 100%; justify-self: center; }
@media (prefers-reduced-motion: reduce) { .hm-releve { transform: none; } }
.hm-act select { appearance: none; border: 1px solid var(--f-trait); border-radius: 999px; background: transparent; color: var(--f-encre-2); font: 600 .78rem var(--texte); letter-spacing: .04em; text-transform: uppercase; padding: .45em 2.1em .45em .9em; cursor: pointer; min-height: 32px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='7' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%236A6B72' stroke-width='2' fill='none' stroke-linecap='round'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 10px center; }
.hm-act select:focus-visible { outline: 3px solid var(--accent); outline-offset: 2px; }
.hm-ca { align-items: center; cursor: text; }
.hm-ca__champ { display: inline-flex; align-items: baseline; gap: 4px; border-bottom: 2px solid var(--f-encre); padding-bottom: 2px; }
.hm-ca__champ input { width: 5.2em; border: 0; background: transparent; color: var(--f-encre); font: 700 1.35rem var(--texte); text-align: right; font-variant-numeric: tabular-nums; padding: 0; }
.hm-ca__champ input:focus { outline: none; }
.hm-ca__champ:focus-within { border-bottom-color: var(--f-accent); }
.hm-ca__champ span { font-weight: 700; font-size: 1.1rem; }

.hm-h2 { max-width: 18em; margin-bottom: 1.2em; }


.hm-etapes { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 28px; counter-reset: e; }
.hm-etapes li { border-top: 2px solid var(--encre); padding-top: 18px; }
.hm-etapes .n { font-family: var(--titre); font-size: 2.6rem; line-height: 1; color: var(--accent-texte); }
.hm-etapes h3 { margin: 8px 0; }
.hm-etapes p { color: var(--encre-2); margin: 0; }

.hm-tarifs { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 18px; align-items: stretch; }
.hm-tarif { position: relative; display: flex; flex-direction: column; background: var(--surface); border: 1px solid var(--trait); border-radius: var(--rayon); padding: 26px; }
.hm-tarif--reco { border: 2px solid var(--encre); box-shadow: var(--ombre-forte); }
.hm-tarif--reco .sa-pastille { position: absolute; top: -13px; left: 22px; }
.hm-prix { font-family: var(--titre); font-size: 2.6rem; line-height: 1; margin: 6px 0 4px; font-variant-numeric: tabular-nums; }
.hm-prix small { font-family: var(--texte); font-size: .9rem; color: var(--encre-3); margin-left: 6px; }
.hm-equiv { font-size: .88rem; color: var(--accent-texte); font-weight: 600; margin: 0 0 6px; }
.hm-tarif ul { list-style: none; padding: 0; margin: 14px 0 22px; flex: 1; display: grid; gap: 8px; align-content: start; }
.hm-tarif li { padding-left: 22px; position: relative; font-size: .95rem; }
.hm-tarif li::before { content: ""; position: absolute; left: 2px; top: .5em; width: 10px; height: 6px; border-left: 2px solid var(--encre); border-bottom: 2px solid var(--encre); transform: rotate(-45deg); }
.hm-tarifs__note { font-size: .88rem; color: var(--encre-2); margin: 22px 0 0; }

.hm-final { padding: 0 0 clamp(56px, 7vw, 96px); }
.hm-final__boite { text-align: center; }

/* Le livrable : un bilan complet réel, calculé par le moteur. */
.hm-livrable { display: grid; grid-template-columns: minmax(0, 1fr); gap: 36px; align-items: center; }
@media (min-width: 1000px) { .hm-livrable { grid-template-columns: minmax(0, 1fr) minmax(0, 520px); gap: 72px; } }
.hm-livrable__texte p { color: var(--encre-2); max-width: 32em; margin: 0; }
.hm-livrable__texte a { color: var(--encre); }
.hm-bilan { transform: rotate(.5deg); }
.hm-bilan .sa-net { font-size: clamp(2rem, 4vw, 2.6rem); }
@media (prefers-reduced-motion: reduce) { .hm-bilan { transform: none; } }
@media (min-width: 640px) { .hm-hero__actions .sa-btn, .hm-final .sa-btn { width: auto; } }

/* Accueil centré : une seule colonne à toutes les largeurs. */
.hm-hero::after{display:none}.hm-hero__grille{display:block;max-width:920px;text-align:center}.hm-hero__texte{min-width:0}.hm-hero h1{max-width:15em;margin-inline:auto;overflow-wrap:normal;font-size:clamp(2.2rem,5.2vw,4.5rem);line-height:1.08}.hm-hero .sa-chapo{margin-inline:auto;max-width:38em}.hm-hero__actions{justify-content:center}.hm-hero{padding:clamp(48px,8vw,100px) 0}.hm-hero__actions .sa-btn{max-width:100%}
@media(max-width:420px){.hm-hero__actions{flex-direction:column;align-items:stretch}.hm-hero__actions .sa-btn{width:100%}.hm-hero h1{font-size:2.35rem}.hm-lien{text-align:center}}
