@font-face{font-family:"Fraunces";src:url("polices/fraunces.woff2") format("woff2");font-weight:100 900;font-display:swap}
@font-face{font-family:"Manrope";src:url("polices/manrope.woff2") format("woff2");font-weight:200 800;font-display:swap}

:root{
  --pierre:#F3F1EA;--pierre-2:#E7E3D7;--pierre-3:#D9D3C2;
  --encre:#0D2526;--encre-2:#15393A;--encre-3:#1F4B4C;
  --vert:#00843C;--vert-fonce:#006B31;--vert-clair:#5BC983;--bleu:#245490;--bleu-clair:#7FA8DA;
  --terre:#6B5A44;--terre-2:#8C7759;--gravier:#A7A399;
  --texte:#1B2B2B;--doux:#5A6664;--ligne:rgba(13,37,38,.14);--ligne-claire:rgba(238,240,234,.16);
  --blanc:#F6F4EE;
  --g:clamp(20px,4.5vw,64px);--max:1320px;
  --serif:"Fraunces",Georgia,serif;--sans:"Manrope",system-ui,-apple-system,"Segoe UI",sans-serif;
  --ease:cubic-bezier(.22,.8,.2,1);
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:auto}
body{margin:0;background:var(--pierre);color:var(--texte);font-family:var(--sans);font-size:17px;line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img,video,svg{display:block;max-width:100%}
a{color:inherit}
button,input,select,textarea{font:inherit;color:inherit}
h1,h2,h3{font-family:var(--serif);font-weight:400;font-variation-settings:"SOFT" 100;letter-spacing:-.02em;line-height:1;margin:0}
p{margin:0 0 1em}
.wrap{max-width:var(--max);margin:0 auto;padding:0 var(--g)}
.k{font-family:var(--sans);font-weight:700;font-size:14px;letter-spacing:.14em;text-transform:uppercase;color:var(--vert-fonce);display:inline-flex;align-items:center;gap:10px}
.k::before{content:"";width:22px;height:1px;background:currentColor}
.sombre .k,.heros .k,.ph .k,.k.clair{color:var(--vert-clair)}
.h2{font-size:clamp(36px,6.2vw,88px)}
.h3{font-size:clamp(26px,3.2vw,40px)}
.lead{font-size:clamp(18px,1.6vw,21px);line-height:1.55;color:var(--doux);max-width:36em}
.h2+.lead,.h3+.lead,.h2+p,.h3+p{margin-top:22px}
.sombre{background:var(--encre);color:var(--blanc)}
.sombre .lead{color:rgba(238,240,234,.74)}
em.v{font-style:normal;color:var(--vert)}
.sombre em.v,.heros em.v,.ph em.v{color:var(--vert-clair)}
.nobr{white-space:nowrap}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* boutons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:52px;padding:0 26px;border-radius:999px;background:var(--vert);color:#fff;font-weight:700;font-size:16px;text-decoration:none;border:0;cursor:pointer;transition:background .25s,transform .25s var(--ease)}
.btn:hover{background:var(--vert-fonce);transform:translateY(-1px)}
.btn svg{width:18px;height:18px}
.btn.ligne{background:transparent;color:inherit;box-shadow:inset 0 0 0 1.5px currentColor}
.btn.ligne:hover{background:rgba(255,255,255,.08)}
.btn.clair{background:var(--blanc);color:var(--encre)}
.btn.clair:hover{background:#fff}
.fleche{display:inline-flex;align-items:center;gap:10px;font-weight:700;text-decoration:none;color:var(--vert-fonce)}
.fleche::after{content:"→";transition:transform .3s var(--ease)}
.fleche:hover::after{transform:translateX(5px)}
.sombre .fleche{color:var(--vert-clair)}

/* étiquettes « à confirmer » */
.note{display:inline-block;background:#FFE14D;color:#2A2300;font:600 12px/1.35 var(--sans);letter-spacing:0;text-transform:none;padding:4px 8px;border-radius:4px;margin:6px 0;max-width:30em;vertical-align:middle}
html:not(.notes) .note,html:not(.notes) .bandeau-demo{display:none!important}
.bandeau-demo{position:fixed;left:12px;bottom:12px;z-index:90;background:#FFE14D;color:#2A2300;font:700 12px/1 var(--sans);padding:9px 12px;border-radius:999px;box-shadow:0 6px 20px rgba(0,0,0,.18)}
.bandeau-demo a{margin-left:8px;font-weight:600}
@media (max-width:899px){.bandeau-demo{bottom:86px}}

/* en-tête */
.hd{position:fixed;inset:0 0 auto 0;z-index:60;transition:background .35s,box-shadow .35s,color .35s;color:var(--blanc)}
.hd .wrap{display:flex;align-items:center;gap:24px;height:76px;max-width:none}
.hd .logo{display:block;height:44px;flex:none}
.hd .logo img{height:100%;width:auto}
.hd .logo .sur-clair{display:none}
.hd.plein,.hd.clair{background:rgba(243,241,234,.97);color:var(--encre);box-shadow:0 1px 0 var(--ligne);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.hd.plein .logo .sur-fonce,.hd.clair .logo .sur-fonce{display:none}
.hd.plein .logo .sur-clair,.hd.clair .logo .sur-clair{display:block}
.nav{display:none;margin-left:auto;gap:4px;align-items:center}
.nav a{text-decoration:none;font-weight:600;font-size:15px;padding:8px 12px;border-radius:999px;opacity:.86;transition:opacity .2s,background .2s}
.nav a:hover,.nav a[aria-current]{opacity:1;background:rgba(127,127,127,.14)}
.hd .tel{display:none;font-weight:700;text-decoration:none;font-size:15px;white-space:nowrap}
.hd .btn{min-height:44px;padding:0 20px;font-size:15px}
.hd .act{margin-left:auto;display:flex;gap:10px;align-items:center}
.burger{width:46px;height:46px;border-radius:50%;border:0;background:rgba(127,127,127,.18);display:grid;place-items:center;cursor:pointer;color:inherit}
.burger span{display:block;width:18px;height:2px;background:currentColor;position:relative;transition:transform .3s}
.burger span::before,.burger span::after{content:"";position:absolute;left:0;width:18px;height:2px;background:currentColor;transition:transform .3s}
.burger span::before{top:-6px}.burger span::after{top:6px}
.menu-ouvert .burger span{background:transparent}
.menu-ouvert .burger span::before{transform:translateY(6px) rotate(45deg)}
.menu-ouvert .burger span::after{transform:translateY(-6px) rotate(-45deg)}
.hd .act .btn{display:none}
@media (min-width:640px){.hd .act .btn{display:inline-flex}}
@media (min-width:1220px){
  .nav{display:flex}.burger{display:none}.hd .act{margin-left:8px}.hd .tel{display:inline}
}

/* menu plein écran */
.menu{position:fixed;inset:0;z-index:55;background:var(--encre);color:var(--blanc);padding:100px var(--g) 40px;display:flex;flex-direction:column;gap:28px;overflow-y:auto;visibility:hidden;opacity:0;transition:opacity .35s,visibility .35s}
.menu-ouvert .menu{visibility:visible;opacity:1}
.menu-ouvert .hd{background:transparent;box-shadow:none;color:var(--blanc);backdrop-filter:none}
.menu-ouvert .hd .logo .sur-fonce{display:block}.menu-ouvert .hd .logo .sur-clair{display:none}
.menu ol{list-style:none;margin:0;padding:0;counter-reset:m}
.menu li a{display:flex;align-items:baseline;gap:16px;padding:12px 0;border-bottom:1px solid var(--ligne-claire);text-decoration:none;font-family:var(--serif);font-size:clamp(28px,7vw,48px);line-height:1.1;font-variation-settings:"SOFT" 100}
.menu li a::before{counter-increment:m;content:"0" counter(m);font:600 14px var(--sans);color:var(--vert-clair);letter-spacing:.1em}
.menu .coord{display:grid;gap:6px;color:rgba(238,240,234,.75);font-size:15px}
.menu .coord a{color:var(--blanc);font-weight:700;font-size:17px;text-decoration:none;min-height:44px;display:flex;align-items:center}
.menu li a[aria-current]{color:var(--vert-clair)}
.menu .btns{display:grid;grid-template-columns:1fr 1.25fr;gap:10px;margin-top:auto;padding-bottom:env(safe-area-inset-bottom)}
.menu .btns .btn{padding:0 12px}
.js .menu li,.js .menu .coord,.js .menu .btns{opacity:0;transform:translateY(18px);transition:opacity .45s var(--ease),transform .55s var(--ease)}
.js .menu-ouvert .menu li,.js .menu-ouvert .menu .coord,.js .menu-ouvert .menu .btns{opacity:1;transform:none}
.menu-ouvert .menu li:nth-child(1){transition-delay:0.08s}.menu-ouvert .menu li:nth-child(2){transition-delay:0.12s}.menu-ouvert .menu li:nth-child(3){transition-delay:0.16s}.menu-ouvert .menu li:nth-child(4){transition-delay:0.20s}.menu-ouvert .menu li:nth-child(5){transition-delay:0.24s}.menu-ouvert .menu li:nth-child(6){transition-delay:0.28s}.menu-ouvert .menu li:nth-child(7){transition-delay:0.32s}
.menu-ouvert .menu .coord{transition-delay:.34s}.menu-ouvert .menu .btns{transition-delay:.4s}
@media (min-width:1220px){.menu .btns{display:none}}
body.menu-ouvert{overflow:hidden}

/* barre du bas au cellulaire */
.barre{position:fixed;left:0;right:0;bottom:0;z-index:50;display:grid;grid-template-columns:1fr 1.25fr;gap:8px;padding:8px 12px calc(8px + env(safe-area-inset-bottom));background:rgba(13,37,38,.94);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);transform:translateY(110%);transition:transform .4s var(--ease)}
.barre.vue{transform:none}
.barre .btn{min-height:44px;padding:0 12px;font-size:15.5px}
.barre .btn.ligne{color:var(--blanc)}
@media (min-width:900px){.barre{display:none}}

/* HÉROS ACCUEIL */
.heros{position:relative;min-height:100vh;min-height:100svh;display:flex;align-items:flex-end;color:var(--blanc);overflow:hidden;background:var(--encre)}
.heros video,.heros .affiche{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.heros .voile{position:absolute;inset:0;background:linear-gradient(180deg,rgba(9,28,29,.6) 0%,rgba(9,28,29,.18) 30%,rgba(9,28,29,.5) 55%,rgba(9,28,29,.93) 100%)}
.topo{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;color:var(--vert-clair)}
.topo path{fill:none;stroke:currentColor;stroke-width:1.1;vector-effect:non-scaling-stroke;opacity:.38}
.topo path.fort{opacity:.75;stroke-width:1.6}
.heros .contenu{position:relative;width:100%;padding-bottom:clamp(96px,12vh,140px);padding-top:120px}
.heros h1{font-size:clamp(50px,10.4vw,156px);line-height:.92;max-width:11ch}
.heros h1 .l{display:block;overflow:hidden;padding-bottom:.06em}
.heros h1 .l>span{display:block}
.heros .sous{margin-top:clamp(18px,2.4vw,28px);font-size:clamp(17px,1.5vw,20px);max-width:34em;color:rgba(246,244,238,.92);font-weight:500}
.heros .btns{display:flex;flex-wrap:wrap;gap:12px;margin-top:26px}
.preuves{list-style:none;margin:0 0 22px;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.preuves li{font-size:14px;font-weight:700;line-height:1.2;white-space:nowrap;padding:8px 13px;border-radius:999px;background:rgba(9,28,29,.5);box-shadow:inset 0 0 0 1px rgba(246,244,238,.26);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.preuves b{color:var(--vert-clair);font-weight:800}
.heros .bas{position:absolute;left:0;right:0;bottom:22px;display:flex;justify-content:space-between;gap:20px;font-size:13px;font-weight:600;letter-spacing:.06em;color:rgba(246,244,238,.78);text-transform:uppercase}
.heros .bas span:last-child{text-align:right}
@media (max-width:640px){.heros .bas{display:none}.heros .contenu{padding-bottom:calc(30px + env(safe-area-inset-bottom))}.sur-pc{display:none}}

/* HÉROS DES PAGES */
.ph{position:relative;min-height:88vh;min-height:88svh;display:flex;align-items:flex-end;color:var(--blanc);overflow:hidden;background:var(--encre)}
.ph video,.ph .affiche{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.ph .affiche.lent{animation:lent 18s ease-out both}
@keyframes lent{from{transform:scale(1.12)}to{transform:scale(1)}}
.ph .voile{position:absolute;inset:0;background:linear-gradient(180deg,rgba(9,28,29,.62),rgba(9,28,29,.22) 38%,rgba(9,28,29,.92))}
.ph .contenu{position:relative;width:100%;padding:130px 0 clamp(60px,9vh,96px)}
.ph .num{font:600 14px var(--sans);letter-spacing:.16em;text-transform:uppercase;color:var(--vert-clair);margin-bottom:20px;display:flex;gap:14px;align-items:center}
.ph .num a{display:inline-flex;align-items:center;min-height:44px;padding:0 16px 0 13px;border-radius:999px;background:rgba(246,244,238,.94);color:var(--encre);text-decoration:none;letter-spacing:.02em;text-transform:none;font-weight:700;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);transition:background .25s}
.ph .num a:hover{background:#fff}
.ph h1{font-size:clamp(46px,8.6vw,128px);line-height:.94;max-width:12ch}
.ph .sous{margin-top:20px;max-width:32em;font-size:clamp(17px,1.5vw,20px);color:rgba(246,244,238,.88)}
.ph .btns{display:flex;flex-wrap:wrap;gap:12px;margin-top:26px}
.ph.court{min-height:70vh;min-height:70svh}

/* sections */
.sec{padding:clamp(80px,12vw,168px) 0}
.sec.serre{padding:clamp(64px,8vw,110px) 0}
.tete{display:grid;gap:22px;margin-bottom:clamp(40px,6vw,80px)}
@media (min-width:960px){.tete.cote{grid-template-columns:1.1fr .9fr;align-items:end}}

/* manifeste mot à mot */
.manif .h2{max-width:14ch}
.mots{font-family:var(--serif);font-variation-settings:"SOFT" 100;font-size:clamp(26px,3.4vw,46px);line-height:1.22;letter-spacing:-.01em;margin-top:clamp(28px,4vw,48px);max-width:24em}
.mots .m{opacity:.16;transition:opacity .35s;white-space:nowrap}

.mots .m.on{opacity:1}
.statique .mots .m,.no-js .mots .m{opacity:1}
.manif .signe{display:flex;gap:28px;flex-wrap:wrap;margin-top:40px;font-weight:700;color:var(--doux);font-size:15px}
.manif .signe b{color:var(--encre);font-weight:800}

/* services : liste + image collante */
.svc{display:grid;gap:0}
.svc .item{display:grid;gap:18px;padding:30px 0;border-top:1px solid var(--ligne);text-decoration:none}
.svc .item:last-child{border-bottom:1px solid var(--ligne)}
.svc .item .n{font:700 14px var(--sans);letter-spacing:.14em;color:var(--vert-fonce)}
.svc .item h3{font-size:clamp(32px,4.6vw,64px);transition:color .3s}
.svc .item p{color:var(--doux);margin:12px 0 0;max-width:30em}
.svc .item .fleche{margin-top:6px}
.svc .item .img{aspect-ratio:4/3;border-radius:14px;overflow:hidden;background:var(--pierre-2)}
.svc .item .img img{width:100%;height:100%;object-fit:cover}
.svc-cadre{display:none}
@media (min-width:960px){
  .svc-grille{display:grid;grid-template-columns:1fr 1fr;gap:clamp(40px,5vw,90px);align-items:start}
  .svc .item{grid-template-columns:70px 1fr;gap:4px 18px;padding:36px 0}
  .svc .item .n{padding-top:16px}
  .svc .item .txt{grid-column:2}
  .svc .item .img{display:none}
  .svc .item:hover h3,.svc .item.actif h3{color:var(--vert)}
  .svc-cadre{display:block;position:sticky;top:110px;aspect-ratio:4/5;border-radius:18px;overflow:hidden;background:var(--pierre-2)}
  .svc-cadre img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transform:scale(1.06);transition:opacity .6s var(--ease),transform 1.2s var(--ease)}
  .svc-cadre img.on{opacity:1;transform:none}
  .svc-cadre .leg{position:absolute;left:18px;bottom:18px;z-index:2;background:rgba(13,37,38,.78);color:var(--blanc);font-size:13px;font-weight:600;padding:8px 12px;border-radius:999px}
}

/* LA COUPE (couches sous le pavé) */
.coupe{position:relative}
.coupe .scene{display:grid;gap:36px;align-items:center}
.coupe .tex{max-width:30em}
.coupe .pile{position:relative;width:100%;max-width:620px;margin:0 auto;aspect-ratio:1/1.02}
.coupe .couche{position:absolute;left:0;right:0;border-radius:4px;overflow:hidden}
.coupe .c-sol{bottom:0;height:30%;background:radial-gradient(circle at 20% 30%,rgba(0,0,0,.12) 0 2px,transparent 3px) 0 0/22px 19px,radial-gradient(circle at 70% 60%,rgba(255,255,255,.06) 0 3px,transparent 4px) 0 0/31px 27px,linear-gradient(180deg,#5d4c38,#463826)}
.coupe .c-geo{bottom:30%;height:2.6%;background:repeating-linear-gradient(90deg,#1d1d1d 0 6px,#2b2b2b 6px 9px)}
.coupe .c-pierre{bottom:32.6%;height:30%;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='46' height='38'%3E%3Cg stroke='rgba(0,0,0,.18)' stroke-width='.7'%3E%3Cpolygon points='19,15 25,14 26,19 20,21' fill='%23a9a397'/%3E%3Cpolygon points='38,13 44,16 41,21 36,19' fill='%23ccc7bc'/%3E%3Cpolygon points='4,31 9,29 11,34 6,36' fill='%2399948a'/%3E%3Cpolygon points='27,31 33,30 34,35 28,37' fill='%23b7b2a7'/%3E%3Cpolygon points='12,3 17,2 18,7 13,8' fill='%23c0bbb0'/%3E%3C/g%3E%3C/svg%3E") 9px 5px/46px 38px,url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='60' height='52'%3E%3Cg stroke='rgba(0,0,0,.2)' stroke-width='.8'%3E%3Cpolygon points='4,6 13,3 17,10 10,15 3,12' fill='%23c4bfb4'/%3E%3Cpolygon points='24,4 33,7 31,15 22,14' fill='%238f8a80'/%3E%3Cpolygon points='42,3 52,5 55,12 47,16 40,11' fill='%23b3ada1'/%3E%3Cpolygon points='8,24 18,21 21,30 12,33 6,30' fill='%23a29d92'/%3E%3Cpolygon points='29,22 37,19 42,26 36,33 27,30' fill='%23d0cbc0'/%3E%3Cpolygon points='48,24 57,22 58,31 50,34' fill='%2386817a'/%3E%3Cpolygon points='2,42 11,39 14,47 5,50' fill='%23bab5aa'/%3E%3Cpolygon points='19,40 28,38 31,46 24,50 17,47' fill='%23938e84'/%3E%3Cpolygon points='37,41 46,38 51,45 42,50' fill='%23c8c3b8'/%3E%3C/g%3E%3C/svg%3E") 0 0/60px 52px,linear-gradient(180deg,#9c978c,#7b766c)}
.coupe .c-lit{bottom:62.6%;height:7%;background:radial-gradient(circle,rgba(0,0,0,.08) 0 1px,transparent 1.5px) 0 0/6px 6px,linear-gradient(180deg,#d8c7a0,#c6b386)}
.coupe .c-pave{bottom:69.6%;height:11%;display:grid;grid-template-columns:2fr 1.2fr 1.6fr 1fr 2fr 1.3fr;gap:4px;background:#cbbd99}
.coupe .c-pave i{background:linear-gradient(180deg,#8e8a84,#6f6b65);box-shadow:inset 0 2px 0 rgba(255,255,255,.18)}
.coupe .c-pave i:nth-child(2n){background:linear-gradient(180deg,#a19d96,#7d7973)}
.coupe .c-air{bottom:80.6%;height:19.4%}
.coupe .etq{position:absolute;left:12px;top:50%;transform:translateY(-50%);font:700 14px/1 var(--sans);color:var(--blanc);background:rgba(13,37,38,.95);box-shadow:0 0 0 1px rgba(238,240,234,.3);padding:6px 10px;border-radius:999px;white-space:nowrap}
.coupe .c-geo .etq,.coupe .c-lit .etq{left:auto;right:12px}
.coupe .c-geo,.coupe .c-lit{overflow:visible;z-index:2}
.coupe .lst{list-style:none;margin:26px 0 0;padding:0;display:grid;gap:0;counter-reset:c}
.coupe .lst li{display:grid;grid-template-columns:44px 1fr;gap:12px;padding:16px 0;border-top:1px solid var(--ligne-claire);opacity:.35;transition:opacity .4s}
.coupe .lst li.on{opacity:1}
.coupe .lst li::before{counter-increment:c;content:"0" counter(c);font:700 14px var(--sans);color:var(--vert-clair);padding-top:4px;letter-spacing:.1em}
.coupe .lst b{display:block;font-family:var(--serif);font-weight:400;font-size:22px;font-variation-settings:"SOFT" 100;margin-bottom:2px}
.coupe .lst span{color:rgba(238,240,234,.7);font-size:15.5px}
.coupe .reperes{position:absolute;inset:0;pointer-events:none}
.coupe .reperes div{position:absolute;left:-14px;right:-14px;border-top:1px dashed rgba(91,201,131,.0)}
.statique .coupe .lst li,.no-js .coupe .lst li{opacity:1}
@media (max-width:959px){.coupe .lst li{opacity:1}.coupe .scene{padding:64px 0;gap:8px}}
@media (min-width:960px){
  .coupe .scene{grid-template-columns:1fr 1fr;gap:clamp(40px,6vw,100px);min-height:100vh;padding:90px 0}
}

/* bande de photos qui glisse */
.bande{overflow:hidden}
.bande .rail{display:flex;gap:clamp(12px,1.6vw,22px);padding:0 var(--g);will-change:transform}
.bande figure{margin:0;flex:none;width:clamp(260px,34vw,520px)}
.bande figure:nth-child(3n+2){width:clamp(220px,26vw,400px)}
.bande .img{aspect-ratio:4/3;border-radius:14px;overflow:hidden;background:var(--pierre-2)}
.bande figure:nth-child(3n+2) .img{aspect-ratio:4/5}
.bande img{width:100%;height:100%;object-fit:cover}
.bande figcaption{font-size:14px;font-weight:600;color:var(--doux);margin-top:10px}
.rail-bas{display:none}
@media (max-width:899px){
  .rail-bas{display:flex;align-items:center;gap:14px;margin-top:20px;font-size:14px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--doux)}
  .rail-bas span::after{content:" →"}
  .rail-prog{flex:1;height:2px;background:var(--ligne);border-radius:2px;overflow:hidden}
  .rail-prog i{display:block;height:100%;width:100%;background:var(--vert);transform-origin:left;transform:scaleX(var(--r,.2))}
  .bande .rail{overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-inline:var(--g);-webkit-overflow-scrolling:touch;scrollbar-width:none;transform:none!important}
  .bande .rail::-webkit-scrollbar{display:none}
  .bande figure,.bande figure:nth-child(3n+2){scroll-snap-align:start;width:82vw}
  .bande .img,.bande figure:nth-child(3n+2) .img{aspect-ratio:4/5}
}

/* CARTE 50 km */
.carte .grille{display:grid;gap:40px;align-items:center}
@media (min-width:960px){.carte .grille{grid-template-columns:.9fr 1.1fr}}
.carte svg{width:100%;height:auto;overflow:visible}
.carte .anneau{fill:none;stroke:var(--vert);stroke-width:1.4;vector-effect:non-scaling-stroke}
.carte .anneau.a50{stroke-width:2.2}
.carte .topo-c path{fill:none;stroke:var(--encre);opacity:.07;stroke-width:1;vector-effect:non-scaling-stroke}
.carte .route{fill:none;stroke:var(--bleu);stroke-width:2;stroke-dasharray:6 6;opacity:.55;vector-effect:non-scaling-stroke}
.carte .ville circle{fill:var(--encre)}
.carte .ville text{font:600 15px var(--sans);fill:var(--encre)}
.carte .centre circle.p{fill:var(--vert)}
.carte .centre circle.halo{fill:var(--vert);opacity:.25;transform-origin:center;transform-box:fill-box;animation:halo 2.6s ease-out infinite}
.carte .centre text{font:800 17px var(--sans);fill:var(--vert-fonce)}
.carte .km{font:800 13px var(--sans);fill:var(--vert-fonce);letter-spacing:.08em}
.carte text{paint-order:stroke;stroke:var(--pierre);stroke-width:5px;stroke-linejoin:round}
@keyframes halo{from{transform:scale(1);opacity:.45}to{transform:scale(3.2);opacity:0}}
@media (max-width:600px){.carte .ville.mineur{display:none}.carte .ville text{font-size:36px}.carte .centre text{font-size:40px}.carte .km{font-size:30px}.carte text{stroke-width:9px}.carte .vis{margin:0 calc(-1 * var(--g))}}
.carte .heures{display:grid;gap:0;margin-top:28px;max-width:420px}
.carte .heures div{display:flex;justify-content:space-between;padding:12px 0;border-top:1px solid var(--ligne);font-weight:600}
.carte .heures div span:last-child{color:var(--doux)}

/* FAQ */
.faq{display:grid;gap:0;max-width:880px}
.faq details{border-top:1px solid var(--ligne)}
.faq details:last-child{border-bottom:1px solid var(--ligne)}
.faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;gap:20px;align-items:center;padding:24px 0;font-family:var(--serif);font-size:clamp(21px,2.2vw,28px);font-variation-settings:"SOFT" 100;line-height:1.2}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font:300 30px/1 var(--sans);color:var(--vert);transition:transform .3s;flex:none}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq .rep{padding:0 0 24px;color:var(--doux);max-width:40em}

/* SOUMISSION */
.soum .grille{display:grid;gap:44px}
.grille>*{min-width:0}
a[href^="mailto:"]{overflow-wrap:anywhere}
@media (min-width:960px){.soum .grille{grid-template-columns:.85fr 1.15fr;gap:clamp(48px,6vw,110px)}}
.soum .coord{display:grid;gap:18px;margin-top:30px}
.soum .coord a{text-decoration:none;font-weight:700;font-size:clamp(20px,2vw,26px)}
.soum .coord small{display:block;font-size:14px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:rgba(238,240,234,.72)}
form.f{display:grid;gap:18px;background:var(--encre-2);padding:clamp(22px,3.4vw,42px);border-radius:20px}
.f .puces{display:flex;flex-wrap:wrap;gap:8px}
.f .puces label{position:relative}
.f .puces input{position:absolute;opacity:0;inset:0;cursor:pointer}
.f .puces span{display:inline-flex;min-height:44px;align-items:center;padding:0 16px;border-radius:999px;border:1.5px solid var(--ligne-claire);font-weight:600;font-size:15px;transition:all .2s;cursor:pointer}
.f .puces input:checked+span{background:var(--vert);border-color:var(--vert);color:#fff}
.f .puces input:focus-visible+span{outline:2px solid var(--vert-clair);outline-offset:2px}
.f fieldset{border:0;padding:0;margin:0;display:grid;gap:10px}
.f legend,.f label.ch>span{font-size:14px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:rgba(238,240,234,.8);padding:0;margin-bottom:8px}
.f .duo{display:grid;gap:18px}
@media (min-width:560px){.f .duo{grid-template-columns:1fr 1fr}}
.f label.ch{display:grid}
.f input[type=text],.f input[type=tel],.f input[type=email],.f textarea{width:100%;min-height:52px;padding:14px 16px;border-radius:12px;border:1.5px solid rgba(238,240,234,.3);background:rgba(255,255,255,.07);color:var(--blanc);font-size:16px;transition:border-color .2s}
.f textarea{min-height:110px;resize:vertical}
.f input:focus,.f textarea:focus{outline:none;border-color:var(--vert-clair)}
.f .err{border-color:#FF8A7A!important}
.f .bas{display:flex;flex-wrap:wrap;gap:14px;align-items:center;justify-content:space-between}
.f .petit{font-size:14px;color:rgba(238,240,234,.78);margin:0;max-width:30em}
.f .petit a{display:inline-block;padding:13px 0;margin:-13px 0}
.f .merci{display:none;text-align:center;padding:30px 10px}
.f .piege{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.f .erreur-envoi{margin:4px 0 0;padding:14px 16px;border-radius:12px;background:rgba(255,138,122,.14);color:#FFD9D2;font-size:15px;line-height:1.5}
.f .erreur-envoi a{color:inherit;text-decoration:underline}
.f .erreur-envoi[hidden]{display:none}
.f button[aria-busy=true]{opacity:.6;pointer-events:none}
.f.envoye>*:not(.merci){display:none}
.f.envoye .merci{display:block}
.f .merci h3{font-size:34px;margin-bottom:10px}

/* CTA */
.cta{position:relative;overflow:hidden}
.cta .wrap{position:relative;display:grid;gap:26px;justify-items:start}
.cta .h2{max-width:13ch}
.cta .btns{display:flex;flex-wrap:wrap;gap:12px}
.cta .topo{opacity:.5}

/* pied */
.ft{background:#081A1B;color:rgba(238,240,234,.78);padding:80px 0 120px;font-size:15px}
@media (min-width:900px){.ft{padding-bottom:50px}}
.ft .g{display:grid;gap:40px}
@media (min-width:860px){.ft .g{grid-template-columns:1.4fr 1fr 1fr 1fr}}
.ft img{height:46px;width:auto;margin-bottom:18px}
.ft h4{font:700 14px var(--sans);letter-spacing:.16em;text-transform:uppercase;color:var(--vert-clair);margin:0 0 14px}
.ft ul{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.ft a{text-decoration:none}
.ft a:hover{color:var(--blanc)}
.ft .fin{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:4px 12px;margin-top:56px;padding-top:24px;border-top:1px solid var(--ligne-claire);font-size:14px}
@media (max-width:899px){.ft ul{gap:0}.ft li{display:flex;align-items:center;min-height:44px}.ft ul a,.ft .fin a{display:inline-flex;align-items:center;min-height:44px}.ft{padding:56px 0 calc(32px + env(safe-area-inset-bottom))}.ft .g{gap:28px}.ft .g>div:nth-child(2){display:none}}

/* PAGES DE SERVICE */
.intro .grille{display:grid;gap:28px}
@media (min-width:960px){.intro .grille{grid-template-columns:1.15fr .85fr;gap:clamp(40px,6vw,110px);align-items:end}}
.intro .h2{max-width:15ch}
.av{display:grid;gap:14px}
@media (min-width:860px){.av{grid-template-columns:repeat(3,1fr);gap:18px}}
.av article{background:var(--pierre-2);border-radius:18px;padding:clamp(24px,2.6vw,36px);display:grid;gap:14px;align-content:start}
.sombre .av article{background:rgba(238,240,234,.07);box-shadow:inset 0 0 0 1px rgba(238,240,234,.12)}
.av .n{font:700 14px var(--sans);letter-spacing:.14em;color:var(--vert-fonce)}
.sombre .av .n{color:var(--vert-clair)}
.av h3{font-size:clamp(24px,2.3vw,32px)}
.av p{margin:0;color:var(--doux)}
.sombre .av p{color:rgba(238,240,234,.84)}
.photos{display:grid;gap:14px}
@media (min-width:760px){.photos{grid-template-columns:1.35fr 1fr}.photos figure:first-child{grid-row:span 2}}
.photos figure{margin:0;border-radius:16px;overflow:hidden;background:var(--pierre-2);position:relative;min-height:240px}
.photos img{width:100%;height:100%;object-fit:cover;position:absolute;inset:0}
.photos figcaption{position:absolute;left:14px;bottom:14px;background:rgba(13,37,38,.78);color:var(--blanc);font-size:14px;font-weight:600;padding:7px 12px;border-radius:999px}
@media (max-width:759px){.photos figure{aspect-ratio:4/3;min-height:0}}
.autres{display:grid;gap:12px}
@media (min-width:760px){.autres{grid-template-columns:repeat(4,1fr)}}
.autres a{display:grid;gap:10px;text-decoration:none;padding:20px;border-radius:16px;border:1px solid var(--ligne);transition:background .25s,border-color .25s}
.autres a:hover{background:var(--pierre-2);border-color:transparent}
.autres .img{aspect-ratio:16/10;border-radius:10px;overflow:hidden}
.autres img{width:100%;height:100%;object-fit:cover}
.autres b{font-family:var(--serif);font-weight:400;font-size:22px;font-variation-settings:"SOFT" 100;line-height:1.15}
.autres span{font-size:14px;font-weight:700;color:var(--vert-fonce);letter-spacing:.1em}

/* modules propres à chaque service */
.mod{display:grid;gap:40px;align-items:center}
@media (min-width:960px){.mod{grid-template-columns:1fr 1fr;gap:clamp(40px,6vw,100px)}}
.mod .vis{position:relative;width:100%}
.mod svg{width:100%;height:auto}
/* pavé : le motif se pose */
.motif rect{fill:#8d8983;stroke:var(--pierre);stroke-width:3}
.motif rect.b{fill:#a29e97}.motif rect.c{fill:#76726c}
.js .motif rect{opacity:0;transform-box:fill-box;transform-origin:center;transform:translateY(-14px)}
.motif rect.on{opacity:1;transform:none;transition:opacity .35s,transform .45s var(--ease)}
.statique .motif rect,.no-js .motif rect{opacity:1;transform:none}
/* nivelage : le profil et le niveau */
.profil .sol{fill:#6b5a44}
.profil .herbe{fill:none;stroke:var(--vert);stroke-width:5;stroke-linejoin:round}
.profil .cible{stroke:var(--bleu);stroke-width:2;stroke-dasharray:8 8}
.profil .laser{fill:var(--bleu)}
.profil .cible-t{font:700 17px var(--sans);fill:var(--bleu)}
@media (max-width:600px){.profil .cible-t{font-size:28px}}
.niveau{display:flex;align-items:center;gap:16px;margin-top:22px}
.niveau .tube{position:relative;width:220px;height:34px;border-radius:999px;background:linear-gradient(180deg,#e9f5c9,#c9e39a);box-shadow:inset 0 0 0 2px rgba(13,37,38,.25)}
.niveau .tube::before,.niveau .tube::after{content:"";position:absolute;top:4px;bottom:4px;width:2px;background:rgba(13,37,38,.45);left:calc(50% - 22px)}
.niveau .tube::after{left:calc(50% + 20px)}
.niveau .bulle{position:absolute;top:7px;left:calc(50% - 16px);width:32px;height:20px;border-radius:999px;background:radial-gradient(circle at 35% 35%,#fff,#f4ffd8 60%,#d9f0a8);box-shadow:0 0 0 1px rgba(13,37,38,.18)}
.niveau .etat{font-weight:700}
/* gazon : les étapes */
.etapes{position:relative;list-style:none;margin:32px 0 0;padding:0 0 0 34px;display:grid;gap:30px}
.etapes::before{content:"";position:absolute;left:9px;top:8px;bottom:8px;width:2px;background:var(--ligne)}
.etapes::after{content:"";position:absolute;left:9px;top:8px;width:2px;height:calc((100% - 16px) * var(--p,0));background:var(--vert);transition:height .2s linear}
.etapes li{position:relative}
.etapes li::before{content:"";position:absolute;left:-31px;top:6px;width:16px;height:16px;border-radius:50%;background:var(--pierre);box-shadow:inset 0 0 0 2px var(--pierre-3);transition:all .3s}
.etapes li.on::before{background:var(--vert);box-shadow:0 0 0 5px rgba(0,132,60,.16)}
.etapes b{display:block;font-family:var(--serif);font-weight:400;font-size:clamp(24px,2.4vw,32px);font-variation-settings:"SOFT" 100;line-height:1.15;margin-bottom:6px}
.etapes p{margin:0;color:var(--doux)}
.sombre .etapes p{color:rgba(238,240,234,.82)}
.sombre .etapes::before{background:var(--ligne-claire)}
.statique .etapes li::before,.no-js .etapes li::before{background:var(--vert)}
.statique .etapes::after,.no-js .etapes::after{height:calc(100% - 16px)}
/* muret : les rangs se posent */
.mur .bloc{fill:#cfc9bb;stroke:#efece4;stroke-width:3}
.mur .bloc.b{fill:#bfb8a8}.mur .bloc.c{fill:#dcd6c8}
.mur .terre{fill:#6b5a44}
.js .mur .bloc{opacity:0;transform-box:fill-box;transform:translateY(-40px)}
.mur .bloc.on{opacity:1;transform:none;transition:opacity .3s,transform .5s cubic-bezier(.3,1.4,.5,1)}
.statique .mur .bloc,.no-js .mur .bloc{opacity:1;transform:none}
/* conteneurs : la partie enfouie */
.enfoui .ciel{fill:#e4ecef}
.enfoui .sol{fill:#6b5a44}
.enfoui .gazon{fill:var(--vert)}
.enfoui .cuve{fill:#3d4a4c}
.enfoui .couvercle{fill:#22302f}
.enfoui .ligne-sol{stroke:var(--encre);stroke-width:2;stroke-dasharray:6 6}
.enfoui text{font:700 18px var(--sans);fill:var(--encre)}
@media (max-width:600px){.enfoui text{font-size:30px}}
.enfoui text.clair{fill:var(--blanc)}

/* vidéos dans les grilles */
.photos video{width:100%;height:100%;object-fit:cover;position:absolute;inset:0}
@media (min-width:760px){.photos.un{grid-template-columns:1fr}.photos.un figure{aspect-ratio:16/8}.photos.deux{grid-template-columns:1fr 1fr}.photos.deux figure{grid-row:auto;aspect-ratio:4/3}}
figure.clip{margin:0;position:relative;aspect-ratio:4/3;border-radius:18px;overflow:hidden;background:var(--encre-2)}
figure.clip video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
figure.clip figcaption{position:absolute;left:14px;bottom:14px;background:rgba(13,37,38,.78);color:var(--blanc);font-size:14px;font-weight:600;padding:7px 12px;border-radius:999px}
[id]{scroll-margin-top:84px}

/* 404 */
.p404{min-height:80vh;display:flex;align-items:center}
.p404 .wrap{width:100%;padding-top:60px}
.p404 h1{margin:14px 0 22px;max-width:14ch}
.p404 .btns{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}
.p404 .liens{list-style:none;margin:40px 0 0;padding:0;max-width:520px}
.p404 .liens a{display:flex;justify-content:space-between;align-items:center;gap:16px;min-height:52px;border-top:1px solid var(--ligne);text-decoration:none;font-weight:700}
.p404 .liens a::after{content:"→";color:var(--vert)}

/* CELLULAIRE (v1.1) : plus court, plus lisible, plus gros sous le pouce */
@media (max-width:759px){
  .sec{padding:64px 0}
  .sec.serre{padding:52px 0}
  .tete{gap:16px;margin-bottom:28px}
  .heros .topo path{opacity:.16}
  .heros .topo path.fort{opacity:.38}
  .ph .num .ici{display:none}
  .ph .voile{background:linear-gradient(180deg,rgba(9,28,29,.62),rgba(9,28,29,.34) 28%,rgba(9,28,29,.8) 56%,rgba(9,28,29,.95))}
  .ph h1,.ph .sous{text-shadow:0 1px 16px rgba(9,28,29,.6)}
  .ph .topo path{opacity:.14}
  .mod{gap:28px}
  .autres{grid-template-columns:1fr 1fr;gap:10px}
  .autres a{gap:8px;padding:10px 10px 14px;border-radius:14px}
  .autres .img{aspect-ratio:4/3}
  .autres b{font-size:18px}
}
@media (max-width:959px){
  .svc .item{position:relative;gap:14px;padding:22px 0 26px}
  .svc .item .img{order:-1;aspect-ratio:16/10}
  .svc .item .n{position:absolute;z-index:1;top:34px;left:12px;padding:5px 11px;border-radius:999px;background:rgba(13,37,38,.8);color:var(--blanc)}
  .svc .item h3{font-size:30px}
}
@media (max-width:640px){
  .heros .btns,.ph .btns,.cta .btns,.p404 .btns{display:grid;grid-template-columns:1fr;gap:10px;justify-self:stretch}
}
@media (max-width:559px){
  .f .puces{display:grid;grid-template-columns:1fr 1fr}
  .f .puces label{display:flex}
  .f .puces span{display:flex;width:100%;justify-content:center;text-align:center;padding:6px 10px;line-height:1.25}
  .f .bas{display:grid;gap:12px}
  .f .bas .btn{order:-1;width:100%}
  .soum .coord a[href^="mailto:"]{font-size:clamp(15px,4.6vw,20px)}
}

/* apparitions */
.js .rv{opacity:0;transform:translateY(28px);transition:opacity .9s var(--ease),transform .9s var(--ease)}
.js .rv.on{opacity:1;transform:none}
.js .rv-img{clip-path:inset(12% 6% 12% 6% round 18px);transition:clip-path 1.2s var(--ease)}
.js .rv-img.on{clip-path:inset(0 0 0 0 round 14px)}
.statique .rv,.statique .rv-img{opacity:1!important;transform:none!important;clip-path:none!important;transition:none!important}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important}
}
