/* Novaris — charte « peinture fraîche » : mise en page, peinture, mouvement. Chargé par Base.astro. */
:root{--nv-nuit:#0e1c2b;--nv-nuit-2:#152739;--nv-papier:#f5f2ec;--nv-orange:#f26b2a;--nv-orange-fonce:#a8380b;--nv-ocre:#e9a83a;--nv-bleu:#2c7ba6;--nv-bleu-profond:#22668a;--nv-ardoise:#56606b;--nv-brume:#a9b4bf;--nv-brume-clair:#bcc6d0;
--nv-lead:#f26b2a;--nv-lead-fonce:#a8380b;--nv-dk:#0e1c2b;--nv-lt:#f5f2ec;--nv-ad:var(--nv-lead);--nv-al:var(--nv-lead-fonce);--nv-hero:var(--nv-dk);
--nv-ease:cubic-bezier(.22,.7,.2,1);
/* Échelle de la planche. Six paliers, rapport 1,5. Première valeur à 1440,
   seconde à 390, interpolation linéaire entre les deux. */
--nv-t-affiche:clamp(72px,43.03px + 7.4286vw,150px);
--nv-t-affiche-xl:clamp(96px,69.26px + 6.8571vw,168px);
--nv-t-h1:clamp(60px,40.69px + 4.9524vw,112px);
--nv-t-h2:clamp(44px,27.66px + 4.1905vw,88px);
--nv-t-h3:clamp(22px,19.77px + 0.5714vw,28px);
--nv-t-lead:clamp(18px,16.89px + 0.2857vw,21px);
--nv-t-prix:clamp(72px,57.14px + 3.8095vw,112px);
--nv-t-bilan:clamp(44px,42.51px + 0.3810vw,48px);
--nv-t-numero:clamp(36px,33.03px + 0.7619vw,44px);
--nv-t-note:clamp(120px,90.29px + 7.6190vw,200px);
--nv-t-prix-commune:clamp(28px,17.60px + 2.6667vw,56px);
/* Base 8, pas 8 / 16 / 24 / 40 / 72 / 136. */
--nv-e1:8px;--nv-e2:16px;--nv-e3:24px;--nv-e4:40px;--nv-e5:72px;--nv-e6:136px;
--nv-pad-section:clamp(72px,48.23px + 6.0952vw,136px);
--nv-marge:clamp(20px,6.63px + 3.4286vw,56px);--nv-brosse:url("data:image/svg+xml,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%20200%2020'%20preserveAspectRatio%3D'none'%3E%3Cpath%20d%3D'M3%206C40%202%2090%204%20140%203C165%202%20185%201%20198%204L196%209C199%2012%20197%2016%20190%2017C150%2019%2090%2016%2040%2018C20%2019%206%2018%202%2015C0%2012%204%2010%203%206Z'%2F%3E%3C%2Fsvg%3E")}
html,body{overflow-x:clip}
body{counter-reset:nvsec}
/* Provinces : accent, fond du bandeau de titre, fond clair */
html:has(link[rel="canonical"][href$="-aalst"]),
html:has(link[rel="canonical"][href$="-deinze"]),
html:has(link[rel="canonical"][href$="-dendermonde"]),
html:has(link[rel="canonical"][href$="-geraardsbergen"]),
html:has(link[rel="canonical"][href$="-gent"]),
html:has(link[rel="canonical"][href$="-lokeren"]),
html:has(link[rel="canonical"][href$="-ninove"]),
html:has(link[rel="canonical"][href$="-oudenaarde"]),
html:has(link[rel="canonical"][href$="-sint-niklaas"]),
html:has(link[rel="canonical"][href$="-wetteren"]),
html:has(link[rel="canonical"][href$="-zottegem"]){--nv-lead:#f26b2a;--nv-lead-fonce:#a8380b;--nv-hero:#39201a;--nv-lt:#f5e2d5;--nv-prov:"ovl"}
html:has(link[rel="canonical"][href$="-brugge"]){--nv-lead:#5fb3e0;--nv-lead-fonce:#1b5a80;--nv-hero:#0f2a3d;--nv-lt:#e3eaeb;--nv-prov:"wvl"}
html:has(link[rel="canonical"][href$="-antwerpen"]),
html:has(link[rel="canonical"][href$="-mechelen"]){--nv-lead:#ff7b72;--nv-lead-fonce:#b0281f;--nv-hero:#3c1b20;--nv-lt:#f6e4dd;--nv-prov:"ant"}
html:has(link[rel="canonical"][href$="-leuven"]){--nv-lead:#6cc58a;--nv-lead-fonce:#2a6a40;--nv-hero:#142f2a;--nv-lt:#e5ede0;--nv-prov:"vbr"}
html:has(link[rel="canonical"][href$="-hasselt"]){--nv-lead:#f2b134;--nv-lead-fonce:#7a5200;--nv-hero:#2c2716;--nv-lt:#f5ead6;--nv-prov:"lim"}
html:has(link[rel="canonical"][href$="-bruxelles"]){--nv-lead:#4fc7c0;--nv-lead-fonce:#0e6661;--nv-hero:#0b2d34;--nv-lt:#e1ede7;--nv-prov:"bru"}
html:has(link[rel="canonical"][href$="-wavre"]),
html:has(link[rel="canonical"][href$="-nivelles"]),
html:has(link[rel="canonical"][href$="-waterloo"]),
html:has(link[rel="canonical"][href$="-braine-lalleud"]),
html:has(link[rel="canonical"][href$="-tubize"]),
html:has(link[rel="canonical"][href$="-ottignies-louvain-la-neuve"]){--nv-lead:#e9a83a;--nv-lead-fonce:#855500;--nv-hero:#2f2816;--nv-lt:#f4e9d7;--nv-prov:"bw"}
html:has(link[rel="canonical"][href$="-ath"]),
html:has(link[rel="canonical"][href$="-charleroi"]),
html:has(link[rel="canonical"][href$="-la-louviere"]),
html:has(link[rel="canonical"][href$="-mons"]),
html:has(link[rel="canonical"][href$="-soignies"]){--nv-lead:#ff85ad;--nv-lead-fonce:#a3214d;--nv-hero:#38192e;--nv-lt:#f6e5e4;--nv-prov:"hai"}
html:has(link[rel="canonical"][href$="-liege"]){--nv-lead:#8cc8ff;--nv-lead-fonce:#1f579a;--nv-hero:#102945;--nv-lt:#e8edee;--nv-prov:"lie"}
html:has(link[rel="canonical"][href$="-namur"]){--nv-lead:#b8d46a;--nv-lead-fonce:#526b16;--nv-hero:#202f1d;--nv-lt:#eeeedc;--nv-prov:"nam"}

/* Dominantes de page : ocre (tarifs), pétrole (méthode), orange (contact) */
html:has(link[rel="canonical"][href$="/tarifs"]),html:has(link[rel="canonical"][href$="/nl/tarieven"]),html:has(link[rel="canonical"][href$="/en/pricing"]){--nv-dk:#2f230c;--nv-lt:#f6e8c9;--nv-ad:#f0b54a;--nv-al:#7a5200;--nv-hero:#2f230c}
html:has(link[rel="canonical"][href$="/methode"]),html:has(link[rel="canonical"][href$="/nl/werkwijze"]),html:has(link[rel="canonical"][href$="/en/method"]){--nv-dk:#123a4b;--nv-lt:#e1ecef;--nv-ad:#8fd3ea;--nv-al:#1a5870;--nv-hero:#123a4b}
html:has(link[rel="canonical"][href$="/contact"]){--nv-dk:#4a1b07;--nv-lt:#fce4d6;--nv-ad:#ff9c6b;--nv-al:#a8380b;--nv-hero:#4a1b07}


body.sur-papier{background-color:var(--nv-lt)}
main .sur-nuit,main .nv-nuit{background-color:var(--nv-dk)}
.nv-nuit{background-color:var(--nv-dk);color:var(--nv-papier)}
main > .nv-hero,main > section:first-child.sur-nuit{background-color:var(--nv-hero)}

main .text-orange{color:var(--nv-lead)}
main .text-orange-fonce{color:var(--nv-lead-fonce)}
main .border-orange{border-color:var(--nv-lead)}
main .nv-nuit .text-orange,main .sur-nuit .text-orange{color:var(--nv-ad)}
main .nv-nuit .nv-accent{color:var(--nv-ad)}

/* Grille et rythme */
.nv-c{max-width:1440px;margin-inline:auto;padding-inline:var(--nv-marge)}
.nv-sec{padding-block:var(--nv-pad-section)}
.nv-eyebrow{margin:0 0 20px;font-family:var(--font-mono);font-weight:500;font-size:13px;letter-spacing:.06em;text-transform:uppercase;color:var(--nv-al)}
.nv-nuit .nv-eyebrow,.sur-nuit .nv-eyebrow{color:var(--nv-ad)}
.sur-orange .nv-eyebrow{color:var(--nv-nuit)}
.nv-num::before{counter-increment:nvsec;content:counter(nvsec,decimal-leading-zero) " — "}
.nv-h1,.nv-h2,.nv-chiffre{font-family:var(--font-titre);font-weight:800;font-stretch:75%}
.nv-h1{margin:0;font-size:var(--nv-t-h1);line-height:.88;letter-spacing:-.035em;text-wrap:balance;overflow-wrap:break-word}
.nv-h2{margin:0;font-size:var(--nv-t-h2);line-height:.9;letter-spacing:-.035em;text-wrap:balance;overflow-wrap:break-word}
.nv-h2-xl{font-size:clamp(64px,11vw,168px);line-height:.85;letter-spacing:-.04em}
.nv-accent{color:var(--nv-orange)}
.nv-gap{margin-top:clamp(40px,4.4vw,72px)}
.nv-lead{margin:var(--nv-e4) 0 0;max-width:40ch;font-size:var(--nv-t-lead);line-height:1.5;text-wrap:pretty}

/* Liens et boutons peints */
.nv-lien{display:inline-flex;align-items:center;min-height:44px;font-weight:600;text-decoration:underline;text-decoration-color:var(--nv-orange);text-decoration-thickness:2px;text-underline-offset:6px;transition:color .22s var(--nv-ease),text-underline-offset .22s var(--nv-ease)}
.nv-lien:hover{color:var(--nv-ocre);text-underline-offset:9px}
.sur-papier .nv-lien:hover,main :not(.nv-nuit) > .nv-lien:hover{color:var(--nv-orange-fonce)}
.nv-nuit .nv-lien:hover,.sur-nuit .nv-lien:hover{color:var(--nv-ocre)}
.nv-btn{position:relative;isolation:isolate;display:inline-flex;align-items:center;min-height:60px;padding:16px 42px 18px 28px;color:var(--nv-orange);text-decoration:none;transition:color .22s var(--nv-ease)}
.nv-btn > svg{position:absolute;inset:0;width:100%;height:100%;z-index:-1;fill:currentColor;transition:transform .26s var(--nv-ease)}
.nv-btn > span{display:flex;gap:10px;align-items:center;color:var(--nv-nuit);font-weight:800;font-size:18px}
.nv-btn:hover{color:var(--nv-ocre)}
.nv-btn:hover > svg{transform:scale(1.03,1.08) rotate(-.6deg)}
.nv-btn-s{min-height:48px;padding:10px 26px 12px 20px}
.nv-btn-s > span{font-size:15px;white-space:nowrap}
.nv-fleche{display:inline-block;transition:transform .24s var(--nv-ease)}
a:hover .nv-fleche,a:focus-visible .nv-fleche{transform:translateX(4px)}

/* En-tête */
.nv-tete{position:relative;z-index:5;display:flex;align-items:center;gap:6px;min-height:64px;border-bottom:2px solid var(--nv-papier);color:var(--nv-papier)}
.nv-tete .nv-logo{display:flex;align-items:center;min-height:44px;margin-right:auto}
.nv-tete .nv-logo img{height:38px;width:auto}
.nv-nav{display:none;gap:26px}
.nv-nav a{display:inline-flex;align-items:center;min-height:44px;font-size:15px;font-weight:600;text-decoration:underline;text-decoration-color:transparent;text-decoration-thickness:3px;text-underline-offset:8px;transition:text-decoration-color .2s,text-underline-offset .2s}
.nv-nav a:hover{text-decoration-color:var(--nv-orange);text-underline-offset:6px}
.nv-nav a[aria-current="page"]{text-decoration-color:var(--nv-orange)}
.nv-langues{display:flex}
.nv-langues a{display:inline-flex;align-items:center;justify-content:center;min-width:40px;min-height:44px;font-family:var(--font-mono);font-weight:500;font-size:13px;letter-spacing:.06em;color:var(--nv-brume);text-decoration:none}
.nv-langues a:hover{color:var(--nv-papier)}
.nv-langues a[aria-current="true"]{color:var(--nv-papier);text-decoration:underline;text-decoration-color:var(--nv-orange);text-decoration-thickness:2px;text-underline-offset:6px}
/* Le rond disparaît : angles droits partout, l'orange reste réservé à
   l'appel. */
.nv-carre{flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;width:48px;height:48px;background:var(--nv-orange);color:var(--nv-nuit)}
/* Le numéro en bouton, à partir de 1024 px : c'est l'action que le site vend. */
.nv-tel-barre{display:none}
.nv-menu-btn{flex:0 0 auto;display:inline-flex;align-items:center;gap:10px;min-width:44px;min-height:48px;padding:0 4px 0 12px;background:none;border:0;color:var(--nv-papier);font-family:var(--font-mono);font-weight:500;font-size:13px;letter-spacing:.06em;text-transform:uppercase;cursor:pointer}
.nv-menu-btn i{display:grid;gap:5px}.nv-menu-btn i b{display:block;width:22px;height:2px;background:currentColor;transition:transform .22s var(--nv-ease)}
.nv-menu-btn[aria-expanded="true"] i b:first-child{transform:translateY(3.5px) rotate(45deg)}
.nv-menu-btn[aria-expanded="true"] i b:last-child{transform:translateY(-3.5px) rotate(-45deg)}
#menu-mobile{padding:12px 0 32px;color:var(--nv-papier)}
#menu-mobile .nv-menu-liens a{display:flex;justify-content:space-between;align-items:baseline;min-height:64px;padding:12px 0;border-bottom:2px solid rgb(245 242 236/.3);font-family:var(--font-titre);font-weight:800;font-stretch:75%;font-size:clamp(36px,10vw,44px);line-height:1;letter-spacing:-.03em;text-decoration:none}
#menu-mobile .nv-menu-liens a span{font-size:24px;color:var(--nv-orange)}
#menu-mobile .nv-menu-bas{display:flex;flex-wrap:wrap;gap:12px 20px;margin-top:24px;align-items:center}
@media (min-width:1024px){.nv-nav{display:flex}.nv-tete .nv-btn-s{display:inline-flex}.nv-carre,.nv-menu-btn,#menu-mobile{display:none!important}}

/* Héro */
.nv-hero{position:relative;color:var(--nv-papier)}
.nv-hero{position:relative;overflow:hidden}
.nv-hero .nv-c{position:relative;z-index:1;min-height:780px;display:flex;flex-direction:column;justify-content:flex-end;padding-block:40px 80px;box-sizing:border-box}
@media (min-width:1024px){
  .nv-hero .nv-c{min-height:760px;padding-block:56px 72px}
}
.nv-hero-grille{position:absolute;inset:0 var(--nv-marge);background-image:repeating-linear-gradient(to right,rgb(245 242 236/.07) 0 1px,transparent 1px max(88px,calc(100% / 12)));pointer-events:none}
.nv-hero canvas{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.nv-hero [data-paint-safe]{max-width:min(100%,760px)}
.nv-barre{position:relative;display:block;width:fit-content;margin:0 0 clamp(10px,1.2vw,18px);font-family:var(--font-titre);font-weight:800;font-stretch:75%;font-size:clamp(30px,3.2vw,46px);line-height:1;letter-spacing:-.03em;color:var(--nv-brume-clair);text-transform:none}
.nv-barre > svg{position:absolute;left:-2%;top:49%;width:104%;height:.2em;fill:var(--nv-orange);transform-origin:0 50%;transition:transform .5s var(--nv-ease) .35s}
.nv-js .nv-barre.nv-att > svg{transform:scaleX(0)}
.nv-actions{display:flex;flex-wrap:wrap;align-items:center;gap:14px 28px;margin-top:clamp(28px,2.8vw,40px)}

/* Listes numérotées à filets */
.nv-liste{list-style:none;margin-inline:0;margin-bottom:0;padding:0;border-bottom:2px solid currentColor}
.nv-liste > li{padding:24px 0 26px;border-top:2px solid currentColor}
/* À partir de 880 px la ligne se lit en deux temps : le nom de la pièce à
   gauche, ce qu'elle fait à droite. Le filet occupe toute la largeur, donc
   le texte doit l'occuper aussi, sans pour autant dépasser une longueur de
   ligne lisible. */
@media (min-width:880px){
  .nv-liste > li{display:grid;grid-template-columns:280px minmax(0,1fr);gap:0 48px;align-items:start;padding:26px 0 28}
  .nv-liste > li > h3{margin-bottom:0}
  .nv-liste p{max-width:52ch}
}
.nv-liste .nv-n{font-family:var(--font-titre);font-weight:800;font-stretch:75%;font-size:clamp(32px,3vw,44px);line-height:1;color:var(--nv-al)}
.nv-liste h3{margin:0 0 6px;font-weight:800;font-size:clamp(22px,2vw,28px);line-height:1.15;letter-spacing:-.015em}
.nv-liste p{margin:0;max-width:52ch;color:var(--nv-ardoise);font-size:17px;line-height:1.55}

/* Cases à filets (services, tarifs) */
.nv-cases{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));border-top:2px solid currentColor}
@media (min-width:760px){.nv-cases{grid-template-columns:repeat(2,1fr)}.nv-cases > li:nth-child(5):last-child{grid-column:1/-1}}
@media (min-width:1180px){.nv-cases{grid-template-columns:repeat(4,1fr)}}
.nv-cases > li > a:focus-visible{background:var(--nv-nuit-2)}
.nv-cases > li > a:hover h3,.nv-cases > li > a:focus-visible h3{text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:5px}
.nv-cases > li,.nv-cases > article{position:relative;border-bottom:2px solid currentColor;display:flex;flex-direction:column}
.nv-cases > li > a{display:flex;flex-direction:column;height:100%;padding:28px 28px 32px 16px;margin-left:-16px;text-decoration:none;transition:background-color .24s var(--nv-ease),transform .24s var(--nv-ease)}
.nv-cases > li > a:hover{background:var(--nv-nuit-2);transform:translateX(16px)}
.nv-cases h3{margin:0;font-weight:800;font-size:clamp(21px,1.8vw,24px);line-height:1.15;letter-spacing:-.01em}
.nv-cases p{margin:12px 0 0;font-size:16.5px;line-height:1.55;color:var(--nv-brume);max-width:40ch}
.nv-cases .nv-plus{margin-top:auto;padding-top:22px;font-family:var(--font-mono);font-weight:500;font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--nv-ad)}

/* Emplacements à fournir */
.nv-fournir{border:2px dashed var(--nv-ardoise);color:var(--nv-ardoise);padding:clamp(24px,2.4vw,36px);display:flex;flex-direction:column;justify-content:space-between;gap:20px;min-height:260px}
.nv-fournir .mono{font-size:12px}
.nv-trois{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:clamp(16px,2vw,28px);list-style:none;margin-inline:0;margin-bottom:0;padding:0}

/* Méthode */
.nv-trait{display:block;width:100%;height:22px;overflow:visible;fill:var(--nv-ad)}
.nv-etapes{list-style:none;margin-inline:0;margin-bottom:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr));gap:0 clamp(24px,2.4vw,40px)}
.nv-etapes > li{padding:24px 0 28px}
.nv-etapes .nv-n{display:block;font-family:var(--font-titre);font-weight:800;font-stretch:75%;font-size:56px;line-height:1;color:var(--nv-ad);transform-origin:0 100%;transition:transform .26s var(--nv-ease)}

.nv-etapes h3{margin:14px 0 8px;font-weight:800;font-size:24px;line-height:1.15}
.nv-etapes p{margin:0;font-size:17px;line-height:1.55;color:var(--nv-ardoise);max-width:30ch}
/* Sur fond sombre, c'est la brume claire qui reprend la main. */
.nv-nuit .nv-etapes p,.sur-nuit .nv-etapes p{color:var(--nv-brume-clair,#bcc6d0)}

/* Avis */
.nv-note{display:flex;flex-wrap:wrap;align-items:flex-end;gap:12px 32px;margin-top:clamp(40px,4.4vw,72px);padding-bottom:28px;border-bottom:2px solid var(--nv-nuit)}
.nv-note .nv-chiffre{margin:0;font-size:clamp(88px,11vw,168px);line-height:.8;letter-spacing:-.04em}
.nv-etoiles{margin:0;font-size:26px;letter-spacing:.08em;color:var(--nv-orange-fonce)}
.nv-mur{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:clamp(16px,2vw,28px);margin:clamp(28px,3vw,44px) 0 0;padding:0;list-style:none}
.nv-mur > li{display:flex;flex-direction:column;gap:20px;padding:clamp(24px,2.4vw,36px);border:2px solid var(--nv-nuit);background:var(--nv-papier);transition:transform .26s var(--nv-ease),box-shadow .26s var(--nv-ease)}
.nv-mur > li:nth-child(1){grid-column:span 2}
@media (min-width:1180px){
  .nv-mur{grid-template-columns:repeat(6,1fr)}
  .nv-mur > li:nth-child(1),.nv-mur > li:nth-child(2){grid-column:span 3}
  .nv-mur > li:nth-child(3),.nv-mur > li:nth-child(4),.nv-mur > li:nth-child(5){grid-column:span 2}
}
@media (max-width:700px){.nv-mur > li:nth-child(1){grid-column:auto}}
.nv-mur blockquote{margin:0;font-weight:800;font-size:clamp(19px,1.5vw,22px);line-height:1.3;letter-spacing:-.012em}
.nv-mur > li:nth-child(1) blockquote{font-size:clamp(24px,2.2vw,32px);line-height:1.2}
.nv-mur mark{background:none;color:inherit;background-image:linear-gradient(transparent 58%,rgb(233 168 58/.7) 58%,rgb(233 168 58/.7) 92%,transparent 92%);padding:0 .08em}
.nv-mur figcaption,.nv-mur .nv-auteur{margin-top:auto;padding-top:14px;border-top:2px solid var(--nv-nuit);display:flex;flex-wrap:wrap;gap:4px 14px;font-family:var(--font-mono);font-weight:500;font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--nv-ardoise)}
.nv-mur .nv-auteur b{color:var(--nv-nuit);font-weight:500}

/* Bandeau d'appel orange */
.nv-appel{background:var(--nv-orange);color:var(--nv-nuit)}
.nv-rangs{flex:1 1 380px;max-width:760px;border-bottom:2px solid var(--nv-nuit);list-style:none;margin:0;padding:0}
.nv-rangs a{display:grid;grid-template-columns:minmax(0,150px) minmax(0,1fr);align-items:baseline;gap:4px 16px;padding:18px 12px 18px 12px;margin-left:-12px;border-top:2px solid var(--nv-nuit);text-decoration:none;transition:background-color .22s var(--nv-ease),transform .22s var(--nv-ease)}
.nv-rangs a:hover{background:var(--nv-ocre);transform:translateX(12px)}
.nv-rangs .mono{font-size:12px}
.nv-rangs b{font-weight:800;font-size:clamp(20px,2.2vw,32px);letter-spacing:-.02em;overflow-wrap:anywhere}

/* Pied */
.nv-pied{border-top:2px solid var(--nv-papier)}
.nv-pied a{text-decoration:none;background-image:linear-gradient(var(--nv-orange),var(--nv-orange));background-size:0 2px;background-repeat:no-repeat;background-position:0 100%;transition:background-size .26s var(--nv-ease)}
.nv-pied a:hover{background-size:100% 2px}
.nv-pied .mono{color:var(--nv-brume)}

/* Pages intérieures : même héro, plus court */
.nv-hero-page .nv-c{min-height:560px;padding-block:40px 80px}
@media (min-width:1024px){.nv-hero-page .nv-c{min-height:520px;padding-block:48px 64px}}
.nv-hero-court .nv-c{min-height:clamp(260px,22vw,360px)}
.nv-hero .nv-lead{color:var(--nv-papier)}
.nv-hero nav[aria-label] a{color:var(--nv-brume)}
/* Contenus existants habillés : filets de 2 px, aplats peints */
main .gap-px.bg-nuit\/15,main .gap-px.border-nuit\/15{gap:2px;background-color:var(--nv-nuit);border-width:2px;border-color:var(--nv-nuit)}
main .gap-px.bg-papier\/20{gap:2px;background-color:rgb(245 242 236/.55)}
main .border.border-nuit\/15{border-width:2px;border-color:var(--nv-nuit)}
main .border-t.border-nuit\/12{border-top-width:2px;border-color:rgb(14 28 43/.35)}
main h2.titre:not(.nv-h2){letter-spacing:-.025em}
main a.bg-orange,main a.bg-nuit,main button.bg-orange,main button.bg-nuit{position:relative;isolation:isolate;background:none!important;color:var(--nv-nuit);font-weight:800;padding-inline:28px 40px;transition:color .22s var(--nv-ease)}
main a.bg-nuit,main button.bg-nuit{color:var(--nv-papier)}
main a.bg-orange::before,main a.bg-nuit::before,main button.bg-orange::before,main button.bg-nuit::before{content:"";position:absolute;inset:-2px -4px;z-index:-1;background:var(--nv-orange);-webkit-mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%20400%20100'%20preserveAspectRatio%3D'none'%3E%3Cpath%20d%3D'M14%2030C40%2018%2088%2020%20130%2016C190%2011%20250%2014%20300%2010C338%207%20372%209%20392%2018C399%2024%20394%2034%20397%2044C400%2058%20392%2068%20395%2080C370%2090%20330%2086%20290%2090C230%2095%20170%2090%20120%2093C80%2095%2044%2097%2016%2088C6%2080%2010%2070%206%2060C2%2048%209%2040%2014%2030Z'%2F%3E%3C%2Fsvg%3E") 0 0/100% 100%;mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%20400%20100'%20preserveAspectRatio%3D'none'%3E%3Cpath%20d%3D'M14%2030C40%2018%2088%2020%20130%2016C190%2011%20250%2014%20300%2010C338%207%20372%209%20392%2018C399%2024%20394%2034%20397%2044C400%2058%20392%2068%20395%2080C370%2090%20330%2086%20290%2090C230%2095%20170%2090%20120%2093C80%2095%2044%2097%2016%2088C6%2080%2010%2070%206%2060C2%2048%209%2040%2014%2030Z'%2F%3E%3C%2Fsvg%3E") 0 0/100% 100%;transition:transform .26s var(--nv-ease),background-color .22s}
main a.bg-nuit::before,main button.bg-nuit::before{background:var(--nv-nuit)}
main a.bg-orange:hover::before,main button.bg-orange:hover::before{background:var(--nv-ocre);transform:scale(1.03,1.08) rotate(-.6deg)}
main a.bg-nuit:hover::before,main button.bg-nuit:hover::before{background:var(--nv-bleu-profond);transform:scale(1.03,1.08) rotate(-.6deg)}
main .border-papier\/35{border:0;text-decoration:underline;text-decoration-color:var(--nv-orange);text-decoration-thickness:2px;text-underline-offset:6px}
main details summary{transition:transform .22s var(--nv-ease)}
main details:hover > summary{transform:translateX(4px)}
main .lien-souligne{text-decoration:underline;text-decoration-color:var(--nv-orange);text-decoration-thickness:2px;text-underline-offset:6px}
main .lien-souligne:hover{text-underline-offset:9px}
main input:not([type=radio]):not([type=checkbox]),main select,main textarea{border:2px solid var(--nv-nuit);border-radius:0}

/* Tarifs : la sélection */
.nv-formules{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));border-top:2px solid var(--nv-nuit);list-style:none;margin:0;padding:0}
.nv-formule{position:relative;display:flex;flex-direction:column;padding:28px clamp(16px,2vw,32px) 32px;border-bottom:2px solid var(--nv-nuit);cursor:pointer;transition:background-color .24s var(--nv-ease)}
.nv-formules > li + li > .nv-formule{border-left:2px solid var(--nv-nuit)}
@media (max-width:700px){.nv-formules > li + li > .nv-formule{border-left:0}}
.nv-formule input{position:absolute;opacity:0;pointer-events:none}
.nv-formule:hover{background:rgb(233 168 58/.14)}
.nv-formule:has(input:checked){background:var(--nv-nuit);color:var(--nv-papier)}
.nv-formule:has(input:checked) .text-ardoise{color:var(--nv-brume)}
.nv-formule:has(input:checked) .mono{color:var(--nv-orange)}
.nv-formule:has(input:focus-visible){outline:3px solid var(--nv-orange);outline-offset:-3px}
.nv-coche{position:absolute;top:24px;right:clamp(16px,2vw,32px);width:28px;height:28px;border:2px solid currentColor;border-radius:50%;display:grid;place-items:center}
.nv-coche::after{content:"";width:12px;height:12px;border-radius:50%;background:var(--nv-orange);transform:scale(0);transition:transform .22s var(--nv-ease)}
.nv-formule:has(input:checked) .nv-coche::after{transform:scale(1)}
.nv-formule .nv-prix-f{margin:14px 0 0;font-family:var(--font-titre);font-weight:800;font-stretch:75%;font-size:clamp(56px,6.4vw,92px);line-height:.9;letter-spacing:-.03em;transform-origin:0 80%;transition:transform .26s var(--nv-ease)}
.nv-formule:hover .nv-prix-f{transform:scale(1.03)}
.nv-bilan{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr));gap:0 clamp(24px,2.4vw,40px);margin-top:28px;padding:24px clamp(16px,2vw,32px);background:var(--nv-nuit);color:var(--nv-papier);align-items:end}
.nv-bilan dt{font-family:var(--font-mono);font-weight:500;font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--nv-brume)}
.nv-bilan dd{margin:6px 0 0;font-family:var(--font-titre);font-weight:800;font-stretch:75%;font-size:clamp(34px,3.4vw,48px);line-height:1;color:var(--nv-orange)}
.nv-bilan-paires{display:contents}
.nv-bilan dt,.nv-bilan dd{margin-inline:0}
.nv-bilan .nv-btn{justify-self:start}
.nv-abo{display:flex;align-items:center;gap:14px;cursor:pointer}
.nv-abo input{width:24px;height:24px;accent-color:var(--nv-orange)}

/* Méthode : pastilles numérotées */
.nv-pastilles{position:sticky;top:0;z-index:4;display:flex;flex-wrap:wrap;gap:10px;padding:14px 0;background:var(--nv-lt);border-bottom:2px solid var(--nv-nuit)}
.nv-pastilles a{display:inline-flex;align-items:center;justify-content:center;width:48px;height:48px;border:2px solid var(--nv-nuit);border-radius:50%;font-family:var(--font-titre);font-weight:800;font-stretch:75%;font-size:22px;text-decoration:none;transition:transform .22s var(--nv-ease),background-color .22s,color .22s}
.nv-pastilles a:hover{transform:scale(1.08)}
.nv-pastilles a[aria-current="step"]{background:var(--nv-orange);border-color:var(--nv-orange);color:var(--nv-nuit)}
.nv-etape{scroll-margin-top:96px}

/* Mouvement (états masqués posés par le script uniquement) */
.nv-mot{display:inline-block;transition:opacity .34s var(--nv-ease),transform .34s var(--nv-ease)}
.nv-js .nv-mot.nv-att{opacity:0;transform:translateY(.3em) rotate(2deg)}
.nv-js .nv-rv{transition:opacity .32s var(--nv-ease),transform .32s var(--nv-ease)}
.nv-js .nv-rv.nv-att{opacity:0;transform:translateY(16px)}
.nv-cpt{display:inline-flex;align-items:flex-end}.nv-d{display:inline-block;height:1em;overflow:hidden;line-height:1}.nv-d>span{display:block;transition:transform .55s var(--nv-ease)}.nv-d>span>span{display:block;height:1em}
.nv-bord{position:absolute;top:100%;margin-top:-1px;z-index:2;pointer-events:none;overflow:visible}
.nv-bord .nv-g{transform-box:fill-box;transform-origin:50% 0;transition:transform .6s var(--nv-ease)}
.nv-js .nv-bord.nv-att .nv-g{transform:scaleY(0)}
main > *,body > footer,body > section,body > div{position:relative}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important}
  .nv-js .nv-att,.nv-js .nv-att > svg,.nv-js .nv-att .nv-g{opacity:1!important;transform:none!important}
  .nv-liste > li:hover,.nv-mur > li:hover,.nv-pastilles a:hover,.nv-formule:hover .nv-prix-f,main a:hover::before,main details:hover > summary,.nv-etapes > li:hover .nv-n,.nv-btn:hover > svg,a:hover .nv-fleche{transform:none!important}
}

/* Alignement des hauts de page : le conteneur garde la largeur de la grille
   (donc le titre démarre sous le logo) ; seule la ligne de texte est limitée.
   Sans cela, le conteneur rétréci se recentrait et décalait le titre. */
.nv-hero .nv-c[data-paint-safe]{max-width:1440px}
.nv-hero .nv-c[data-paint-safe] > *{max-width:min(100%,760px)}

/* Cibles tactiles du pied : au doigt, les liens du pied faisaient 16 px de
   haut. Sur mobile ils passent à 44 px en hauteur utile, sans toucher au
   rythme visuel : l'espacement entre éléments passe dans le lien lui-même.
   Au-dessus de 768 px, pointeur fin, on garde la compacité d'origine. */
@media (max-width:767px){
  .nv-pied ul{gap:0}
  .nv-pied li > a{display:flex;align-items:center;min-height:44px}
}

/* Cibles tactiles au doigt, sur mobile uniquement. Au-dessus de 768 px le
   pointeur est fin et la compacité d'origine est conservée. Les liens
   inclus dans une phrase ne sont pas concernés : les agrandir casserait le
   texte, et la règle les exempte. */
@media (max-width:767px){
  /* Appels à l'action autonomes : « Voir la réalisation », « Voir le site » */
  main a.lien-souligne{display:inline-flex;align-items:center;min-height:44px}
  /* Téléphone, e-mail et WhatsApp de la page contact : c'est par là que
     passent les demandes, c'est la dernière chose qui doit être difficile
     à toucher. */
  main li.bg-papier > a[href^="tel:"],
  main li.bg-papier > a[href^="mailto:"],
  main li.bg-papier > a[href*="wa.me"]{display:flex;align-items:center;min-height:44px}
  /* Liste des communes : seize liens côte à côte, et c'est le chemin que
     prend un visiteur qui cherche sa ville. */
  ul.mono.flex-wrap > li > a{display:inline-flex;align-items:center;min-height:44px}
  ul.mono.flex-wrap{row-gap:0}
}

/* Sélecteur de langue : il faisait 20 px de large au doigt. C'est le
   premier geste d'un visiteur néerlandophone sur une page française, donc
   le dernier endroit où rater la cible. Élargi sur mobile, inchangé au
   pointeur fin. */
@media (max-width:767px){
  .nv-langues a{min-width:44px;justify-content:center}
}
@media (max-width:359px){
  .nv-langues a{min-width:34px}
}

/* Le bouton d'appel de l'en-tête était comprimé à 20 px de large sur un
   écran de 320 px : la barre manquait de place et c'est lui qui cédait.
   Sur un site qui promet un téléphone qui sonne, c'est le dernier élément
   qui doit rétrécir. */
.nv-carre{flex:0 0 auto}

@media (max-width:767px){
  /* Case de l'abonnement et liens autonomes des pages longues. */
  label.nv-abo{min-height:44px;display:flex;align-items:center;gap:12px}
  .intl-preuves a,.nv-preuves a{display:inline-flex;align-items:center;min-height:44px}
}

/* Le logo ne se laisse plus comprimer non plus : à 320 px il tombait à
   12 px de large. Sous 400 px, les trois langues quittent la barre du haut
   pour le menu, et les trois éléments qui restent tiennent sans se serrer. */
.nv-logo{flex:0 0 auto}
@media (max-width:399px){ .nv-tete .nv-langues{display:none} }
.nv-menu-langues{display:flex;flex-wrap:wrap;gap:8px 10px;margin-top:22px;padding-top:20px;border-top:2px solid currentColor}
.nv-menu-langues a{display:inline-flex;align-items:center;min-height:44px;padding-inline:14px;font-family:var(--font-mono);font-weight:500;font-size:13px;letter-spacing:.06em;text-decoration:none;color:var(--nv-brume);border:2px solid currentColor}
/* Nuit sur orange, comme partout ailleurs sur le site : crème sur orange
   tombe à 2,4 pour 1, très en dessous du seuil. */
.nv-menu-langues a[aria-current="true"]{color:var(--nv-nuit);background:var(--nv-lead);border-color:var(--nv-lead)}

/* Puce de liste : un carré plein de 7 px, repris du point qui termine
   « qui sonne. » dans le héros. Un tiret cadratin n'est pas une puce, c'est
   un signe de ponctuation emprunté à autre chose. */
.nv-puce{flex:0 0 auto;width:7px;height:7px;margin-top:.62em;background:var(--nv-lead)}
.nv-puce-fonce{background:var(--nv-lead-fonce)}

/* Le mouvement au survol ne concerne qu'un pointeur fin. Au doigt, :hover
   reste accroché après la touche et laisse une carte dans un état survolé
   qu'on a déjà quittée. La couleur, elle, peut rester : c'est un retour,
   pas un déplacement. */
@media not all and (hover: hover) and (pointer: fine){
  .nv-cases > li > a:hover{transform:none}
  .nv-carre:hover{transform:none}
  .nv-btn:hover > svg{transform:none}
  .nv-rangs a:hover{transform:none}
}

/* Retour au clic. Aucun élément pressable n'en avait : sur un téléphone,
   un bouton qui ne bouge pas sous le doigt laisse croire que la touche
   n'est pas passée. 0,97 et 140 ms, assez pour être senti, trop peu pour
   être vu. */
.nv-btn:active,.nv-btn-s:active,.nv-carre:active,.nv-menu-btn:active{transform:scale(.97)}
.nv-btn,.nv-btn-s,.nv-carre,.nv-menu-btn{transition:transform 140ms var(--nv-ease)}
@media (prefers-reduced-motion:reduce){
  .nv-btn:active,.nv-btn-s:active,.nv-carre:active,.nv-menu-btn:active{transform:none}
}

/* ================= En-tête à partir de 1024 px ================= */
@media (min-width:1024px){
  .nv-tete{min-height:76px;gap:28px}
  .nv-tete .nv-logo img{height:52px}
  .nv-tel-barre{display:inline-flex;align-items:center;min-height:48px;padding:0 20px;
    background:var(--nv-orange);color:var(--nv-nuit);
    font-family:var(--font-titre);font-weight:800;font-stretch:75%;font-size:22px;
    letter-spacing:-.02em;text-decoration:none;white-space:nowrap}
}

/* ================= Barre d'appel fixe, mobile ================= */
/* Le numéro reste sous le pouce à toute hauteur de page. Au-dessus de
   1024 px l'en-tête le porte déjà, la barre disparaît. */
.nv-barre-appel{position:fixed;left:0;right:0;bottom:0;z-index:40;
  display:flex;align-items:center;justify-content:space-between;
  min-height:56px;padding:0 20px;padding-bottom:env(safe-area-inset-bottom,0);
  background:var(--nv-orange);color:var(--nv-nuit);
  border-top:2px solid var(--nv-nuit);text-decoration:none}
.nv-barre-appel-num{font-family:var(--font-titre);font-weight:800;font-stretch:75%;
  font-size:24px;letter-spacing:-.02em;line-height:1;white-space:nowrap}
.nv-barre-appel-mot{font-family:var(--font-mono);font-weight:500;font-size:12px;
  letter-spacing:.06em;text-transform:uppercase}
.nv-barre-appel:active{transform:none}
body{padding-bottom:calc(56px + env(safe-area-inset-bottom,0px))}
@media (min-width:1024px){
  .nv-barre-appel{display:none}
  body{padding-bottom:0}
}

/* ================= Éclaboussure ================= */
/* Posée à la compilation, donc visible sans script. Le script ne fait que
   l'animer : 900 ms à l'arrivée, puis plus rien de la page ne bouge. */
.nv-eclab{position:absolute;pointer-events:none;z-index:0}
.nv-eclab-s{right:-30px;top:-10px;width:300px;height:324px}
.nv-eclab-s.nv-eclab-page{right:-40px;top:-20px;width:260px;height:200px}
.nv-eclab-l{display:none}
@media (min-width:1024px){
  .nv-eclab-s{display:none}
  .nv-eclab-l{display:block;right:-20px;top:-30px;width:760px;height:650px}
  .nv-eclab-l.nv-eclab-page{right:-20px;top:-40px;width:720px;height:410px}
}
.nv-eclab .ec-t,.nv-eclab .ec-p,.nv-eclab .ec-c{transform-box:fill-box;transform-origin:center}
.nv-eclab .ec-c{transform-origin:top}

/* Le seul mouvement du site. Il ne se déclenche que si le script a pu
   ajouter .nv-js, donc jamais sans JavaScript ni sous mouvement réduit. */
.nv-js .nv-eclab .ec-t{animation:ec-pose 220ms var(--nv-ease) both}
.nv-js .nv-eclab .ec-p{animation:ec-pose 180ms var(--nv-ease) both;animation-delay:var(--ec-d,80ms)}
.nv-js .nv-eclab .ec-c{animation:ec-coule 500ms var(--nv-ease) 200ms both}
@keyframes ec-pose{from{transform:scale(0)}to{transform:scale(1)}}
@keyframes ec-coule{from{transform:scaleY(0)}to{transform:scaleY(1)}}
@media (prefers-reduced-motion:reduce){
  .nv-js .nv-eclab .ec-t,.nv-js .nv-eclab .ec-p,.nv-js .nv-eclab .ec-c{animation:none}
}

/* La coulure déborde sur la section suivante ; elle n'intercepte rien. */
.nv-coulure{position:absolute;top:-1px;z-index:2;pointer-events:none}

/* ================= Bouton d'appel peint ================= */
/* Le numéro posé sur une trace de pinceau. Sur un site qui promet un
   téléphone qui sonne, c'est le plus gros élément cliquable de l'écran. */
.nv-tel-peint{position:relative;isolation:isolate;display:flex;align-items:center;
  justify-content:space-between;gap:16px;min-height:72px;padding:0 22px;
  margin-top:32px;width:100%;color:var(--nv-nuit);text-decoration:none}
.nv-tel-trace{position:absolute;inset:-3px -5px;z-index:-1;width:calc(100% + 10px);height:calc(100% + 6px);
  fill:var(--nv-orange);transition:transform .24s var(--nv-ease)}
.nv-tel-coulure{position:absolute;left:48px;top:calc(100% - 4px);width:10px;height:30px;
  z-index:-1;fill:var(--nv-orange)}
.nv-tel-num{font-family:var(--font-titre);font-weight:800;font-stretch:75%;
  font-size:var(--nv-t-numero);letter-spacing:-.02em;line-height:1;white-space:nowrap}
.nv-tel-mot{font-family:var(--font-mono);font-weight:500;font-size:13px;
  letter-spacing:.06em;text-transform:uppercase}
.nv-tel-peint:active{transform:scale(.97)}
.nv-tel-peint{transition:transform 140ms var(--nv-ease)}
@media (min-width:1024px){
  .nv-tel-peint{display:inline-flex;width:auto;min-height:84px;padding:0 36px 0 28px;gap:20px}
  .nv-tel-coulure{left:60px;width:11px;height:34px}
}
@media (hover:hover) and (pointer:fine){
  .nv-tel-peint:hover .nv-tel-trace{transform:scale(1.03,1.08) rotate(-.6deg)}
}
@media not all and (hover:hover) and (pointer:fine){
  .nv-tel-peint:active{transform:none}
}
/* Le script anime la trace à l'arrivée ; sans lui elle est déjà là. */
.nv-js .nv-tel-trace{transform-box:fill-box;transform-origin:left center;
  animation:ec-trace 400ms var(--nv-ease) 450ms both}
@keyframes ec-trace{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@media (prefers-reduced-motion:reduce){.nv-js .nv-tel-trace{animation:none}}

/* Les liens du héros passent sous le bouton, en ligne. */
.nv-hero .nv-actions{display:flex;flex-wrap:wrap;align-items:center;gap:24px 28px;margin-top:0}
.nv-hero .nv-actions > .nv-tel-peint{flex:1 1 100%}
@media (min-width:1024px){.nv-hero .nv-actions > .nv-tel-peint{flex:0 0 auto}}
.nv-hero .nv-lead{margin-top:var(--nv-e4)}

/* ================= Clou de liste ================= */
/* Un carré de 6 px au départ de chaque filet : la toile est tendue sur
   châssis, et le filet porte son clou. */
.nv-liste > li{position:relative}
.nv-liste > li::before{content:"";position:absolute;left:0;top:-4px;width:6px;height:6px;background:currentColor}
.nv-liste-suite{margin:32px 0 0}

/* ================= Un chantier, raconté ================= */
/* La preuve se montre : l'image occupe la pleine largeur sur mobile et
   plus de la moitié de l'écran à 1440. Aucun survol, aucun filtre. */
.nv-chantier{position:relative;display:grid}
.nv-chantier-img{position:relative;aspect-ratio:390/260;overflow:hidden}
.nv-chantier-img img{width:100%;height:100%;object-fit:cover;object-position:left top;display:block}
.nv-chantier-txt{padding:40px var(--nv-marge) 0}
.nv-chantier-nom{margin:24px 0 0;font-family:var(--font-titre);font-weight:800;font-size:22px;line-height:1.15}
.nv-chantier-sec{margin:4px 0 0;font-size:17px;color:var(--nv-brume)}
.nv-chantier-p{margin:16px 0 0;max-width:44ch;font-size:17px;line-height:1.55;color:var(--nv-brume-clair)}
.nv-chantier-lien{margin:24px 0 0}
@media (min-width:1024px){
  .nv-chantier{grid-template-columns:repeat(12,1fr);align-items:stretch}
  .nv-chantier-img{grid-column:1/8;aspect-ratio:auto;min-height:640px}
  .nv-chantier-txt{grid-column:8/13;align-self:center;padding:var(--nv-pad-section) var(--nv-marge) var(--nv-pad-section) 48px}
  .nv-chantier-nom{font-size:28px}
}

/* ================= Quatre étapes ================= */
.nv-etapes > li{display:grid;grid-template-columns:56px minmax(0,1fr);gap:0 16px;align-items:start}
/* Le titre ET le texte tiennent la colonne de droite. Sans ce placement, le
   paragraphe n'a pas de position assignée : il retombe à la ligne suivante
   dans la colonne du chiffre, large de 56 px, et se casse à deux mots par
   ligne. Le défaut n'apparaît que sous 1024 px, là où cette grille existe. */
.nv-etapes > li > h3,
.nv-etapes > li > p{grid-column:2}
.nv-etapes .nv-n{font-family:var(--font-titre);font-weight:800;font-stretch:75%;font-size:56px;line-height:1;color:var(--nv-lead-fonce)}
@media (min-width:1024px){
  .nv-etapes{display:grid;grid-template-columns:repeat(4,1fr);gap:40px}
  .nv-etapes > li{display:block}
  .nv-etapes .nv-n{display:block;font-size:88px}
  .nv-etapes h3{margin:14px 0 8px;font-size:var(--nv-t-h3)}
  .nv-etapes p{max-width:30ch}
}

/* ================= Avis ================= */
/* La note devient la deuxième chose qu'on voit de la section : cinq sur
   cinq avec cinquante avis, ça se montre. */
.nv-avis .nv-chiffre{font-family:var(--font-titre);font-weight:800;font-stretch:75%;
  font-size:var(--nv-t-note);line-height:.82;letter-spacing:-.035em;color:var(--nv-ocre);margin:0}
.nv-avis .nv-etoiles{font-size:22px;color:var(--nv-ocre);letter-spacing:.08em;margin:0}
.nv-avis .nv-note{display:flex;align-items:flex-end;gap:20px;flex-wrap:wrap;
  margin-top:var(--nv-e4);padding-bottom:var(--nv-e3);border-bottom:2px solid var(--nv-papier)}
.nv-avis .nv-mur > li{border-color:var(--nv-papier);background:transparent}
.nv-avis .nv-mur blockquote{color:var(--nv-papier)}
.nv-avis .nv-mur figcaption,.nv-avis .nv-mur .nv-auteur{border-top-color:var(--nv-papier);color:var(--nv-brume)}
.nv-avis .nv-mur .nv-auteur b{color:var(--nv-papier)}
@media (min-width:1024px){ .nv-avis .nv-etoiles{font-size:26px} }

/* ================= Bandeau Parlons-en ================= */
.nv-appel .nv-h2-xl{font-size:var(--nv-t-affiche-xl)}

/* ================= Pied de page ================= */
footer.nv-pied{border-top:2px solid var(--nv-papier)}
.nv-pied-haut{display:grid;gap:40px;padding:48px 0 24px}
.nv-pied-logo{height:44px;width:auto}
.nv-pied-phrase{margin:20px 0 0;max-width:34ch;font-size:15px;line-height:1.6;color:var(--nv-brume-clair)}
.nv-pied-nav{padding-top:24px;border-top:2px solid var(--nv-papier)}
.nv-pied-nav ul{display:grid;grid-template-columns:1fr 1fr;gap:0 24px;margin:0;padding:0;list-style:none}
.nv-pied-nav a,.nv-pied-contact a{display:flex;align-items:center;min-height:44px;
  font-size:15px;font-weight:600;color:var(--nv-papier);text-decoration:none}
.nv-pied-nav a:hover,.nv-pied-contact a:hover{text-decoration:underline;text-decoration-color:var(--nv-orange);text-decoration-thickness:2px;text-underline-offset:6px}
.nv-pied-contact{margin:0;padding:0;list-style:none}
.nv-pied-legal{display:flex;flex-wrap:wrap;gap:8px 40px;padding:20px 0 48px;
  border-top:2px solid var(--nv-papier);color:var(--nv-brume)}
.nv-pied-legal p{margin:0;font-size:12px}
@media (min-width:1024px){
  .nv-pied-haut{grid-template-columns:repeat(12,1fr);gap:0 24px;padding:72px 0 32px;align-items:start}
  .nv-pied-marque{grid-column:1/5}
  .nv-pied-logo{height:52px}
  .nv-pied-nav{grid-column:7/11;padding-top:0;border-top:0}
  .nv-pied-nav a,.nv-pied-contact a{min-height:36px}
  .nv-pied-contact{grid-column:11/13}
  .nv-pied-legal{padding:20px 0 56px}
}

/* ================= Champs de formulaire ================= */
/* Hauteur 56 px : au doigt, un champ trop court se rate. Bordure pleine de
   2 px, angles droits, fond transparent, comme le reste du site. */
main input:not([type=radio]):not([type=checkbox]):not([type=hidden]),
main select{min-height:56px;padding:0 14px;font-size:17px;background:transparent}
main textarea{padding:12px 14px;font-size:17px;background:transparent;min-height:140px}
main input:focus,main textarea:focus,main select:focus{outline:3px solid var(--nv-orange);outline-offset:2px}
main label > span:first-child,main .nv-etiquette{font-size:16px;font-weight:600}

/* Case à cocher carrée, dessinée : celle du navigateur ne suit aucune charte. */
main input[type=checkbox]{appearance:none;flex:0 0 auto;width:24px;height:24px;
  border:2px solid currentColor;background:transparent;cursor:pointer;display:inline-grid;place-content:center}
main input[type=checkbox]::before{content:"";width:12px;height:12px;background:var(--nv-orange);
  transform:scale(0);transition:transform 120ms var(--nv-ease)}
main input[type=checkbox]:checked::before{transform:scale(1)}

/* ================= Tarifs ================= */
.nv-formule .nv-coche{flex:0 0 auto;width:28px;height:28px;border:2px solid currentColor;
  display:inline-grid;place-content:center}
.nv-formule .nv-coche::before{content:"";display:block;flex:0 0 auto;
  width:12px;height:12px;min-width:12px;min-height:12px;
  background:var(--nv-ad,#f0b54a);
  transform:scale(0);transition:transform 120ms var(--nv-ease)}
.nv-formule:has(input:checked) .nv-coche::before{transform:scale(1)}
.nv-prix-f{font-family:var(--font-titre);font-weight:800;font-stretch:75%;
  font-size:var(--nv-t-prix);line-height:.9;letter-spacing:-.035em;margin-top:14px}
.nv-bilan dd{font-size:var(--nv-t-bilan)}
@media (max-width:759px){
  .nv-formule:has(input:checked){margin-inline:calc(var(--nv-marge) * -1);padding-inline:var(--nv-marge)}
}
/* Le survol teinté disparaît : il annonçait un changement qui n'arrive qu'au clic. */
.nv-formule:hover{background:transparent}
.nv-formule:has(input:checked):hover{background:var(--nv-nuit)}

/* ================= FAQ ================= */
main details{border-top:2px solid currentColor}
main details > summary{display:flex;align-items:center;justify-content:space-between;gap:16px;
  min-height:64px;font-size:19px;font-weight:800;cursor:pointer;list-style:none}
main details > summary::-webkit-details-marker{display:none}
main details > summary::after{content:"+";font-family:var(--font-titre);font-weight:800;font-stretch:75%;
  font-size:28px;line-height:1;color:var(--nv-lead-fonce)}
/* Sur fond sombre, le signe prend l'accent clair de la page : le rouge
   foncé des fonds clairs y tombait sous le seuil. */
.nv-nuit details > summary::after,.sur-nuit details > summary::after{color:var(--nv-ad)}
main details[open] > summary::after{content:"\2212"}

/* ================= MARQUES PEINTES ET TOILE =================
   Ajout du 13/10/2026, planche 1g. Trois gestes : la trame de lin sous les
   fonds clairs, la signature de brosse sous les h2 condensés, et l'éclat
   qui vit dans la marge basse de chaque section. */

/* La toile. Une trame de 1 px tous les 5 px, à 4,5 % de nuit : on la sent,
   on ne la lit pas. Elle ne touche jamais un fond sombre, qui repeint
   par-dessus. Posée sur le fond de page, donc elle ne coûte aucun nœud. */
body.sur-papier{
  background-image:
    repeating-linear-gradient(0deg,  rgb(14 28 43/.045) 0 1px, transparent 1px 5px),
    repeating-linear-gradient(90deg, rgb(14 28 43/.045) 0 1px, transparent 1px 5px);
}
/* Les blocs clairs posés sur un fond sombre portent leur propre trame. */
.nv-lin{
  background-image:
    repeating-linear-gradient(0deg,  rgb(14 28 43/.045) 0 1px, transparent 1px 5px),
    repeating-linear-gradient(90deg, rgb(14 28 43/.045) 0 1px, transparent 1px 5px);
}

/* La signature. Sous les h2 condensés seulement : jamais sous un h3, jamais
   sous un titre de formule, qui n'est pas condensé. Taille fixe, donc aucun
   décalage quand la police arrive. */
.nv-sig{display:block;margin-top:18px;width:132px;height:12px}

/* L'éclat de section. Il tient dans le padding bas de 72 / 136 px et se
   colle au bord droit, donc il ne passe jamais sous un texte. La section
   est en overflow:hidden : rien ne déborde de la page. */
.nv-sec{position:relative;overflow:hidden}
.nv-eclat{position:absolute;right:0;bottom:-8px;width:80px;height:80px;
  pointer-events:none}

/* ================= LE MUR DES TOILES ================= */
.nv-part-tete{margin-bottom:8px}
.nv-part-intro{margin-top:20px;max-width:40ch;font-size:17px;color:var(--nv-ardoise)}
/* La cimaise : le filet sur lequel les toiles sont accrochées. */
.nv-toiles{list-style:none;margin:40px 0 0;padding:0;
  border-top:2px solid var(--nv-nuit);
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:32px 20px}
.nv-toile-i{position:relative;isolation:isolate;display:flex;flex-direction:column;
  align-items:center}
/* Le crochet, puis le fil : quatre longueurs qui tournent, pour que le mur
   ne soit pas aligné au cordeau. */
.nv-crochet{width:8px;height:8px;background:var(--nv-nuit);flex:0 0 auto}
.nv-toile-i::before{content:"";width:2px;background:var(--nv-nuit);flex:0 0 auto}
.nv-fil-0::before{height:18px}
.nv-fil-1::before{height:34px}
.nv-fil-2::before{height:26px}
.nv-fil-3::before{height:42px}
/* Le châssis : bordure de 2 px, quatre clous, une inclinaison par toile. */
.nv-toile{position:relative;display:block;width:100%;aspect-ratio:1;
  border:2px solid var(--nv-nuit);background:var(--nv-papier);padding:16px;
  box-sizing:border-box}
.nv-fil-0 .nv-toile{transform:rotate(-1.4deg)}
.nv-fil-1 .nv-toile{transform:rotate(1deg)}
.nv-fil-2 .nv-toile{transform:rotate(-.8deg)}
.nv-fil-3 .nv-toile{transform:rotate(1.2deg)}
.nv-toile-nuit{background:var(--nv-nuit)}
.nv-toile::before,.nv-toile::after{content:"";position:absolute;width:6px;height:6px;
  background:var(--nv-nuit);top:6px}
.nv-toile::before{left:6px}
.nv-toile::after{right:6px}
.nv-toile-nuit::before,.nv-toile-nuit::after{background:var(--nv-papier)}
.nv-toile img{position:absolute;inset:0;width:100%;height:100%;padding:inherit;
  box-sizing:border-box;object-fit:contain}
/* Le blanc des logos livrés sur fond blanc disparaît dans le crème. */
.nv-toile img.nv-fondu{mix-blend-mode:multiply}
.nv-toile-nuit img{mix-blend-mode:normal}
/* L'éclaboussure vit derrière la toile, jamais devant. */
.nv-toile-peinture{position:absolute;z-index:-1;right:-46px;bottom:30px;
  width:110px;height:110px;pointer-events:none}
.nv-toile-legende{align-self:flex-start;margin-top:14px;
  font-family:var(--font-mono);font-size:12px;letter-spacing:.06em;text-transform:uppercase;
  line-height:1.5}
.nv-toile-legende b{display:block;font-weight:500;color:var(--nv-nuit)}
.nv-toile-legende span{display:block;color:var(--nv-ardoise)}
/* La toile ne bouge pas au survol : seul le nom se souligne. */
.nv-toile-i:hover .nv-toile-legende b,
.nv-toile-i:focus-within .nv-toile-legende b{
  text-decoration:underline;text-decoration-color:var(--nv-orange);
  text-decoration-thickness:2px;text-underline-offset:4px}
.nv-toile:focus-visible{outline:3px solid var(--nv-orange);outline-offset:3px}

@media (min-width:1024px){
  .nv-toiles{grid-template-columns:repeat(auto-fit,minmax(0,1fr));gap:0 24px;
    align-items:start;margin-top:12px}
  .nv-toile{aspect-ratio:4/3;padding:20px}
  .nv-part-intro{max-width:34ch}
  .nv-fil-0::before{height:28px}
  .nv-fil-1::before{height:64px}
  .nv-fil-2::before{height:44px}
  .nv-fil-3::before{height:80px}
  .nv-fil-0 .nv-toile{transform:rotate(-1.2deg)}
  .nv-fil-1 .nv-toile{transform:rotate(.8deg)}
  .nv-fil-2 .nv-toile{transform:rotate(-.6deg)}
  .nv-fil-3 .nv-toile{transform:rotate(1.4deg)}
}

/* ================= ANGLES DROITS : LES OUBLIS =================
   La charte dit « angles droits partout ». Deux formes rondes restaient. */
.nv-coche,.nv-formule .nv-coche{border-radius:0}
.nv-coche::after,.nv-formule .nv-coche::before{border-radius:0}
.nv-pastilles a{border-radius:0}

/* Le prix de la formule retenue, peint. Nuit sur une trace ocre : 8,6 : 1. */
.nv-formule:has(input:checked) .nv-prix-f{position:relative;isolation:isolate;
  display:inline-block;color:var(--nv-nuit);padding-inline:24px}
.nv-formule:has(input:checked) .nv-prix-f::before{content:"";position:absolute;
  inset:-6px -20px;z-index:-1;background:var(--nv-ad,#f0b54a);
  -webkit-mask:var(--nv-brosse) center/100% 100% no-repeat;
  mask:var(--nv-brosse) center/100% 100% no-repeat}
@media (min-width:1024px){
  .nv-formule:has(input:checked) .nv-prix-f{padding-inline:36px}
  .nv-formule:has(input:checked) .nv-prix-f::before{inset:-6px -28px}
}

/* Le cadre de la réalisation : la capture tendue sur son châssis. */
.nv-chantier-img{position:relative}
.nv-chantier-img > .nv-chassis{position:absolute;inset:12px;border:2px solid var(--nv-papier);
  pointer-events:none}
.nv-chantier-img > .nv-chassis::before,.nv-chantier-img > .nv-chassis::after{content:"";
  position:absolute;width:8px;height:8px;background:var(--nv-papier);top:8px}
.nv-chantier-img > .nv-chassis::before{left:8px}
.nv-chantier-img > .nv-chassis::after{right:8px}
.nv-chantier-img > .nv-grappe{position:absolute;right:-34px;bottom:44px;width:100px;height:100px;
  pointer-events:none;z-index:2}
/* L'image occupe le bord gauche de la page : la grappe déborde donc vers
   l'intérieur, sur la colonne de texte, et non hors de l'écran. */

/* La signature du pied, sous le logo. */
.nv-pied .nv-sig{margin-top:14px}

/* Les deux clous du bas. Les pseudo-éléments de la toile tiennent ceux du
   haut ; la hauteur du châssis varie, donc ceux-ci ont leur propre élément. */
.nv-clous-bas{position:absolute;inset:0;pointer-events:none}
.nv-clous-bas::before,.nv-clous-bas::after{content:"";position:absolute;width:6px;height:6px;
  background:var(--nv-nuit);bottom:6px}
.nv-clous-bas::before{left:6px}
.nv-clous-bas::after{right:6px}
.nv-toile-nuit .nv-clous-bas::before,.nv-toile-nuit .nv-clous-bas::after{background:var(--nv-papier)}

/* ================= SERVICES : CINQ TITRES =================
   Planche 1c. Le nom du service est un h2 : plus de numéro, plus
   d'étiquette. Les ancres restent celles d'avant. */
.nv-metiers{list-style:none;margin:0;padding:0;border-top:2px solid var(--nv-nuit)}
.nv-metiers > li{position:relative;border-bottom:2px solid var(--nv-nuit);
  padding:28px 0 32px;scroll-margin-top:96px}
/* Le clou posé au départ de chaque filet. */
.nv-metiers > li::before{content:"";position:absolute;left:0;top:-4px;
  width:6px;height:6px;background:var(--nv-nuit)}
.nv-metiers > li > p{margin-top:14px;font-size:17px;line-height:1.55;color:var(--nv-ardoise);
  max-width:44ch}
@media (min-width:1024px){
  .nv-metiers{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 24px}
  .nv-metiers > li{padding:32px 24px 40px 0}
  .nv-metiers > li > h2{font-size:clamp(44px,4.4vw,64px)}
  .nv-metiers > li > p{margin-top:20px}
  /* Le cinquième tient la largeur : titre à gauche, texte à droite. */
  .nv-metier-large{grid-column:1/-1;display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));gap:0 24px;align-items:start}
  .nv-metier-large > p{margin-top:0}
}

/* Le bandeau de la page Tarifs est ocre, pas orange : la page a sa
   dominante, et l'orange reste la couleur de l'action. Nuit sur ocre : 8,6. */
.nv-appel-ocre{background:#f0b54a}

/* ================= CONTACT : CHOISIR SON CANAL =================
   Planche 1f. Les trois canaux montent dans le héros : on choisit comment
   joindre avant d'avoir fait défiler quoi que ce soit. */
.nv-canaux{list-style:none;margin:32px 0 0;padding:0;border-bottom:2px solid var(--nv-papier)}
.nv-canaux > li{border-top:2px solid var(--nv-papier)}
.nv-canaux a{display:flex;flex-direction:column;justify-content:center;gap:2px;
  min-height:72px;padding:12px 0;text-decoration:none;color:inherit}
.nv-canaux .mono{color:var(--nv-brume);font-size:12px}
.nv-canaux b{font-family:var(--font-titre);font-weight:800;font-stretch:75%;
  font-size:34px;line-height:1;letter-spacing:-.02em}
/* Le téléphone porte la dominante de la page : c'est le canal qu'on vise. */
.nv-canal-vif{color:var(--nv-ad)}
.nv-canal-mail{font-stretch:100%;font-size:19px;overflow-wrap:anywhere}
.nv-canaux a:hover b{text-decoration:underline;text-decoration-color:var(--nv-orange);
  text-decoration-thickness:2px;text-underline-offset:6px}
@media (min-width:1024px){
  /* Le héros courant est une colonne en flex ; celui du contact tient deux
     colonnes, d'où la spécificité nécessaire pour reprendre la main. */
  .nv-hero .nv-c.nv-contact-hero{display:grid;grid-template-columns:repeat(12,1fr);
    gap:0 24px;align-items:end}
  .nv-hero .nv-c.nv-contact-hero > *{max-width:none}
  .nv-contact-dit{grid-column:1/7}
  .nv-canaux{grid-column:7/13;margin-top:0}
  .nv-canaux a{display:grid;grid-template-columns:150px 1fr;align-items:center;
    gap:0 24px;min-height:88px}
  .nv-canaux b{font-size:48px}
  .nv-canal-mail{font-size:24px}
}

/* ================= LE FORMULAIRE =================
   Mêmes champs, même ordre, mêmes intitulés et mêmes name= qu'avant : seule
   la forme change. Filets de 2 px, 56 px de haut, angles droits. */
.nv-form-requis{margin:24px 0 0;color:var(--nv-ardoise)}
.nv-erreur{margin:0 0 24px;border:2px solid var(--nv-lead-fonce);
  background:rgb(242 107 42/.1);padding:12px 16px;font-size:15px}
.nv-form{margin-top:24px}
.nv-champs{display:grid;gap:20px}
.nv-champ{display:grid;gap:8px}
.nv-champ > span{font-size:16px;font-weight:600}
.nv-form input[type=text],.nv-form input[type=tel],.nv-form input[type=email]{
  height:56px;padding:0 14px;font-size:17px}
.nv-form textarea{padding:12px 14px;font-size:17px;min-height:140px}
.nv-form input,.nv-form textarea{border:2px solid var(--nv-nuit);border-radius:0;
  background:transparent;color:inherit;width:100%;min-width:0;font-family:inherit}
.nv-creneaux{margin:24px 0 0;padding:0;border:0}
.nv-creneaux legend{font-size:16px;font-weight:600;padding:0;margin-bottom:12px}
.nv-creneaux-g{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0}
.nv-creneau{display:flex;align-items:center;justify-content:center;text-align:center;
  min-height:52px;padding:8px 10px;font-size:15px;cursor:pointer;
  border:2px solid var(--nv-nuit);margin-left:-2px}
.nv-creneau:first-child{margin-left:0}
.nv-creneau:has(input:checked){background:var(--nv-nuit);color:var(--nv-papier);position:relative;z-index:1}
.nv-creneau:has(input:focus-visible){outline:3px solid var(--nv-orange);outline-offset:-3px}
.nv-consent{display:flex;align-items:flex-start;gap:12px;min-height:44px;
  margin-top:24px;padding:8px 0;font-size:15px;line-height:1.5;cursor:pointer}
.nv-consent input{flex:0 0 auto;width:24px;height:24px;margin:0;accent-color:var(--nv-nuit)}
.nv-form-reponse{margin-top:16px;color:var(--nv-ardoise)}
.nv-btn-peint{margin-top:28px;width:100%;min-height:64px}
@media (min-width:1024px){
  .nv-champs{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
  .nv-champ-large{grid-column:1/-1}
  .nv-form-sec{display:grid;grid-template-columns:repeat(12,1fr);gap:0 24px;align-items:start}
  .nv-form-sec > h2{grid-column:1/5}
  .nv-form{grid-column:5/13;margin-top:0}
  .nv-form-sec > .nv-eclat{grid-column:1/-1}
  .nv-btn-peint{width:auto;justify-self:start;padding-inline:36px}
  .nv-creneaux-g{max-width:520px}
}

/* Le bouton peint du formulaire : même trace que les autres boutons. */
.nv-btn-peint{color:var(--nv-nuit);font-family:var(--font-titre);font-weight:800;
  font-size:19px;border:0;background:none;cursor:pointer;
  justify-content:center;padding-inline:28px}
.nv-btn-peint > svg:first-child{fill:var(--nv-orange)}

/* FAQ : une seule liste, un seul signe, celui de la feuille de style. */
.nv-faq{list-style:none;margin:0;padding:0}
.nv-faq > li{border-bottom:0}
.nv-faq > li:last-child > details{border-bottom:2px solid currentColor}
.nv-faq-r{margin:0;padding:0 0 24px;max-width:60ch;font-size:16px;line-height:1.65;
  color:rgb(245 242 236/.78)}

/* ================= COMMUNE : LE PRIX AFFICHÉ =================
   Planche 1e. Sur chaque page de commune, le prix d'entrée est écrit en
   grand : c'est la question que le visiteur se pose en premier. */
.nv-prix-commune{margin-top:40px}
.nv-prix-commune .mono{color:var(--nv-brume);font-size:12px}
.nv-prix-c{margin:8px 0 0;font-family:var(--font-titre);font-weight:800;font-stretch:75%;
  font-size:clamp(56px,24px + 5.33vw,112px);line-height:.9;letter-spacing:-.035em;
  color:var(--nv-lead)}
.nv-prix-c-txt{margin:16px 0 0;max-width:46ch;font-size:17px;line-height:1.6;
  color:var(--nv-brume-clair,#bcc6d0)}
.nv-motscles{display:flex;flex-wrap:wrap;gap:12px 20px;margin:40px 0 0;padding:0;
  list-style:none;font-size:17px;font-weight:600}
.nv-motcle{border-bottom:2px solid var(--nv-lead-fonce);padding:8px 0 4px}
/* La liste à filets sur fond sombre : les filets passent en crème. */
.nv-liste-nuit{border-color:var(--nv-papier)}
.nv-liste-nuit > li{border-color:var(--nv-papier)}
.nv-liste-nuit > li::before{background:var(--nv-papier)}
.nv-liste-nuit > li > p{color:rgb(245 242 236/.78)}
.nv-faq-c > details{border-top:2px solid var(--nv-nuit)}
.nv-faq-c > details:last-of-type{border-bottom:2px solid var(--nv-nuit)}
.nv-faq-c-r{margin:0;padding:0 0 24px;max-width:60ch;font-size:16px;line-height:1.65}
@media (min-width:1024px){
  .nv-prix-commune{margin-top:48px}
}