/* imertiv.com — la feuille du site.   [imertiv-site-2026-10-01]
 * La DA de la plaquette 2026 et des e-mails : le nom en capitales espacées, le magenta, le prune, le fond rosé.
 * Les polices : Myriad Pro, sinon Arial (consigne du 01/10 : « je ne veux pas des polices AI »). Aucune police n'est
 * chargée : Myriad Pro s'affiche chez qui l'a (logiciels Adobe), Arial ailleurs.
 * Une seule tenue, claire : chaque couleur est posée explicitement. */


/* Les jetons. Mise en page : une colonne éditoriale de 1200 px, des bandes pleine largeur qui alternent le rosé, le blanc et l'encre. */
:root{
  --fond:#FAF5F9;--blanc:#FFFFFF;--encre:#1A1620;--encre-2:#3A3340;--gris:#6B6271;--gris-2:#9A91A0;
  --ligne:#EADDE6;--ligne-2:#DCCBD6;--peche:#F7EAF2;--magenta:#C93F8A;--magenta-f:#AE3376;--prune:#9D4691;--prune-f:#7A3470;--rose:#F2B8D8;
  --sur-encre:#EFE6EC;--sur-encre-2:#B9AEB7;
  --titre:'Myriad Pro',Myriad,Arial,'Helvetica Neue',Helvetica,sans-serif;
  --texte:'Myriad Pro',Myriad,Arial,'Helvetica Neue',Helvetica,sans-serif;
  --r-s:12px;--r-m:18px;--r-l:28px;
  --ombre:0 1px 2px rgba(26,22,32,.05),0 18px 40px -22px rgba(26,22,32,.28);
  --large:1200px;--gouttiere:clamp(16px,4vw,32px);
  color-scheme:light;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;background:var(--fond)}
