/* CHEMINEO36 — parcours climatisation 1.3.0 (28/10/2026)
   Base : feuille V2 Claude du 26/10 (chemineo.css), isolée sous .chemineo-shell pour le canvas WordPress.
   Police : Atkinson Hyperlegible Next (SIL OFL 1.1), hébergée localement, aucun appel externe. */
@font-face { font-family: "Atkinson Next"; src: url("fonts/atkinson-hyperlegible-next-latin-400-normal.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "Atkinson Next"; src: url("fonts/atkinson-hyperlegible-next-latin-700-normal.woff2") format("woff2"); font-weight: 700; font-style: normal; font-display: swap; }
@font-face { font-family: "Atkinson Next"; src: url("fonts/atkinson-hyperlegible-next-latin-800-normal.woff2") format("woff2"); font-weight: 800; font-style: normal; font-display: swap; }

.chemineo-shell {
  color-scheme: light;
  --encre: #16323F;        /* texte, titres */
  --encre-doux: #40606E;   /* texte secondaire */
  --air: #2B6F93;          /* froid : liens, extrémité froide de la bande */
  --air-clair: #DCEBF1;
  --givre: #EEF4F6;        /* fonds de section */
  --blanc: #FFFFFF;
  --braise: #EFA634;       /* chaud : bouton principal, extrémité chaude */
  --braise-fonce: #E59A1F;
  --trait: #C9D7DD;
  --alerte: #B42318;
  --rayon: 10px;
  --rayon-petit: 6px;
  --ombre: 0 1px 2px rgba(22, 50, 63, .08), 0 10px 28px rgba(22, 50, 63, .10);
  --largeur: 1120px;
  --lecture: 66ch;
  --police: "Atkinson Next", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
}

.chemineo-shell *, .chemineo-shell *::before, .chemineo-shell *::after { box-sizing: border-box; }
.chemineo-shell { -webkit-text-size-adjust: 100%; }
.chemineo-shell { margin: 0; font-family: var(--police); font-size: 1.125rem; line-height: 1.55; color: var(--encre); background: var(--blanc); }
.chemineo-shell img { max-width: 100%; height: auto; display: block; }
.chemineo-shell a { color: var(--air); text-underline-offset: .15em; }
.chemineo-shell a:hover { color: var(--encre); }
.chemineo-shell :focus-visible { outline: 3px solid var(--air); outline-offset: 3px; border-radius: 4px; }
.chemineo-shell h1, .chemineo-shell h2, .chemineo-shell h3 { margin: 0 0 .5em; line-height: 1.12; letter-spacing: -.01em; }
.chemineo-shell h1 { font-size: clamp(2.05rem, 7.2vw, 3.35rem); font-weight: 800; }
.chemineo-shell h2 { font-size: clamp(1.5rem, 4.2vw, 2rem); font-weight: 800; }
.chemineo-shell h3 { font-size: 1.2rem; font-weight: 700; line-height: 1.25; }
.chemineo-shell p { margin: 0 0 1em; max-width: var(--lecture); }
.chemineo-shell figure { margin: 0; }
.chemineo-shell .conteneur { max-width: var(--largeur); margin: 0 auto; padding: 0 16px; }
@media (min-width: 720px) { .chemineo-shell .conteneur { padding: 0 32px; } }
.chemineo-shell .visuellement-cache { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.chemineo-shell .lien-evitement { position: absolute; left: 12px; top: -60px; background: var(--encre); color: var(--blanc); padding: 10px 14px; border-radius: var(--rayon-petit); z-index: 50; }
.chemineo-shell .lien-evitement:focus { top: 12px; color: var(--blanc); }

/* Maquette : barre de revue et éléments à compléter (retirés en production) */
.chemineo-shell .barre-maquette { display: block; background: #FFF4C2; color: #4A3800; font-size: .9375rem; line-height: 1.4; border-bottom: 1px dashed #C9A227; }
.chemineo-shell .barre-maquette .conteneur { display: flex; flex-wrap: wrap; gap: 6px 18px; align-items: center; padding-top: 8px; padding-bottom: 8px; }
.chemineo-shell .barre-maquette label { display: inline-flex; gap: 8px; align-items: center; font-weight: 700; cursor: pointer; }
.chemineo-shell .barre-maquette input { width: 18px; height: 18px; accent-color: #8A6A00; }
.chemineo-shell mark.todo { background: #FFE58A; color: #4A3800; padding: 0 .25em; border-radius: 3px; font-weight: 700; }
.chemineo-shell.mode-live .seulement-maquette, .chemineo-shell.mode-live mark.todo { display: none !important; }
.chemineo-shell .galerie.seulement-maquette { display: grid; }

/* Vue visiteur (maquette) : masque les annotations pour juger la page telle qu'un prospect la verra */


/* Parcours entretien : masqué tant que l'offre n'est pas confirmée */


/* En-tête */
.chemineo-shell .entete { border-bottom: 1px solid var(--trait); background: var(--blanc); }
.chemineo-shell .entete .conteneur { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 66px; }
.chemineo-shell .marque { color: var(--encre); text-decoration: none; line-height: 1.1; }
.chemineo-shell .marque strong { display: block; font-size: 1.4rem; font-weight: 800; letter-spacing: .03em; }
.chemineo-shell .marque span { display: block; font-size: .875rem; color: var(--encre-doux); }

/* Boutons */
.chemineo-shell .bouton { display: inline-flex; align-items: center; justify-content: center; gap: .5em; min-height: 52px; padding: .7em 1.2em; border: 2px solid transparent; border-radius: var(--rayon-petit); font: 700 1.0625rem/1.2 var(--police); text-decoration: none; cursor: pointer; text-align: center; }
.chemineo-shell .bouton svg { width: 20px; height: 20px; flex: none; }
.chemineo-shell .bouton-principal { background: var(--braise); color: var(--encre); }
.chemineo-shell .bouton-principal:hover { background: var(--braise-fonce); color: var(--encre); }
.chemineo-shell .bouton-secondaire { background: var(--blanc); color: var(--encre); border-color: var(--encre); }
.chemineo-shell .bouton-secondaire:hover { background: var(--givre); color: var(--encre); }
.chemineo-shell .bouton-compact { min-height: 44px; padding: .45em .9em; font-size: 1rem; }
.chemineo-shell .bouton[disabled] { opacity: .65; cursor: progress; }
.chemineo-shell .boutons { display: flex; flex-wrap: wrap; gap: 10px; }

/* Héros */
.chemineo-shell .hero { padding: 24px 0 8px; background:
  radial-gradient(48rem 22rem at 108% -12%, rgba(239, 166, 52, .18), transparent 62%),
  radial-gradient(44rem 22rem at -12% -8%, rgba(43, 111, 147, .14), transparent 62%); }
.chemineo-shell .hero-chapo { font-size: 1.2rem; color: var(--encre-doux); max-width: 40ch; }
.chemineo-shell .surtitre { display: inline-flex; align-items: center; gap: 8px; margin: 0 0 14px; padding: 6px 12px; border: 1px solid var(--trait); border-radius: 999px; background: var(--blanc); color: var(--encre-doux); font-size: .875rem; font-weight: 700; line-height: 1.3; }
.chemineo-shell .surtitre svg { width: 16px; height: 16px; flex: none; color: var(--air); }
.chemineo-shell .surtitre-simple { border: 0; padding: 0; background: none; color: var(--air); text-transform: uppercase; letter-spacing: .06em; font-size: .8125rem; }
.chemineo-shell .accent-thermique { background-image: linear-gradient(90deg, var(--air), #8DB8C8 42%, #F3CB82 62%, var(--braise)); background-repeat: no-repeat; background-size: 100% .16em; background-position: 0 94%; -webkit-box-decoration-break: clone; box-decoration-break: clone; }
.chemineo-shell .installateur-mini { display: flex; align-items: center; gap: 12px; margin: 0 0 18px; }
.chemineo-shell .installateur-mini img { width: 64px; height: 64px; flex: none; border-radius: 50%; background: radial-gradient(circle at 35% 30%, #FFFFFF, var(--air-clair) 55%, #F7D9A6); box-shadow: 0 0 0 3px var(--blanc), 0 0 0 5px rgba(43, 111, 147, .35); }
.chemineo-shell .installateur-mini figcaption { line-height: 1.25; }
.chemineo-shell .installateur-mini strong { display: block; font-size: 1.0625rem; }
.chemineo-shell .installateur-mini span { font-size: .9375rem; color: var(--encre-doux); }

/* Visuel du héros : Michael (photo réelle détourée) et une unité extérieure illustrée, sans mise en scène de chantier */
.chemineo-shell .hero-visuel { position: relative; aspect-ratio: 16 / 11; margin: 0 0 20px; overflow: hidden; border-radius: 20px; background: radial-gradient(circle at 68% 62%, #FFFFFF 0, var(--air-clair) 44%, #F6D39A 100%); }
.chemineo-shell .hero-visuel .hv-portrait { position: absolute; right: 0; bottom: 0; width: auto; height: 97%; max-width: none; }
.chemineo-shell .hero-visuel .hv-pac { position: absolute; left: 5%; bottom: 7%; width: 40%; filter: drop-shadow(0 10px 14px rgba(22, 50, 63, .16)); }
.chemineo-shell .hv-saison { position: absolute; display: grid; place-items: center; width: 40px; height: 40px; border-radius: 50%; background: var(--blanc); box-shadow: var(--ombre); }
.chemineo-shell .hv-saison svg { width: 22px; height: 22px; }
.chemineo-shell .hv-froid { left: 6%; top: 9%; color: var(--air); }
.chemineo-shell .hv-chaud { left: calc(6% + 50px); top: 9%; color: #C27B0E; }
.chemineo-shell .hero-visuel figcaption { position: absolute; right: 10px; bottom: 10px; padding: 7px 11px; border-radius: 10px; background: rgba(255, 255, 255, .94); box-shadow: var(--ombre); line-height: 1.2; font-size: .9375rem; }
.chemineo-shell .hero-visuel figcaption strong { display: block; }
.chemineo-shell .hero-visuel figcaption span { font-size: .8125rem; color: var(--encre-doux); }
@media (max-width: 959px) { .chemineo-shell .hero-grille > .boutons .bouton { flex: 1 1 100%; } .chemineo-shell .hero-visuel { max-width: 600px; } }

/* Ordinateur : texte à gauche ; à droite, le visuel puis le formulaire qui le chevauche légèrement */
@media (min-width: 960px) {
  .chemineo-shell .hero { padding: 44px 0 52px; }
  .chemineo-shell .hero-grille { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); column-gap: 56px; align-items: start;
    grid-template-areas: "surtitre visuel" "titre visuel" "chapo carte" "coches carte" "boutons carte" "annot carte" "vide carte"; }
  .chemineo-shell .hero-grille > .surtitre { grid-area: surtitre; justify-self: start; }
  .chemineo-shell .hero-grille > h1 { grid-area: titre; }
  .chemineo-shell .hero-grille > .hero-chapo { grid-area: chapo; }
  .chemineo-shell .hero-grille > .liste-coches { grid-area: coches; }
  .chemineo-shell .hero-grille > .boutons { grid-area: boutons; }
  .chemineo-shell .hero-grille > .hero-annotation { grid-area: annot; margin-top: 10px; }
  .chemineo-shell .hero-grille > .hero-visuel { grid-area: visuel; align-self: stretch; aspect-ratio: auto; min-height: 250px; margin: 0; }
  .chemineo-shell .hero-grille > .carte-demande { grid-area: carte; margin-top: -26px; z-index: 1; }
  .chemineo-shell .hero-visuel figcaption { top: 12px; bottom: auto; }
  .chemineo-shell .hero-visuel .hv-pac { width: 36%; left: 5%; bottom: 40px; }
}
.chemineo-shell .liste-coches { list-style: none; margin: 0 0 22px; padding: 0; display: grid; gap: 10px; max-width: 34rem; }
.chemineo-shell .liste-coches li { display: grid; grid-template-columns: 28px 1fr; gap: 10px; align-items: start; font-weight: 700; font-size: 1.0625rem; line-height: 1.35; }
.chemineo-shell .liste-coches svg { width: 28px; height: 28px; padding: 5px; border-radius: 50%; background: var(--air-clair); color: var(--air); }

/* Mouvement réduit */
@media (prefers-reduced-motion: reduce) {
  .chemineo-shell .barre-mobile { transition: none !important; }
}

/* Carte de demande */
.chemineo-shell .carte-demande { margin-top: 28px; padding: 20px; background: var(--blanc); border: 1px solid var(--trait); border-radius: var(--rayon); box-shadow: var(--ombre); scroll-margin-top: 16px; }
.chemineo-shell .carte-demande h2 { font-size: 1.45rem; margin-bottom: .25em; }
.chemineo-shell .carte-demande > p { color: var(--encre-doux); font-size: 1rem; }
@media (min-width: 960px) { .chemineo-shell .carte-demande { margin-top: 0; padding: 28px; position: sticky; top: 20px; } }

.chemineo-shell fieldset { min-width: 0; margin: 0 0 18px; padding: 0; border: 0; }
.chemineo-shell legend, .chemineo-shell .champ-titre { display: block; margin-bottom: 8px; padding: 0; font-weight: 700; font-size: 1rem; }
.chemineo-shell .facultatif { font-weight: 400; color: var(--encre-doux); }
.chemineo-shell .choix { display: grid; gap: 8px; }
@media (min-width: 340px) { .chemineo-shell .choix-2 { grid-template-columns: 1fr 1fr; } }
.chemineo-shell .choix-3 { grid-template-columns: 1fr; }
.chemineo-shell .choix-5 { grid-template-columns: repeat(4, 1fr); }
.chemineo-shell .choix-5 .option:last-child { grid-column: 1 / -1; }
.chemineo-shell .option { position: relative; }
.chemineo-shell .option input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.chemineo-shell .option label { display: flex; align-items: center; gap: 10px; min-height: 48px; height: 100%; padding: 10px 12px; border: 1.5px solid var(--trait); border-radius: var(--rayon-petit); background: var(--blanc); cursor: pointer; font-size: 1rem; line-height: 1.25; }
.chemineo-shell .option label::before { content: ""; flex: none; width: 18px; height: 18px; border: 2px solid var(--encre-doux); border-radius: 50%; background: var(--blanc); }
.chemineo-shell .option input[type="checkbox"] + label::before { border-radius: 4px; }
.chemineo-shell .option input:checked + label { border-color: var(--air); background: var(--air-clair); box-shadow: inset 0 0 0 1px var(--air); }
.chemineo-shell .option input:checked + label::before { border-color: var(--air); background: radial-gradient(circle, var(--air) 0 45%, var(--blanc) 52%); }
.chemineo-shell .option input[type="checkbox"]:checked + label::before { background: var(--air) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3.5 8.5l3 3 6-7' fill='none' stroke='white' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 14px no-repeat; }
.chemineo-shell .option input:focus-visible + label { outline: 3px solid var(--air); outline-offset: 2px; }
.chemineo-shell .choix-5 .option label { justify-content: center; padding: 10px 8px; }
.chemineo-shell .choix-5 .option label::before { display: none; }
@media (min-width: 460px) {
  .chemineo-shell .choix-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .chemineo-shell .choix-3 .option label { justify-content: center; padding: 10px 8px; text-align: center; }
  .chemineo-shell .choix-3 .option label::before { display: none; }
}
.chemineo-shell .option-projet label { min-height: 64px; padding: 10px 14px; font-weight: 700; }
.chemineo-shell .option-projet label > span { flex: 1; }
.chemineo-shell .option-projet small { display: block; margin-top: 2px; font-weight: 400; font-size: .875rem; color: var(--encre-doux); }
.chemineo-shell .option-projet label > svg { width: 30px; height: 30px; flex: none; color: var(--air); }

/* Formulaire en trois étapes */
.chemineo-shell .progression { list-style: none; display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px; margin: 2px 0 18px; padding: 0; }
.chemineo-shell .progression li { position: relative; padding-top: 12px; font-size: .8125rem; font-weight: 700; line-height: 1.2; color: var(--encre-doux); }
.chemineo-shell .progression li::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 6px; border-radius: 999px; background: var(--trait); }
.chemineo-shell .progression li.faite::before { background: var(--air); }
.chemineo-shell .progression li.active::before { background: linear-gradient(90deg, var(--air), var(--braise)); }
.chemineo-shell .progression li.active { color: var(--encre); }
.chemineo-shell .etape[hidden] { display: none; }
.chemineo-shell .etape-titre { margin: 0 0 12px; font-size: .8125rem; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: var(--air); }
.chemineo-shell .etape-titre:focus { outline: none; }
.chemineo-shell .etape-actions { display: flex; gap: 10px; align-items: center; margin-top: 6px; }
.chemineo-shell .carte-demande .etape-actions .bouton-principal { flex: 1 1 auto; width: auto; margin-top: 0; }
.chemineo-shell .bouton-retour { min-height: 52px; padding: .6em .8em; border: 0; background: none; color: var(--encre-doux); font: 700 1rem/1.2 var(--police); text-decoration: underline; text-underline-offset: .15em; cursor: pointer; }
.chemineo-shell .bouton-retour:hover { color: var(--encre); }

.chemineo-shell .champ { margin-bottom: 16px; }
.chemineo-shell .champ label { display: block; margin-bottom: 6px; font-weight: 700; font-size: 1rem; }
.chemineo-shell .ligne-2 { display: grid; gap: 0 12px; grid-template-columns: 2fr 3fr; }
.chemineo-shell input[type="text"], .chemineo-shell input[type="tel"], .chemineo-shell input[type="email"], .chemineo-shell textarea { width: 100%; min-height: 50px; padding: 10px 12px; border: 1.5px solid var(--trait); border-radius: var(--rayon-petit); background: var(--blanc); color: var(--encre); font: inherit; font-size: 1.0625rem; }
.chemineo-shell textarea { min-height: 96px; resize: vertical; }
.chemineo-shell input:focus-visible, .chemineo-shell textarea:focus-visible { border-color: var(--air); }
.chemineo-shell [aria-invalid="true"] { border-color: var(--alerte) !important; }
.chemineo-shell .aide { margin: 6px 0 0; font-size: .9375rem; color: var(--encre-doux); }
.chemineo-shell .erreur { margin: 6px 0 0; font-size: .9375rem; font-weight: 700; color: var(--alerte); }
.chemineo-shell .erreur:empty { display: none; }
.chemineo-shell .avis-zone { margin: 4px 0 14px; padding: 10px 12px; border-left: 4px solid var(--braise); background: #FFF7E8; font-size: .9375rem; }
.chemineo-shell .etat-envoi { margin: 12px 0 0; font-weight: 700; }
.chemineo-shell .etat-envoi.erreur-envoi { color: var(--alerte); }
.chemineo-shell .mention { margin: 14px 0 0; font-size: .875rem; color: var(--encre-doux); }
.chemineo-shell .pot-de-miel { position: absolute !important; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
.chemineo-shell .carte-demande .bouton-principal { width: 100%; margin-top: 4px; }

/* Sections */
.chemineo-shell .section { padding: 48px 0; }
.chemineo-shell .section-givre { background: var(--givre); }
.chemineo-shell .section h2 { max-width: 24ch; }
.chemineo-shell .intro-section { color: var(--encre-doux); }
.chemineo-shell .etapes { list-style: none; counter-reset: etape; margin: 22px 0 0; padding: 0; display: grid; gap: 22px; }
@media (min-width: 760px) { .chemineo-shell .etapes { grid-template-columns: repeat(3, 1fr); gap: 32px; } }
.chemineo-shell .etapes li { counter-increment: etape; }
.chemineo-shell .etapes li::before { content: counter(etape); display: inline-grid; place-items: center; width: 38px; height: 38px; margin-bottom: 10px; border-radius: 50%; background: var(--encre); color: var(--blanc); font-weight: 800; }
.chemineo-shell .etapes p { margin: 0; color: var(--encre-doux); }
.chemineo-shell .galerie { display: grid; gap: 12px; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); margin-top: 18px; }
.chemineo-shell .galerie:empty { display: none; }
.chemineo-shell .photo-attente { display: grid; place-items: center; aspect-ratio: 4 / 3; padding: 12px; border: 2px dashed #C9A227; border-radius: var(--rayon); background: #FFFBEA; color: #4A3800; text-align: center; font-size: .9375rem; }
.chemineo-shell .faq { max-width: 760px; margin-top: 12px; }
.chemineo-shell .faq details { border-top: 1px solid var(--trait); }
.chemineo-shell .faq details:last-child { border-bottom: 1px solid var(--trait); }
.chemineo-shell .faq summary { display: flex; justify-content: space-between; align-items: center; gap: 14px; min-height: 56px; padding: 12px 0; font-weight: 700; cursor: pointer; list-style: none; }
.chemineo-shell .faq summary::-webkit-details-marker { display: none; }
.chemineo-shell .faq summary::after { content: "+"; flex: none; font-size: 1.5rem; font-weight: 800; line-height: 1; color: var(--air); }
.chemineo-shell .faq details[open] summary::after { content: "\2212"; }
.chemineo-shell .faq details p { color: var(--encre-doux); }

/* Situations rencontrées */
.chemineo-shell .situations { list-style: none; margin: 18px 0 0; padding: 0; display: grid; gap: 14px; }
@media (min-width: 760px) { .chemineo-shell .situations { grid-template-columns: repeat(3, 1fr); gap: 20px; } }
.chemineo-shell .situations li { padding: 20px; border: 1px solid var(--trait); border-radius: var(--rayon); background: var(--blanc); }
.chemineo-shell .situations svg { width: 44px; height: 44px; margin-bottom: 12px; padding: 9px; border-radius: 12px; }
.chemineo-shell .situations li:nth-child(1) svg { background: var(--air-clair); color: var(--air); }
.chemineo-shell .situations li:nth-child(2) svg { background: #FCEBCB; color: #9A5A06; }
.chemineo-shell .situations li:nth-child(3) svg { background: var(--givre); color: var(--encre); }
.chemineo-shell .situations p { margin: 0; color: var(--encre-doux); font-size: 1rem; }
.chemineo-shell .transition { margin: 20px 0 0; font-weight: 700; font-size: 1.125rem; }

/* Fonctionnement */
.chemineo-shell .illustration-systeme { margin-top: 20px; }
.chemineo-shell .illustration-systeme img { width: 100%; border-radius: 14px; background: var(--blanc); box-shadow: var(--ombre); }
.chemineo-shell .legende-systeme { list-style: none; counter-reset: repere; margin: 18px 0 0; padding: 0; display: grid; gap: 12px; }
@media (min-width: 760px) { .chemineo-shell .legende-systeme { grid-template-columns: repeat(3, 1fr); gap: 24px; } }
.chemineo-shell .legende-systeme li { counter-increment: repere; display: grid; grid-template-columns: 30px 1fr; gap: 10px; align-items: start; font-size: 1rem; color: var(--encre-doux); }
.chemineo-shell .legende-systeme li::before { content: counter(repere); display: grid; place-items: center; width: 30px; height: 30px; border-radius: 50%; background: var(--encre); color: var(--blanc); font-weight: 800; font-size: .9375rem; }
.chemineo-shell .legende-systeme strong { display: block; color: var(--encre); }
.chemineo-shell .avantages { list-style: none; margin: 22px 0 0; padding: 0; display: grid; gap: 10px; grid-template-columns: 1fr 1fr; }
@media (min-width: 900px) { .chemineo-shell .avantages { grid-template-columns: repeat(4, 1fr); gap: 16px; } }
.chemineo-shell .avantages li { display: flex; flex-direction: column; gap: 8px; padding: 16px; border-radius: var(--rayon); background: var(--blanc); font-size: .9375rem; line-height: 1.35; color: var(--encre-doux); }
.chemineo-shell .avantages svg { width: 28px; height: 28px; color: var(--air); }
.chemineo-shell .avantages li:first-child svg { color: #C27B0E; }
.chemineo-shell .avantages strong { display: block; color: var(--encre); font-size: 1rem; }

/* Prestations */
.chemineo-shell .cartes-offres { list-style: none; margin: 20px 0 0; padding: 0; display: grid; gap: 16px; }
@media (min-width: 760px) { .chemineo-shell .cartes-offres { grid-template-columns: repeat(3, 1fr); gap: 20px; } }
.chemineo-shell .carte-offre { display: flex; flex-direction: column; padding: 16px; border: 1px solid var(--trait); border-radius: 14px; background: var(--blanc); box-shadow: var(--ombre); }
.chemineo-shell .carte-offre img { width: 100%; aspect-ratio: 360 / 220; margin-bottom: 14px; border-radius: var(--rayon); background: var(--givre); }
.chemineo-shell .carte-offre p { flex: 1; color: var(--encre-doux); font-size: 1rem; }
.chemineo-shell .carte-offre .bouton { width: 100%; }
.chemineo-shell .note-service { display: flex; gap: 10px; align-items: flex-start; margin: 20px 0 0; font-size: 1rem; color: var(--encre-doux); }
.chemineo-shell .note-service svg { width: 22px; height: 22px; flex: none; margin-top: 2px; color: var(--air); }

/* Installateur */
.chemineo-shell .installateur { display: grid; gap: 28px; align-items: center; }
@media (min-width: 900px) { .chemineo-shell .installateur { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 56px; } }
.chemineo-shell .portrait { position: relative; width: 100%; max-width: 460px; aspect-ratio: 1 / 1; overflow: hidden; border-radius: 20px; background: radial-gradient(circle at 30% 18%, #FFFFFF 0, var(--air-clair) 46%, #F6D39A 100%); }
.chemineo-shell .portrait img { position: absolute; left: 50%; bottom: 0; width: 100%; transform: translateX(-50%); }
.chemineo-shell .portrait figcaption { position: absolute; left: 14px; bottom: 14px; padding: 8px 12px; border-radius: 10px; background: rgba(255, 255, 255, .94); box-shadow: var(--ombre); line-height: 1.2; }
.chemineo-shell .portrait figcaption strong { display: block; }
.chemineo-shell .portrait figcaption span { font-size: .875rem; color: var(--encre-doux); }
.chemineo-shell .preuves { list-style: none; margin: 18px 0 0; padding: 0; display: grid; gap: 12px; }
.chemineo-shell .preuves li { display: grid; grid-template-columns: 24px 1fr; gap: 10px; font-size: 1rem; }
.chemineo-shell .preuves svg { width: 22px; height: 22px; margin-top: 2px; color: var(--air); }
.chemineo-shell .galerie-attente { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.chemineo-shell .galerie-attente .photo-attente { aspect-ratio: 1 / 1; font-size: .8125rem; line-height: 1.3; }

/* Déroulement en quatre étapes illustrées */
@media (min-width: 760px) { .chemineo-shell .etapes-4 { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1000px) { .chemineo-shell .etapes-4 { grid-template-columns: repeat(4, 1fr); gap: 28px; } }
.chemineo-shell .etapes-4 li::before { content: none; }
.chemineo-shell .etape-icone { position: relative; display: grid; place-items: center; width: 54px; height: 54px; margin-bottom: 12px; border-radius: 14px; background: var(--encre); color: var(--blanc); }
.chemineo-shell .etape-icone svg { width: 26px; height: 26px; }
.chemineo-shell .etape-icone::after { content: counter(etape); position: absolute; right: -9px; top: -9px; display: grid; place-items: center; width: 26px; height: 26px; border-radius: 50%; background: var(--braise); color: var(--encre); font-size: .8125rem; font-weight: 800; }

/* Prix et conditions */
.chemineo-shell .encadre-prix { display: grid; gap: 18px; align-items: center; padding: 24px; border: 1px solid var(--trait); border-radius: 16px; background: linear-gradient(120deg, var(--givre), #FFF4E2); }
@media (min-width: 900px) { .chemineo-shell .encadre-prix { grid-template-columns: 1fr auto; gap: 40px; padding: 32px 40px; } }
.chemineo-shell .encadre-prix h2 { max-width: none; }
.chemineo-shell .encadre-prix p { margin: 0; color: var(--encre-doux); }

.chemineo-shell .appel-final { padding: 52px 0; background: var(--encre); color: var(--blanc); }
.chemineo-shell .appel-final-grille { display: grid; gap: 24px; align-items: center; }
@media (min-width: 900px) { .chemineo-shell .appel-final-grille { grid-template-columns: 1fr auto; gap: 48px; } }
.chemineo-shell .recap { list-style: none; margin: 0 0 22px; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.chemineo-shell .recap li { padding: 6px 12px; border-radius: 999px; background: rgba(255, 255, 255, .12); color: var(--blanc); font-size: .9375rem; font-weight: 700; }
.chemineo-shell .appel-portrait { order: -1; width: 96px; height: 96px; border-radius: 50%; background: radial-gradient(circle at 35% 30%, #FFFFFF, var(--air-clair) 55%, #F7D9A6); box-shadow: 0 0 0 4px rgba(255, 255, 255, .18); }
@media (min-width: 900px) { .chemineo-shell .appel-portrait { order: 0; width: 168px; height: 168px; } }
.chemineo-shell .appel-final h2 { color: var(--blanc); }
.chemineo-shell .appel-final p { color: #D6E6EC; }
.chemineo-shell .appel-final a:not(.bouton) { color: #BFE0EE; }
.chemineo-shell .appel-final .bouton-secondaire { background: transparent; color: var(--blanc); border-color: var(--blanc); }
.chemineo-shell .appel-final .bouton-secondaire:hover { background: rgba(255, 255, 255, .1); color: var(--blanc); }

.chemineo-shell .pied { padding: 30px 0 110px; font-size: .9375rem; color: var(--encre-doux); }
.chemineo-shell .pied p { margin: 0 0 .5em; }
.chemineo-shell .pied nav { display: flex; flex-wrap: wrap; gap: 8px 18px; margin-top: 10px; }
.chemineo-shell .pied button.lien { padding: 0; border: 0; background: none; color: var(--air); font: inherit; text-decoration: underline; text-underline-offset: .15em; cursor: pointer; }
@media (min-width: 960px) { .chemineo-shell .pied { padding-bottom: 36px; } }

/* Barre d'action fixe sur téléphone */
.chemineo-shell .barre-mobile { position: fixed; left: 0; right: 0; bottom: 0; z-index: 20; display: grid; grid-template-columns: 1fr 1fr; gap: 8px; padding: 8px 12px calc(8px + env(safe-area-inset-bottom)); background: rgba(255, 255, 255, .97); border-top: 1px solid var(--trait); transform: translateY(110%); transition: transform .25s ease; }
.chemineo-shell .barre-mobile:not(.visible) { visibility: hidden; transition: transform .25s ease, visibility 0s linear .25s; }
.chemineo-shell .barre-mobile.visible { transform: none; visibility: visible; }
.chemineo-shell.bandeau-ouvert .barre-mobile { transform: translateY(110%); visibility: hidden; }
.chemineo-shell .barre-mobile .bouton { min-height: 50px; padding: .5em .6em; }
@media (min-width: 960px) { .chemineo-shell .barre-mobile { display: none; } }

/* Bandeau de consentement */
.chemineo-shell .bandeau-cookies { position: fixed; left: 12px; right: 12px; bottom: 12px; z-index: 40; max-width: 560px; margin: 0 auto; padding: 16px 18px; background: var(--blanc); border: 1px solid var(--trait); border-radius: var(--rayon); box-shadow: var(--ombre); font-size: .9375rem; }
.chemineo-shell .bandeau-cookies[hidden] { display: none; }
.chemineo-shell .bandeau-cookies p { margin: 0 0 .6em; }
.chemineo-shell .bandeau-cookies .boutons .bouton { flex: 1 1 140px; min-height: 46px; }

/* Pages simples : remerciement, mentions, confidentialité */
.chemineo-shell .page-simple { padding: 40px 0 56px; }
.chemineo-shell .page-simple .conteneur > * { max-width: 760px; }
.chemineo-shell .page-simple h2 { margin-top: 1.4em; font-size: 1.35rem; }
.chemineo-shell .reference { display: inline-block; margin: 4px 0 18px; padding: 6px 12px; border-radius: var(--rayon-petit); background: var(--givre); font-weight: 700; letter-spacing: .02em; }
.chemineo-shell .coche { display: grid; place-items: center; width: 56px; height: 56px; margin-bottom: 16px; border-radius: 50%; background: var(--air-clair); color: var(--air); }
.chemineo-shell .coche svg { width: 30px; height: 30px; }
.chemineo-shell .tableau-simple { width: 100%; border-collapse: collapse; font-size: 1rem; }
.chemineo-shell .tableau-simple th, .chemineo-shell .tableau-simple td { padding: 10px 8px; border-bottom: 1px solid var(--trait); text-align: left; vertical-align: top; }
.chemineo-shell .tableau-simple th { width: 38%; color: var(--encre-doux); font-weight: 700; }

/* Message bref (maquette, téléphone non renseigné) */
.chemineo-shell .toast { position: fixed; left: 50%; bottom: 84px; z-index: 60; max-width: min(92vw, 460px); padding: 12px 16px; border-radius: var(--rayon-petit); background: var(--encre); color: var(--blanc); font-size: .9375rem; transform: translate(-50%, 20px); opacity: 0; pointer-events: none; transition: opacity .2s ease, transform .2s ease; }
.chemineo-shell .toast.visible { opacity: 1; transform: translate(-50%, 0); }

/* 1.3.0 — canvas WordPress pleine largeur, isolation du thème */
body.chemineo-canvas { margin: 0 !important; padding: 0 !important; background: #FFFFFF; min-width: 0; }
.chemineo-shell { isolation: isolate; width: 100%; max-width: none; min-width: 0; }
.chemineo-shell [hidden] { display: none !important; }
.chemineo-shell button, .chemineo-shell input, .chemineo-shell textarea { font-family: var(--police); }
#chemineo-notices { box-sizing: border-box; margin: 0; padding: 10px 16px; background: #FFF4C2; color: #4A3800; font: 14px/1.5 system-ui, Arial, sans-serif; text-align: center; }
/* 1.3.0 — bandeau de test : barre de maquette V2 ; masqué en mode live par app.js */
.chemineo-shell .barre-maquette .conteneur { justify-content: center; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; font-size: .8125rem; }
/* 1.3.0 — numéro en clair sous les boutons d'appel (décision #8 B) */
.chemineo-shell .numero-clair { display: block; margin: 10px 0 0; font-size: 1rem; color: var(--encre-doux); }
.chemineo-shell .numero-clair a { color: var(--encre); font-weight: 700; text-decoration: underline; text-underline-offset: .15em; white-space: nowrap; }
.chemineo-shell .appel-final .numero-clair { color: #D6E6EC; }
.chemineo-shell .appel-final .numero-clair a { color: var(--blanc); }
.chemineo-shell .lien-remplacement { display: inline-block; margin: 0; font-size: 1rem; color: var(--air); font-weight: 700; }
.chemineo-shell .hero-sous-boutons { margin: 10px 0 0; display: flex; flex-wrap: wrap; gap: 6px 22px; align-items: baseline; }
@media (min-width: 960px) { .chemineo-shell .hero-grille > .hero-sous-boutons { grid-area: annot; } }
/* 1.3.0 — quatre cartes de prestations : 2×2 sur mobile, 4 colonnes sur ordinateur */
.chemineo-shell .cartes-offres { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.chemineo-shell .carte-offre { padding: 14px; }
.chemineo-shell .carte-offre h3 { font-size: 1.05rem; }
.chemineo-shell .carte-offre p { font-size: .9375rem; }
.chemineo-shell .carte-offre .bouton { font-size: .9375rem; min-height: 46px; padding: .5em .6em; }
.chemineo-shell .carte-offre .carte-icone { display: grid; place-items: center; width: 100%; aspect-ratio: 360 / 220; margin-bottom: 14px; border-radius: var(--rayon); background: var(--givre); color: var(--air); }
.chemineo-shell .carte-offre .carte-icone svg { width: 34%; height: auto; }
@media (min-width: 760px) { .chemineo-shell .cartes-offres { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; } }
@media (max-width: 400px) { .chemineo-shell .carte-offre .bouton { font-size: .875rem; padding: .5em .4em; } }
/* 1.3.0 — FAQ groupée par parcours */
.chemineo-shell .faq h3 { margin: 28px 0 6px; font-size: .9375rem; letter-spacing: .06em; text-transform: uppercase; color: var(--air); }
.chemineo-shell .faq h3:first-child { margin-top: 8px; }
.chemineo-shell .faq details:last-child { border-bottom: 1px solid var(--trait); }
.chemineo-shell .faq h3 + details { border-top: 1px solid var(--trait); }
.chemineo-shell .faq details:has(+ h3) { border-bottom: 1px solid var(--trait); }
/* 1.3.0 — reçu déjà enregistré dans ce navigateur, avis de mode test */
.chemineo-shell .deja-recu { margin: 0; padding: 14px; border-left: 4px solid var(--braise); background: #FFF7E8; font-size: 1rem; }
.chemineo-shell .deja-recu button { display: block; margin-top: 10px; min-height: 44px; padding: 8px 14px; border: 1.5px solid var(--encre); border-radius: var(--rayon-petit); background: var(--blanc); color: var(--encre); font: 700 1rem var(--police); cursor: pointer; }
.chemineo-shell .avis-test { margin: 12px 0 0; padding: 10px 12px; border-left: 4px solid #C9A227; background: #FFF4C2; color: #4A3800; font-size: .9375rem; }
/* 1.3.0 — page merci : pied de page en bas de l'écran si le contenu est court */
.chemineo-shell.merci-page { display: flex; flex-direction: column; min-height: 100vh; }
.chemineo-shell.merci-page > main { flex: 1; }
.chemineo-shell.merci-page .pied { padding-bottom: 36px; }
.chemineo-shell .merci-mail { margin: 0 0 1em; }

/* 1.3.1 — points en attente de Michael (M1–M5) : visibles en mode test, jamais en mode réel (refusé tant qu’un point attend) */
.chemineo-shell mark.attente-michael { background: #FFE0B2; color: #3B2600; padding: 0 .15em; border-radius: 3px; -webkit-box-decoration-break: clone; box-decoration-break: clone; }
.chemineo-shell .marqueur-attente { display: inline-block; margin-left: .15em; padding: 0 .4em; border-radius: 4px; background: #9A3412; color: #FFFFFF; font-size: .75rem; font-weight: 700; line-height: 1.6; letter-spacing: .02em; white-space: nowrap; vertical-align: .1em; }
.chemineo-shell.mode-live mark.attente-michael, .chemineo-shell.mode-live .marqueur-attente { display: none !important; }
/* Note propre au parcours choisi (étape 1) : devis gratuit pour l’installation et le remplacement, payant pour l’entretien */
.chemineo-shell .note-parcours { margin: -4px 0 18px; padding: 10px 12px; border-left: 4px solid var(--air); border-radius: 0 var(--rayon-petit) var(--rayon-petit) 0; background: var(--givre); color: var(--encre); font-size: .9375rem; font-weight: 700; line-height: 1.45; }
.chemineo-shell .rappel-messagerie { white-space: normal; }