body{margin:0;background:var(--fond);color:var(--encre);font:17px/1.62 var(--texte);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
img,svg{display:block;max-width:100%}
a{color:var(--prune);text-decoration-thickness:1px;text-underline-offset:3px}
a:hover{color:var(--prune-f)}
:focus-visible{outline:3px solid rgba(201,63,138,.5);outline-offset:3px;border-radius:6px}
::selection{background:#F4CBE1;color:var(--encre)}
p{margin:0 0 1em}
h1,h2,h3,h4{font-family:var(--titre);font-weight:700;color:var(--encre);margin:0;text-wrap:balance}
h1{font-size:clamp(40px,6.2vw,74px);line-height:1.03;letter-spacing:-.03em}
h2{font-size:clamp(30px,4vw,48px);line-height:1.08;letter-spacing:-.025em}
h3{font-size:clamp(20px,2vw,23px);line-height:1.25;letter-spacing:-.01em}
.ic{width:22px;height:22px;flex:none;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}

.passer{position:absolute;left:12px;top:-60px;z-index:100;background:var(--encre);color:#fff;padding:10px 16px;border-radius:999px;text-decoration:none;font-weight:600}
.passer:focus{top:12px;color:#fff}
.conteneur{width:100%;max-width:calc(var(--large) + 2 * var(--gouttiere));margin:0 auto;padding-inline:var(--gouttiere)}
.surtitre{display:inline-block;margin:0 0 18px;font:600 13px/1.3 var(--texte);letter-spacing:.14em;text-transform:uppercase;color:var(--magenta)}
.chapeau{font-size:clamp(18px,1.6vw,21px);line-height:1.55;color:var(--encre-2);max-width:60ch}
.petit{font-size:14px;color:var(--gris)}

/* L'en-tête : le nom en capitales espacées, comme dans les e-mails. */
.entete{position:sticky;top:0;z-index:50;background:rgba(250,245,249,.9);backdrop-filter:saturate(1.4) blur(14px);-webkit-backdrop-filter:saturate(1.4) blur(14px);border-bottom:1px solid transparent;transition:border-color .2s}
.entete.defile{border-bottom-color:var(--ligne)}
.entete .conteneur{display:flex;align-items:center;gap:20px;height:76px}
.marque{display:inline-flex;align-items:center;gap:14px;text-decoration:none;color:var(--encre);margin-right:auto;min-width:0}
.marque-nom{font:700 17px/1 var(--texte);letter-spacing:.42em;text-transform:uppercase;color:var(--magenta);margin-right:-.42em}
.marque-sep{width:1px;height:16px;background:var(--ligne-2)}
.marque-sous{font:600 11px/1 var(--texte);letter-spacing:.2em;text-transform:uppercase;color:var(--gris);white-space:nowrap}
.nav{display:flex;align-items:center;gap:4px}
.nav a{padding:9px 13px;border-radius:999px;color:var(--encre-2);text-decoration:none;font-size:15px;font-weight:500;white-space:nowrap}
.nav a:hover{background:var(--peche);color:var(--encre)}
.nav a[aria-current="page"]{color:var(--magenta)}
.nav .btn{display:none}
.entete .btn{flex:none;padding:11px 18px;font-size:15px}
.menu-bouton{display:none;align-items:center;gap:8px;padding:10px 14px;border:1px solid var(--ligne-2);border-radius:999px;background:var(--blanc);color:var(--encre);font:600 15px/1 var(--texte);cursor:pointer}
.menu-bouton .barres{position:relative;width:16px;height:10px}
.menu-bouton .barres::before,.menu-bouton .barres::after{content:"";position:absolute;left:0;right:0;height:2px;border-radius:2px;background:currentColor;transition:transform .2s,top .2s}
.menu-bouton .barres::before{top:0}.menu-bouton .barres::after{top:8px}
.menu-bouton[aria-expanded="true"] .barres::before{top:4px;transform:rotate(45deg)}
.menu-bouton[aria-expanded="true"] .barres::after{top:4px;transform:rotate(-45deg)}

/* Les boutons. */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;white-space:nowrap;padding:15px 24px;border-radius:999px;border:1px solid transparent;font:600 16px/1.1 var(--texte);text-decoration:none;cursor:pointer;transition:background-color .15s,border-color .15s,color .15s,transform .15s}
.btn .ic{width:18px;height:18px;stroke-width:2.2;transition:transform .15s}
.btn:hover .ic{transform:translateX(3px)}
.btn-plein{background:var(--magenta);color:#fff}
.btn-plein:hover{background:var(--magenta-f);color:#fff}
.btn-contour{background:transparent;color:var(--encre);border-color:var(--ligne-2)}
.btn-contour:hover{border-color:var(--encre);color:var(--encre)}
.btn-clair{background:transparent;color:#fff;border-color:rgba(255,255,255,.28)}
.btn-clair:hover{border-color:#fff;color:#fff}
.boutons{display:flex;flex-wrap:wrap;gap:12px;align-items:center}

/* Les bandes. */
.bande{padding-block:clamp(64px,9vw,120px)}
.bande-blanche{background:var(--blanc)}
.bande-encre{background:var(--encre);color:var(--sur-encre)}
.bande-encre h2,.bande-encre h3{color:#fff}
.bande-encre .surtitre{color:var(--rose)}
.bande-tete{display:grid;gap:18px;max-width:780px;margin-bottom:clamp(36px,5vw,64px)}
.bande-tete .chapeau{margin:0}
.bande-tete.centre{margin-inline:auto;text-align:center;justify-items:center}

/* L'ouverture de l'accueil. */
.ouverture{padding-block:clamp(40px,6vw,88px) clamp(56px,8vw,110px)}
.ouverture .conteneur{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);gap:clamp(32px,5vw,72px);align-items:center}
.ouverture h1{margin-bottom:24px}
.ouverture h1 em{font-style:normal;color:var(--magenta)}
.ouverture .chapeau{margin-bottom:32px}
.rassure{display:flex;flex-wrap:wrap;gap:8px 22px;margin:26px 0 0;padding:0;list-style:none;color:var(--gris);font-size:14px}
.rassure li{display:inline-flex;align-items:center;gap:8px}
.rassure .ic{width:17px;height:17px;color:var(--magenta)}

/* La composition de l'ouverture : le cabinet prêt, le rendez-vous, l'étiquette DPE. */
.composition{position:relative;display:flex;flex-direction:column}
.carte-cabinet{position:relative;z-index:2;align-self:flex-end;width:min(100%,430px);padding:40px 26px 36px;background:var(--blanc);border:1px solid var(--ligne);border-radius:var(--r-l);box-shadow:var(--ombre)}
.carte-cabinet .tete{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin-bottom:6px}
.carte-cabinet .tete b{font:700 20px/1.2 var(--titre);letter-spacing:-.015em}
.carte-cabinet .tete span{font-size:13px;color:var(--gris)}
.jauge{height:6px;border-radius:999px;background:var(--peche);overflow:hidden;margin:14px 0 18px}
.jauge i{display:block;height:100%;width:80%;border-radius:inherit;background:var(--magenta)}
.coches{list-style:none;margin:0;padding:0;display:grid;gap:2px}
.coches li{display:grid;grid-template-columns:28px minmax(0,1fr) auto;align-items:center;gap:10px;padding:10px 0;border-top:1px solid var(--ligne);font-size:15px}
.coches li:first-child{border-top:0}
.coches .rond{width:24px;height:24px;border-radius:50%;display:grid;place-items:center;background:var(--magenta);color:#fff}
.coches .rond .ic{width:14px;height:14px;stroke-width:2.6}
.coches .en-cours .rond{background:var(--peche);color:var(--magenta);border:1.5px dashed var(--magenta)}
.coches small{font-size:12.5px;color:var(--gris);white-space:nowrap}
.carte-visio{position:relative;z-index:3;align-self:flex-start;width:min(262px,82%);margin-bottom:-24px;padding:16px 18px;background:var(--encre);color:var(--sur-encre);border-radius:var(--r-m);box-shadow:var(--ombre)}
.carte-visio .ligne1{display:flex;align-items:center;gap:10px;font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--rose);font-weight:600}
.carte-visio .ligne1 .ic{width:18px;height:18px}
.carte-visio b{display:block;margin:8px 0 2px;font:700 18px/1.25 var(--titre);color:#fff}
.carte-visio span{font-size:13.5px;color:var(--sur-encre-2)}
.carte-dpe{position:relative;z-index:3;align-self:flex-start;width:min(240px,76%);margin:-26px 0 0 4%;padding:16px 16px 14px;background:var(--blanc);border:1px solid var(--ligne);border-radius:var(--r-m);box-shadow:var(--ombre)}
.carte-dpe .ligne1{display:flex;justify-content:space-between;font-size:12px;color:var(--gris);margin-bottom:10px}
.carte-dpe .ligne1 b{color:var(--encre);font-weight:600}
.echelle{display:grid;gap:4px}
.echelle span{display:flex;align-items:center;height:17px;padding-left:7px;border-radius:0 9px 9px 0;color:#fff;font:700 11px/1 var(--texte)}
.echelle span:nth-child(1){width:34%;background:#009C6D}.echelle span:nth-child(2){width:44%;background:#52B153}
.echelle span:nth-child(3){width:54%;background:#78BD76}.echelle span:nth-child(4){width:64%;background:#F4E70F;color:#4a4300}
.echelle span:nth-child(5){width:74%;background:#F0B50F;color:#4a3600}.echelle span:nth-child(6){width:84%;background:#EB8235}
.echelle span:nth-child(7){width:94%;background:#D7221F}
.echelle .ici{position:relative;outline:2px solid var(--encre);outline-offset:1px}
.anneau{position:absolute;z-index:1;right:-60px;top:40px;width:300px;height:300px;border-radius:50%;border:54px solid var(--magenta);opacity:.12;pointer-events:none}

/* Le constat. */
.constat{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(32px,6vw,96px);align-items:start}
.constat h2 em{font-style:normal;color:var(--magenta)}
.trois-taches{list-style:none;margin:0;padding:0;display:grid;gap:0}
.trois-taches li{display:grid;grid-template-columns:56px minmax(0,1fr);gap:16px;padding:22px 0;border-top:1px solid var(--ligne)}
.trois-taches li:last-child{border-bottom:1px solid var(--ligne)}
.trois-taches .pic{padding-top:2px;color:var(--magenta)}
.trois-taches .pic .ic{width:28px;height:28px;stroke-width:1.6}
.trois-taches b{display:block;font:700 20px/1.3 var(--titre);letter-spacing:-.01em;margin-bottom:4px}
.trois-taches p{margin:0;color:var(--encre-2)}
.chute{margin:22px 0 0;font:600 18px/1.4 var(--titre);color:var(--prune)}

/* Un titre de rang h2 à l'allure d'un h3. */
.h3{font-size:clamp(20px,2vw,23px);line-height:1.25;letter-spacing:-.01em}

/* Les trois piliers. */
.piliers{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.pilier{display:flex;flex-direction:column;padding:30px 28px 28px;background:var(--fond);border:1px solid var(--ligne);border-radius:var(--r-l)}
.bande-blanche .pilier{background:var(--fond)}
.piliers.quatre{grid-template-columns:repeat(2,minmax(0,1fr))}
.pilier .num{font:700 44px/1 var(--titre);color:var(--magenta);letter-spacing:-.03em}
.pilier h3{margin:18px 0 10px;font-size:28px}
.pilier>p{color:var(--encre-2);margin-bottom:20px}
.pilier ul{list-style:none;margin:auto 0 0;padding:18px 0 0;border-top:1px solid var(--ligne-2);display:grid;gap:10px}
.pilier li{display:flex;gap:10px;align-items:flex-start;font-size:15px;line-height:1.45}
.pilier li .ic{width:18px;height:18px;margin-top:1px;color:var(--magenta);stroke-width:2.2}

/* L'offre de base. */
.grille-offre{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.element{display:grid;gap:12px;align-content:start;padding:26px 24px;background:var(--blanc);border:1px solid var(--ligne);border-radius:var(--r-m)}
.element .pastille{width:46px;height:46px;border-radius:14px;display:grid;place-items:center;background:var(--peche);color:var(--magenta)}
.element h3{font-size:20px}
.element p{margin:0;color:var(--encre-2);font-size:15.5px;line-height:1.55}
.element.large{grid-column:span 2;grid-template-columns:auto minmax(0,1fr);align-items:center;align-content:center;gap:20px;background:var(--encre);border-color:var(--encre);color:var(--sur-encre)}
.element.large h3{font-size:24px;margin-bottom:6px}
.element.large p{font-size:16px}
.element.large a{color:var(--rose)}
.element.large h3{color:#fff}
.element.large p{color:var(--sur-encre-2)}
.element.large .pastille{background:rgba(255,255,255,.08);color:var(--rose)}

/* Les options et les partenaires. */
.deux-listes{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(24px,4vw,48px)}
.liste-titre{display:flex;align-items:baseline;justify-content:space-between;gap:12px;padding-bottom:14px;margin-bottom:6px;border-bottom:2px solid var(--encre)}
.liste-titre h3{font-size:22px}
.liste-titre span{font-size:13px;color:var(--gris);white-space:nowrap}
.lignes{list-style:none;margin:0;padding:0}
.lignes li{display:grid;grid-template-columns:40px minmax(0,1fr);gap:14px;padding:18px 0;border-bottom:1px solid var(--ligne)}
.lignes .ic{margin-top:3px;color:var(--prune)}
.lignes b{display:block;font:700 18px/1.3 var(--titre);letter-spacing:-.01em;margin-bottom:3px}
.lignes p{margin:0;color:var(--encre-2);font-size:15.5px;line-height:1.55}
.lignes .qui{display:inline-block;margin-top:6px;font-size:13px;color:var(--gris)}
.avertissement{margin:28px 0 0;padding:18px 20px;border-left:3px solid var(--prune);background:var(--peche);border-radius:0 var(--r-s) var(--r-s) 0;font-size:14.5px;line-height:1.6;color:var(--encre-2)}
.avertissement p{margin:0}

/* Les trois étapes. */
.etapes{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;counter-reset:etape;position:relative}
.etape{position:relative;padding:28px 26px;background:var(--blanc);border:1px solid var(--ligne);border-radius:var(--r-m);counter-increment:etape}
.etape::before{content:counter(etape);display:grid;place-items:center;width:44px;height:44px;margin-bottom:22px;border-radius:50%;background:var(--encre);color:#fff;font:700 18px/1 var(--titre)}
.etape.ici::before{background:var(--magenta)}
.etape h3{margin-bottom:8px}
.etape p{margin:0;color:var(--encre-2)}
.etapes-suite{margin-top:36px}

/* Ce qui ne change pas. */
.independance{position:relative;overflow:hidden}
.independance .conteneur{position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:48px;align-items:end}
.devise{margin:0;font:700 clamp(40px,6.4vw,80px)/1.02 var(--titre);letter-spacing:-.03em;color:#fff}
.devise span{display:block}
.devise span:last-child{color:var(--rose)}
.independance .texte p{color:var(--sur-encre);font-size:18px;max-width:46ch;margin:0}
.independance .anneau{opacity:1;right:-170px;bottom:-230px;top:auto;width:440px;height:440px;border-width:72px;border-color:var(--magenta)}

/* Pour qui. */
.pour-qui{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:20px}
.profil{display:flex;flex-direction:column;padding:clamp(28px,4vw,44px);border-radius:var(--r-l);background:var(--blanc);border:1px solid var(--ligne);text-decoration:none;color:var(--encre);transition:border-color .15s,transform .15s}
.profil:hover{border-color:var(--magenta);color:var(--encre)}
.profil.accent{background:var(--magenta);border-color:var(--magenta);color:#fff}
.profil.accent:hover{color:#fff;border-color:var(--magenta-f)}
.profil .surtitre{margin-bottom:12px}
.profil.accent .surtitre{color:#FFE3F1}
.profil h3,.profil .h3{font-size:clamp(24px,2.6vw,32px);line-height:1.15;letter-spacing:-.02em;margin-bottom:12px;color:inherit}
.profil p{color:inherit;opacity:.86}
.profil .suite{margin-top:auto;padding-top:18px;display:inline-flex;align-items:center;gap:8px;font-weight:600}
.profil .suite .ic{width:18px;height:18px;stroke-width:2.2;transition:transform .15s}
.profil:hover .suite .ic{transform:translateX(3px)}

/* Les cartes des guides. */
.grille-guides{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.carte-guide{height:100%;display:flex;flex-direction:column;gap:12px;padding:26px 24px;background:var(--blanc);border:1px solid var(--ligne);border-radius:var(--r-m);text-decoration:none;color:var(--encre);transition:border-color .15s}
.carte-guide:hover{border-color:var(--magenta);color:var(--encre)}
.carte-guide .surtitre{margin:0;font-size:12px}
.carte-guide h3{font-size:21px}
.carte-guide p{margin:0;color:var(--encre-2);font-size:15.5px;line-height:1.55}
.carte-guide .petit{margin-top:auto;padding-top:8px}

/* La foire aux questions. */
.faq{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(32px,6vw,80px);align-items:start}
.questions{border-top:1px solid var(--ligne-2)}
.questions details{border-bottom:1px solid var(--ligne-2)}
.questions summary{list-style:none;display:flex;justify-content:space-between;align-items:center;gap:20px;padding:22px 0;cursor:pointer;font:700 19px/1.35 var(--titre);letter-spacing:-.01em}
.questions summary::-webkit-details-marker{display:none}
.questions summary::after{content:"";flex:none;width:30px;height:30px;border-radius:50%;border:1px solid var(--ligne-2);background:no-repeat center/12px 12px url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M6 1v10M1 6h10' stroke='%23C93F8A' stroke-width='1.8' stroke-linecap='round'/%3E%3C/svg%3E");transition:transform .2s}
.questions details[open] summary::after{transform:rotate(45deg)}
.questions .reponse{padding:0 50px 22px 0;color:var(--encre-2)}
.questions .reponse p:last-child{margin-bottom:0}

.faq-liste{display:grid;gap:clamp(40px,6vw,72px)}
.faq-theme .h3{font-size:24px;padding-top:20px}
.contact-grille .btn{margin-top:4px}
.contact-grille p:last-child a:not(.btn){font-weight:600;font-size:17px}

/* L'appel final. */
.appel{position:relative;overflow:hidden;padding:clamp(40px,6vw,72px);border-radius:var(--r-l);background:var(--encre);color:var(--sur-encre)}
.appel>*{position:relative;z-index:1}
.appel h2{color:#fff;max-width:16ch;margin-bottom:18px}
.appel p{max-width:52ch;color:var(--sur-encre);font-size:18px}
.appel .boutons{margin-top:28px}
.appel .contact{margin:22px 0 0;font-size:15px;color:var(--sur-encre-2)}
.appel .contact a{color:var(--rose)}
.appel .anneau{position:absolute;z-index:0;opacity:1;right:-110px;top:-110px;width:340px;height:340px;border-width:62px}

/* Le fil d'Ariane et l'en-tête des pages intérieures. */
.fil{margin:0 0 26px;padding:0;list-style:none;display:flex;flex-wrap:wrap;gap:6px 10px;font-size:14px;color:var(--gris)}
.fil li{display:inline-flex;align-items:center;gap:10px}
.fil li+li::before{content:"/";color:var(--gris-2)}
.fil a{color:var(--gris);text-decoration:none}
.fil a:hover{color:var(--magenta)}
.tete-page{padding-block:clamp(36px,5vw,72px) clamp(40px,6vw,80px)}
.tete-page h1{font-size:clamp(36px,5.2vw,64px);max-width:22ch;margin-bottom:22px}
.tete-page .chapeau{margin-bottom:0}
.tete-page .boutons{margin-top:30px}
.meta-article{display:flex;flex-wrap:wrap;gap:6px 18px;margin-top:22px;font-size:14px;color:var(--gris)}

/* Les articles (guides, page des nouveaux certifiés). */
.article{display:grid;grid-template-columns:minmax(0,240px) minmax(0,720px);gap:clamp(32px,6vw,88px);align-items:start;padding-bottom:clamp(56px,8vw,100px)}
.sommaire{position:sticky;top:100px;font-size:14px}
.sommaire b{display:block;margin-bottom:12px;font:600 12px/1.3 var(--texte);letter-spacing:.14em;text-transform:uppercase;color:var(--gris)}
.sommaire ol{list-style:none;margin:0;padding:0;display:grid;gap:2px;border-left:1px solid var(--ligne-2)}
.sommaire a{display:block;padding:6px 0 6px 16px;margin-left:-1px;border-left:2px solid transparent;color:var(--encre-2);text-decoration:none;line-height:1.4}
.sommaire a:hover{color:var(--magenta);border-left-color:var(--magenta)}
.prose{font-size:18px;line-height:1.72;min-width:0}
.prose>*:first-child{margin-top:0}
.prose h2{font-size:clamp(28px,3.2vw,36px);margin:2.2em 0 .6em;scroll-margin-top:100px}
.prose h3{font-size:22px;margin:1.8em 0 .5em;scroll-margin-top:100px}
.prose p,.prose ul,.prose ol{margin:0 0 1.1em}
.prose ul,.prose ol{padding-left:1.3em}
.prose li{margin:.35em 0}
.prose li::marker{color:var(--magenta)}
.prose strong{font-weight:600;color:var(--encre)}
.prose .encart{margin:1.6em 0;padding:20px 22px;background:var(--blanc);border:1px solid var(--ligne);border-left:3px solid var(--magenta);border-radius:0 var(--r-s) var(--r-s) 0;font-size:16.5px;line-height:1.65}
.prose .encart p:last-child{margin:0}
.prose .encart b{display:block;margin-bottom:6px;font:700 17px/1.3 var(--titre)}
.prose .tableau{overflow-x:auto;margin:1.4em 0;border:1px solid var(--ligne);border-radius:var(--r-s);background:var(--blanc)}
.prose table{border-collapse:collapse;width:100%;font-size:15.5px;line-height:1.5}
.prose th,.prose td{padding:12px 14px;text-align:left;vertical-align:top;border-bottom:1px solid var(--ligne)}
.prose th{font-weight:600;background:var(--peche)}
.prose tr:last-child td{border-bottom:0}
.prose .etapes-liste{list-style:none;padding:0;counter-reset:pas}
.prose .etapes-liste>li{position:relative;counter-increment:pas;padding:0 0 0 54px;margin:0 0 1.4em}
.prose .etapes-liste>li::before{content:counter(pas);position:absolute;left:0;top:2px;width:36px;height:36px;border-radius:50%;background:var(--encre);color:#fff;display:grid;place-items:center;font:700 16px/1 var(--titre)}
.prose .etapes-liste>li>b{display:block;font:700 20px/1.35 var(--titre);letter-spacing:-.01em;margin-bottom:4px}
.encadre-imertiv{margin:2.4em 0;padding:28px 28px 26px;border-radius:var(--r-m);background:var(--encre);color:var(--sur-encre)}
.encadre-imertiv .surtitre{margin-bottom:10px;color:var(--rose)}
.encadre-imertiv h2,.encadre-imertiv h3{color:#fff;margin:0 0 10px;font-size:26px}
.encadre-imertiv p{color:var(--sur-encre)}
.encadre-imertiv a:not(.btn){color:var(--rose)}
.encadre-imertiv .boutons{margin-top:18px}
.a-lire{margin-top:3em;padding-top:28px;border-top:1px solid var(--ligne-2)}
.a-lire h2{font-size:24px;margin:0 0 16px}
.a-lire ul{list-style:none;padding:0;margin:0;display:grid;gap:10px}
.a-lire a{font-weight:600}
.note-info{margin-top:2.4em;font-size:14px;color:var(--gris);line-height:1.6}

/* Les pages de texte (mentions, confidentialité). */
.texte-legal{max-width:760px;padding-bottom:clamp(56px,8vw,100px);font-size:16.5px}
.texte-legal h2{font-size:26px;margin:2em 0 .6em}
.texte-legal dl{display:grid;grid-template-columns:minmax(0,220px) minmax(0,1fr);gap:10px 24px;margin:0 0 1em}
.texte-legal dt{font-weight:600}
.texte-legal dd{margin:0}

/* Le pied de page. */
.pied{background:var(--encre);color:var(--sur-encre-2);padding-block:clamp(56px,7vw,88px) 36px;font-size:15px}
.pied a{color:var(--sur-encre);text-decoration:none}
.pied a:hover{color:#fff;text-decoration:underline}
.pied .btn,.pied .btn:hover{color:#fff;text-decoration:none}
.pied-haut{display:grid;grid-template-columns:minmax(0,1.4fr) repeat(3,minmax(0,1fr));gap:40px}
.pied .marque-nom{color:var(--rose)}
.pied-promesse{margin:18px 0 22px;font:700 24px/1.2 var(--titre);color:#fff;letter-spacing:-.02em;max-width:18ch}
.pied h2{font:600 12px/1.3 var(--texte);letter-spacing:.14em;text-transform:uppercase;color:var(--sur-encre-2);margin:6px 0 16px}
.pied ul{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.pied-bas{margin-top:56px;padding-top:24px;border-top:1px solid rgba(255,255,255,.12);display:grid;gap:12px;font-size:13px;line-height:1.6}
.pied-bas p{margin:0;max-width:110ch}

/* La page 404. */
.introuvable{padding-block:clamp(64px,10vw,140px);text-align:left}
.introuvable .code{font:700 clamp(80px,14vw,160px)/.9 var(--titre);color:var(--magenta);letter-spacing:-.04em;margin:0 0 20px}

@media (max-width:1100px){
  .nav,.entete .btn{display:none}
  .menu-bouton{display:inline-flex}
  .entete.ouvert .nav{display:flex;position:absolute;left:0;right:0;top:76px;flex-direction:column;align-items:stretch;gap:2px;padding:12px var(--gouttiere) 20px;background:var(--fond);border-bottom:1px solid var(--ligne);box-shadow:0 20px 30px -24px rgba(26,22,32,.3)}
  .entete.ouvert .nav a{padding:13px 4px;border-radius:0;border-bottom:1px solid var(--ligne);font-size:17px}
  .entete.ouvert .nav .btn{display:inline-flex;margin-top:14px;border-bottom:0;padding:15px 22px;border-radius:999px;color:#fff}
  .entete.ouvert .nav .btn:hover{background:var(--magenta-f);color:#fff}
  .grille-offre{grid-template-columns:repeat(2,minmax(0,1fr))}
  .element.large{grid-column:auto;grid-template-columns:minmax(0,1fr)}
  .pied-haut{grid-template-columns:repeat(2,minmax(0,1fr))}
  .article{grid-template-columns:minmax(0,1fr)}
  .sommaire{position:static;padding:18px 20px;background:var(--blanc);border:1px solid var(--ligne);border-radius:var(--r-m)}
}
@media (max-width:900px){
  .ouverture .conteneur,.constat,.faq,.independance .conteneur,.deux-listes{grid-template-columns:minmax(0,1fr)}
  .composition{max-width:520px}
  .piliers,.piliers.quatre,.etapes,.grille-guides{grid-template-columns:minmax(0,1fr)}
  .pour-qui{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:640px){
  body{font-size:16.5px}
  .entete .conteneur{height:66px}
  .entete.ouvert .nav{top:66px}
  .marque-sep,.marque-sous{display:none}
  .grille-offre{grid-template-columns:minmax(0,1fr)}
  .element.large{grid-column:auto;grid-template-columns:minmax(0,1fr)}
  .carte-visio,.carte-dpe,.composition .anneau{display:none}
  .carte-cabinet{width:100%;padding:26px 22px 22px}
  .questions .reponse{padding-right:0}
  .trois-taches li{grid-template-columns:36px minmax(0,1fr);gap:12px}
  .prose{font-size:17px}
  .pied-haut{grid-template-columns:minmax(0,1fr)}
  .texte-legal dl{grid-template-columns:minmax(0,1fr);gap:2px}
  .texte-legal dd{margin-bottom:10px}
  .btn{width:100%}
  .entete .btn,.menu-bouton{width:auto}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}
@media (prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}
@media print{.entete,.pied,.appel,.sommaire{display:none}body{background:#fff}}
