/* V3 « Lisière » : logo rond au centre de l'en-tête (Jeunot), formes arrondies, lisières de sapins entre les sections,
   titres à empattements (Zilla Slab), libellés étroits comme « TRAVAUX FORESTIERS » du logo (Barlow Condensed).
   Couleurs relevées sur le logo : vert de l'arc, orange du cercle, noir des sapins. */
:root{
  --vert:#2C5428; --vert-f:#1B3A1C; --vert-n:#101A12; --vert-c:#EAF1E6; --sauge:#F3F6F0;
  --orange:#E18133; --orange-f:#B95E17; --orange-c:#FDEEDF;
  --blanc:#FFFFFF; --trait:#DCE4D7; --texte:#2A332C; --doux:#5D6A60;
  --f-titre:"Amatic SC","Arial Narrow",sans-serif;
  --f-eti:"Dosis","Arial Narrow",sans-serif;
  --f-texte:"Poppins","Segoe UI",Arial,sans-serif;
  --large:1500px; --gout:clamp(16px,4vw,40px); --rayon:18px;
  --ombre:0 18px 40px rgba(16,26,18,.13); --ombre-l:0 8px 22px rgba(16,26,18,.08);
  color-scheme:light;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--blanc);color:var(--texte);font:400 16px/1.75 var(--f-texte);overflow-x:clip}
h1,h2,h3,h4{font-family:var(--f-titre);font-weight:700;-webkit-text-stroke:.045em currentColor;font-size-adjust:.74;line-height:1.12;margin:0;text-wrap:balance;color:var(--vert-n);letter-spacing:.01em}
p{margin:0}
a{color:inherit}
button{font:inherit;cursor:pointer}
img{max-width:100%}
:focus-visible{outline:3px solid var(--orange);outline-offset:3px}
.env{max-width:var(--large);margin:0 auto;padding-inline:var(--gout)}
.sur-titre{display:inline-flex;align-items:center;gap:9px;font:600 15px/1 var(--f-eti);letter-spacing:.16em;text-transform:uppercase;color:var(--orange-f)}
.sur-titre::before{content:"";width:13px;height:16px;background:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 13 16'%3E%3Cpath d='M6.5 0 10 5H8.4L11.5 9.5H9.6L13 14H7.4V16H5.6V14H0L3.4 9.5H1.5L4.6 5H3Z'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 13 16'%3E%3Cpath d='M6.5 0 10 5H8.4L11.5 9.5H9.6L13 14H7.4V16H5.6V14H0L3.4 9.5H1.5L4.6 5H3Z'/%3E%3C/svg%3E") center/contain no-repeat}
.centre{text-align:center}
.centre .sur-titre{justify-content:center}
.sec{padding-block:clamp(64px,8vw,104px);position:relative}
.sec.sauge{background:var(--sauge)}
.sec.vert{background:var(--vert-f);color:#d5e1d3}
.sec.vert h2,.sec.vert h3{color:var(--blanc)}
.titre{display:grid;gap:12px;margin-bottom:42px}
.titre h2{font-size:clamp(32px,4vw,48px)}
.titre p{max-width:66ch;color:var(--doux)}
.titre.centre p{margin-inline:auto}



/* Boutons en pilule */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:14px 28px;border-radius:999px;background:var(--orange);color:var(--vert-n);border:2px solid var(--orange);font:700 17px/1 var(--f-eti);letter-spacing:.07em;text-transform:uppercase;text-decoration:none;transition:background .25s,color .25s,border-color .25s,transform .25s,box-shadow .25s}
.btn:hover{background:#F09450;border-color:#F09450;transform:translateY(-2px);box-shadow:0 10px 20px rgba(225,129,51,.3)}
.btn.vert{background:var(--vert);border-color:var(--vert);color:#fff}
.btn.vert:hover{background:var(--vert-f);border-color:var(--vert-f);box-shadow:0 10px 20px rgba(27,58,28,.3)}
.btn.ligne{background:transparent;color:var(--vert-n);border-color:var(--vert)}
.btn.ligne:hover{background:var(--vert);color:#fff}
.btn.ligne.clair{color:#fff;border-color:rgba(255,255,255,.85)}
.btn.ligne.clair:hover{background:#fff;color:var(--vert-n)}
.btn svg{width:18px;height:18px}
.actions{display:flex;gap:12px;flex-wrap:wrap}


/* ── En-tête : logo rond au centre (comme Jeunot), menu de part et d'autre ── */
.tete{position:sticky;top:calc(env(safe-area-inset-top,0px) - var(--h-haut));z-index:40;--h-haut:96px}
.tete-haut{background:var(--blanc);height:var(--h-haut)}
.tete-haut .env{height:100%;display:flex;align-items:center;justify-content:space-between;gap:20px;position:relative}
.tel-tete{display:flex;align-items:center;gap:12px;text-decoration:none;line-height:1.15}
.rond-ic{width:44px;height:44px;border-radius:50%;display:grid;place-items:center;background:var(--orange-c);color:var(--orange-f);flex-shrink:0}
.rond-ic svg{width:19px;height:19px}
.tel-tete small{display:block;font:600 13px/1.2 var(--f-eti);letter-spacing:.12em;text-transform:uppercase;color:var(--doux)}
.tel-tete b{font:700 22px/1.1 var(--f-eti);letter-spacing:.04em;color:var(--vert-n)}
.tete-actions{display:flex;gap:10px;align-items:center}
.medaillon{position:absolute;left:50%;top:8px;transform:translateX(-50%);z-index:5;width:212px;height:212px;border-radius:50%;background:#fff;box-shadow:0 14px 34px rgba(16,26,18,.22);display:grid;place-items:center;text-decoration:none;transition:opacity .3s,transform .3s}
.medaillon img{width:186px;height:auto;display:block;margin-top:2px}
.tete.reduit .medaillon{opacity:0;pointer-events:none;transform:translate(-50%,-12px) scale(.9)}
.nav-barre{background:var(--vert-f);border-top:3px solid var(--orange);box-shadow:0 10px 24px rgba(16,26,18,.0);transition:box-shadow .3s}
.tete.reduit .nav-barre{box-shadow:0 10px 24px rgba(16,26,18,.25)}
.nav-barre .env{display:flex;align-items:center;height:58px;position:relative}
.logo-mini{position:absolute;left:var(--gout);top:50%;width:46px;height:46px;transform:translateY(-50%) scale(.6);opacity:0;transition:opacity .3s,transform .3s;line-height:0}
.logo-mini img{width:46px;height:46px;border-radius:50%;display:block}
.tete.reduit .logo-mini{opacity:1;transform:translateY(-50%) scale(1)}
.nav{flex:1;display:grid;grid-template-columns:1fr 240px 1fr;align-items:center;height:100%;transition:grid-template-columns .35s ease}
.tete.reduit .nav{grid-template-columns:1fr 8px 1fr}
.nav-g,.nav-d{display:flex;align-items:center;height:100%;gap:4px}
.nav-g{justify-content:flex-end}
.nav-d{justify-content:flex-start}
.nav-g>a,.nav-d>a,.nav .deroule>button{display:flex;align-items:center;height:40px;padding:0 15px;border-radius:999px;font:600 17px/1 var(--f-eti);letter-spacing:.07em;text-transform:uppercase;text-decoration:none;color:#e6eee4;background:none;border:0;white-space:nowrap;transition:background .2s,color .2s}
.nav-g>a:hover,.nav-d>a:hover,.nav .deroule>button:hover{background:rgba(255,255,255,.1);color:#fff}
.nav a[aria-current="page"],.nav .deroule.actif>button{background:var(--orange);color:var(--vert-n)}
.nav a.phare:not([aria-current="page"]){color:var(--orange)}
.deroule{position:relative;display:flex;align-items:center;height:100%}
.deroule>button::after{content:"";width:6px;height:6px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg) translate(-2px,-2px);margin-left:9px}
.sous-menu{position:absolute;left:0;top:calc(100% - 4px);min-width:320px;background:var(--blanc);border-radius:14px;padding:8px;box-shadow:var(--ombre);visibility:hidden;opacity:0;transform:translateY(8px);transition:.2s}
.deroule:hover .sous-menu,.deroule:focus-within .sous-menu,.deroule.ouvert .sous-menu{visibility:visible;opacity:1;transform:none}
.sous-menu a{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:10px;text-decoration:none;font:600 17px/1.2 var(--f-eti);letter-spacing:.05em;text-transform:uppercase;color:var(--vert-n);transition:background .2s}
.sous-menu a:hover{background:var(--sauge);color:var(--orange-f)}
.sous-menu .pic{width:26px;height:26px;color:var(--orange);flex-shrink:0}
.nav-cta{position:absolute;right:var(--gout);top:50%;transform:translateY(-50%) scale(.9);opacity:0;pointer-events:none;transition:opacity .3s,transform .3s;padding:10px 18px;font-size:15px}
.tete.reduit .nav-cta{opacity:1;transform:translateY(-50%);pointer-events:auto}
.burger{display:none;width:48px;height:48px;border:0;border-radius:50%;background:var(--vert-f);position:relative}
.burger span,.burger span::before,.burger span::after{position:absolute;left:14px;right:14px;height:2px;background:#fff;content:"";transition:transform .3s,top .3s,background-color .2s}
.burger span{top:23px}.burger span::before{top:-6px;left:0;right:0}.burger span::after{top:6px;left:0;right:0}
.burger[aria-expanded="true"] span{background:transparent}
.burger[aria-expanded="true"] span::before{top:0;transform:rotate(45deg)}
.burger[aria-expanded="true"] span::after{top:0;transform:rotate(-45deg)}
.logo-mobile{display:none}

/* ── Photos ── */
.ph{position:relative;width:100%;max-width:100%;aspect-ratio:4/3;background:#C9D3C5;overflow:hidden;border-radius:var(--rayon)}
.ph>.img{position:absolute;inset:0;background:linear-gradient(135deg,#D3DCCF 0%,#AEBBAA 100%) center/cover no-repeat}
.ph.fonce>.img{background-image:linear-gradient(135deg,#2A3A2D 0%,#132016 100%)}
.ph .leg{position:absolute;left:14px;bottom:14px;display:grid;gap:2px;padding:8px 12px;border-radius:10px;background:rgba(16,26,18,.78);color:#fff;font-size:12.5px;line-height:1.35;max-width:calc(100% - 28px)}
.ph .leg span{opacity:.7;text-transform:uppercase;letter-spacing:.08em;font-size:10px}
.ph .appareil{position:absolute;top:50%;left:50%;width:46px;height:46px;transform:translate(-50%,-60%);color:rgba(255,255,255,.8)}

/* ── Héros : grande photo, titre centré (Jeunot), lisière blanche en bas ── */
.heros{position:relative;background:var(--vert-n);color:var(--blanc);overflow:hidden}
.heros .fond{position:absolute;inset:0}
.heros .fond .ph{height:100%;aspect-ratio:auto;border-radius:0}
.heros .fond::after{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at 50% 45%,rgba(16,26,18,.42) 0%,rgba(16,26,18,.72) 70%),linear-gradient(180deg,rgba(16,26,18,.3),rgba(16,26,18,.55))}
.heros .env{position:relative;z-index:1;padding-block:clamp(150px,13vw,190px) clamp(170px,15vw,220px);display:grid;justify-items:center;text-align:center;gap:20px}
.heros h1{color:var(--blanc);font-size:clamp(38px,5.4vw,68px);max-width:1100px;letter-spacing:.03em;line-height:1.1;text-wrap:pretty}
.heros h1 em{white-space:nowrap}
.heros h1 .ligne{display:inline-block}
.heros h1 em{font-style:normal;color:var(--orange)}
.heros p{font-size:clamp(17px,1.6vw,20px);color:#e6ede4;max-width:58ch}
.heros .sur-titre{color:#fff}
.heros .actions{justify-content:center;margin-top:6px}

/* ── Commande de bois dès l'accueil (Fran Façades) : carte arrondie qui chevauche le bandeau ── */
.commande-env{position:relative;z-index:5;margin-top:clamp(-150px,-11vw,-110px)}
.commande{background:var(--blanc);border-radius:24px;box-shadow:0 26px 60px rgba(16,26,18,.22);overflow:hidden}
.commande .haut{background:var(--vert);color:#e2ebe0;padding:24px 32px;display:flex;justify-content:space-between;align-items:center;gap:18px 30px;flex-wrap:wrap}
.commande .haut h2{color:#fff;font-size:clamp(26px,2.6vw,34px)}
.commande .haut .sur-titre{color:var(--orange)}
.puces{display:flex;gap:8px;flex-wrap:wrap}
.puces span{display:inline-flex;align-items:center;gap:7px;padding:8px 14px;border-radius:999px;background:rgba(255,255,255,.1);color:#fff;font:600 15px/1 var(--f-eti);letter-spacing:.05em;text-transform:uppercase;white-space:nowrap}
.puces span svg{width:16px;height:16px;color:var(--orange)}
.commande .corps{padding:28px 32px 26px}
.commande .bas{display:flex;justify-content:space-between;gap:10px 24px;flex-wrap:wrap;padding:14px 32px;background:var(--sauge);font-size:15px;color:var(--doux)}
.commande .bas b{color:var(--vert-n)}

/* ── Formulaires ── */
.form{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}
.form.quatre{grid-template-columns:repeat(4,1fr);gap:14px 16px}
.form .plein{grid-column:1/-1}
.form .deux-col{grid-column:span 2}
.form .trois-col{grid-column:span 3}
.champ{display:grid;gap:6px;align-content:start;min-width:0}
.champ label{font:600 15px/1 var(--f-eti);letter-spacing:.08em;text-transform:uppercase;color:var(--vert-n)}
.champ label i{color:var(--orange-f);font-style:normal}
.champ input,.champ select,.champ textarea{width:100%;padding:13px 15px;border:1.5px solid #CFD8CB;border-radius:12px;background:#FBFCFA;color:var(--texte);font:400 16px/1.3 var(--f-texte);appearance:none;transition:border-color .2s,box-shadow .2s,background .2s}
.champ select{background-image:linear-gradient(45deg,transparent 50%,var(--vert-n) 50%),linear-gradient(135deg,var(--vert-n) 50%,transparent 50%);background-position:calc(100% - 20px) 50%,calc(100% - 14px) 50%;background-size:6px 6px;background-repeat:no-repeat;padding-right:36px}
.champ textarea{min-height:100px;resize:vertical}
.champ input:focus,.champ select:focus,.champ textarea:focus{outline:none;border-color:var(--orange);background:#fff;box-shadow:0 0 0 4px rgba(225,129,51,.18)}
.champ .err{color:#B3261E;font-size:13px}
.champ.ko input,.champ.ko select{border-color:#B3261E}
.champ .aide{font-size:13.5px;color:var(--doux);line-height:1.4}
.consent{display:grid;grid-template-columns:22px 1fr;gap:8px;font-size:14px;color:var(--doux);align-items:start}
.ligne-envoi{grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;gap:14px 28px;flex-wrap:wrap;padding-top:18px;margin-top:4px;border-top:1px solid var(--trait)}
.ligne-envoi .consent{margin:0;align-items:center}
.ligne-envoi .btn{min-width:240px}
.consent input{width:18px;height:18px;margin-top:2px;accent-color:var(--orange)}
.ok-envoi{grid-column:1/-1;padding:20px 22px;border-radius:14px;background:var(--vert-c);color:var(--vert-n);line-height:1.55}
.ok-envoi b{color:var(--vert)}
.form .envoi{display:flex;align-items:end}
.form .envoi .btn{width:100%}
.stere{display:grid;grid-template-columns:46px 1fr 46px;align-items:center;gap:4px;padding:4px;border:1.5px solid #CFD8CB;border-radius:999px;background:#FBFCFA}
.stere button{width:38px;height:38px;border:0;border-radius:50%;background:var(--vert-c);color:var(--vert-n);font:600 22px/1 var(--f-texte);justify-self:center;transition:background .2s,color .2s}
.stere button:hover{background:var(--orange);color:#fff}
.stere .val{display:flex;align-items:center;justify-content:center;gap:6px}
.champ .stere input{border:0;background:none;width:4ch;padding:6px 0;text-align:right;font:700 21px/1 var(--f-eti)!important;color:var(--vert-n);box-shadow:none;-moz-appearance:textfield}
.champ .stere input::-webkit-outer-spin-button,.champ .stere input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.stere .unite{font:600 15px/1 var(--f-eti);letter-spacing:.06em;text-transform:uppercase;color:var(--doux)}
.stere:focus-within{border-color:var(--orange);box-shadow:0 0 0 4px rgba(225,129,51,.18)}
/* quantité mise en avant (commande de bois) */
.qte-avant{grid-column:1/-1;display:grid;grid-template-columns:1fr auto auto;grid-template-areas:"texte raccourcis compteur";align-items:center;gap:14px 26px;padding:18px 22px;border-radius:18px;background:var(--orange-c);border:2px solid #F6C9A0}
.qte-avant .qte-texte{grid-area:texte}.qte-avant .raccourcis{grid-area:raccourcis}.qte-avant .stere.grand{grid-area:compteur}
.qte-avant .qte-texte{display:grid;gap:5px;min-width:0}
.qte-avant label{white-space:nowrap;font:700 24px/1.1 var(--f-titre);-webkit-text-stroke:.045em currentColor;font-size-adjust:.74;letter-spacing:0;text-transform:none;color:var(--vert-n)}
.qte-avant .aide{font-size:14.5px;color:#6E5A48}
.raccourcis{display:flex;gap:8px;flex-wrap:wrap}
.raccourcis button{padding:10px 14px;border-radius:999px;border:1.5px solid #EDB27E;background:#fff;color:var(--vert-n);font:700 15px/1 var(--f-eti);letter-spacing:.05em;text-transform:uppercase;transition:background .2s,color .2s,border-color .2s}
.raccourcis button:hover{border-color:var(--orange)}
.raccourcis button[aria-pressed="true"]{background:var(--vert);border-color:var(--vert);color:#fff}
.stere.grand{grid-template-columns:58px minmax(130px,auto) 58px;padding:5px;background:#fff;border:2px solid var(--orange)}
.stere.grand button{width:50px;height:50px;font-size:28px;background:var(--orange);color:var(--vert-n)}
.stere.grand button:hover{background:var(--vert);color:#fff}
.champ .stere.grand input{font-size:34px!important;width:3.4ch}
.stere.grand .unite{font-size:18px;color:var(--vert-n)}
.aide.france{display:none;color:var(--orange-f)!important;font-weight:600}
.aide.france.on{display:block}
.champ-bois[hidden]{display:none!important}

/* ── Points forts (Jeunot) ── */
.forts{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(20px,3vw,40px)}
.fort{display:grid;justify-items:center;text-align:center;gap:12px;padding:8px}
.fort .ic{width:86px;height:86px;border-radius:50%;display:grid;place-items:center;background:var(--vert-c);color:var(--vert);box-shadow:0 0 0 8px #fff,0 0 0 9px var(--trait);transition:transform .35s,background .3s,color .3s}
.fort:hover .ic{transform:rotate(-8deg) scale(1.05);background:var(--orange);color:#fff}
.fort .ic svg{width:38px;height:38px}
.fort h3{font-size:25px;margin-top:8px}
.fort p{color:var(--doux);max-width:32ch}

/* ── Cartes services qui se retournent (le « mouvement » des services Alonso demandé par le client) ── */
.intro{display:grid;grid-template-columns:1fr 1fr;gap:24px 64px;align-items:end;margin-bottom:40px}
.intro h2{font-size:clamp(32px,4vw,48px)}
.intro p{color:var(--doux)}
.flips{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.flips.trois{grid-template-columns:repeat(3,1fr)}
.flip{perspective:1400px;height:420px;text-decoration:none;display:block}
.flip .int{position:relative;height:100%;transition:transform .8s cubic-bezier(.3,.7,.2,1);transform-style:preserve-3d}
.flip:hover .int,.flip:focus-visible .int,.flip.tourne .int{transform:rotateY(180deg)}
.flip .face,.flip .dos{position:absolute;inset:0;backface-visibility:hidden;-webkit-backface-visibility:hidden;display:flex;flex-direction:column;justify-content:flex-end;padding:26px;overflow:hidden;border-radius:22px}
.flip .face .ph{position:absolute;inset:0;aspect-ratio:auto;height:100%;border-radius:0}
.flip .face::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(16,26,18,.92) 0%,rgba(16,26,18,.1) 58%)}
.flip .face>*:not(.ph){position:relative;z-index:1}
.flip .face .pic-rond{position:absolute;top:20px;left:20px;width:56px;height:56px;border-radius:50%;background:#fff;color:var(--vert);display:grid;place-items:center;z-index:1}
.flip .face .pic-rond .pic{width:30px;height:30px}
.flip .face h3{color:var(--blanc);font-size:27px}
.flip .face .eti{margin-top:8px;font:600 14px/1.2 var(--f-eti);letter-spacing:.1em;text-transform:uppercase;color:var(--orange)}
.flip .dos{background:#fff;border:2px solid var(--trait);color:var(--texte);transform:rotateY(180deg);justify-content:center;gap:14px}
.flip .dos .pic{width:44px;height:44px;color:var(--orange)}
.flip .dos h3{font-size:26px}
.flip .dos p{font-size:16px;line-height:1.55;color:var(--doux)}
.flip .dos>span{display:inline-flex;align-self:flex-start;align-items:center;gap:8px;padding:11px 18px;border-radius:999px;background:var(--vert);color:#fff;font:700 15px/1 var(--f-eti);letter-spacing:.08em;text-transform:uppercase}

/* ── Deux colonnes texte / photo ── */
.deux{display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,6vw,80px);align-items:center}
.deux .texte{display:grid;gap:18px;min-width:0}
.deux .texte h2{font-size:clamp(30px,3.8vw,46px)}
.deux .texte p{color:var(--doux)}
.deux .texte p strong{color:var(--vert-n);font-weight:700}
.deux .texte p a{color:var(--orange-f);font-weight:600;text-decoration:underline;text-underline-offset:3px}
.deux .texte .actions{margin-top:8px}
.photo-cadre{position:relative}
.photo-cadre .ph{box-shadow:var(--ombre)}
.photo-cadre.portrait .ph{aspect-ratio:4/5}
.badge{position:absolute;right:-14px;bottom:-14px;width:148px;height:148px;border-radius:50%;background:var(--orange);color:var(--vert-n);display:grid;place-content:center;text-align:center;gap:2px;box-shadow:0 0 0 8px #fff,var(--ombre);transform:rotate(-8deg)}
.badge b{font:700 30px/1 var(--f-titre);-webkit-text-stroke:.045em currentColor;font-size-adjust:.74;white-space:nowrap}
.badge span{font:600 13px/1.2 var(--f-eti);letter-spacing:.06em;text-transform:uppercase}
.coches{list-style:none;margin:4px 0 0;padding:0;display:grid;gap:10px}
.coches li{display:grid;grid-template-columns:28px 1fr;gap:12px;align-items:center;font-weight:600;color:var(--vert-n);line-height:1.4}
.coches li::before{content:"";width:28px;height:28px;border-radius:50%;background:var(--vert-c) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232C5428' stroke-width='3'%3E%3Cpath d='m5 12 5 5 9-10'/%3E%3C/svg%3E") center/15px no-repeat}
.essences{display:flex;gap:8px;flex-wrap:wrap}
.essences span{padding:9px 16px;border-radius:999px;background:var(--orange-c);color:var(--orange-f);font:700 16px/1 var(--f-eti);letter-spacing:.08em;text-transform:uppercase}

/* ── Parcours (2020, 2021, 2023) ── */
.frise{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;position:relative;margin-top:8px}
.frise::before{content:"";position:absolute;left:30px;right:30px;top:30px;border-top:2px dashed var(--trait)}
.frise>div{position:relative;display:grid;gap:8px;align-content:start;justify-items:start}
.frise .an{position:relative;display:grid;place-items:center;min-width:60px;height:60px;padding:0 12px;border-radius:999px;background:var(--vert);color:#fff;font:700 20px/1 var(--f-eti);letter-spacing:.04em;box-shadow:0 0 0 6px var(--sauge)}
.sec:not(.sauge) .frise .an{box-shadow:0 0 0 6px #fff}
.frise>div:last-child .an{background:var(--orange);color:var(--vert-n)}
.frise h3{font-size:21px;margin-top:6px}
.frise p{color:var(--doux);font-size:15.5px}
.frise.mini{grid-template-columns:repeat(3,1fr)}
.frise.mini .an{height:46px;min-width:46px;font-size:17px}
.frise.mini::before{top:23px}
.frise.mini h3{font-size:17px}
.frise.mini>div:last-child .an{background:var(--vert);color:#fff}

/* ── Carrousel des réalisations ── */
.carrousel{position:relative}
.carrousel .piste{display:grid;grid-auto-flow:column;grid-auto-columns:calc((100% - 3*18px)/4);gap:18px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;padding-bottom:4px}
.carrousel .piste::-webkit-scrollbar{display:none}
.carrousel figure{margin:0;display:grid;gap:12px;scroll-snap-align:start;align-content:start}
.carrousel .ph{aspect-ratio:4/5}
.carrousel figcaption{font:700 18px/1.25 var(--f-titre);-webkit-text-stroke:.045em currentColor;font-size-adjust:.74;color:var(--vert-n);padding-inline:4px}
.carrousel figcaption small{display:block;font:600 13px/1.2 var(--f-eti);letter-spacing:.12em;text-transform:uppercase;color:var(--orange-f);margin-bottom:4px}
.nav-car{display:flex;justify-content:center;gap:12px;margin-top:26px}
.nav-car button{width:54px;height:54px;border-radius:50%;border:2px solid var(--vert);background:#fff;color:var(--vert);display:grid;place-items:center;transition:background .2s,color .2s}
.nav-car button:hover:not(:disabled){background:var(--vert);color:#fff}
.nav-car button:disabled{opacity:.3;cursor:default}
.nav-car svg{width:22px;height:22px}

/* ── Zone d'intervention + carte ── */
.zones{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(32px,5vw,64px);align-items:center}
.zone-choix{display:grid;gap:12px;margin-top:6px}
.zone-choix button{display:grid;grid-template-columns:48px 1fr;gap:14px;align-items:center;text-align:left;padding:14px 18px;border-radius:16px;background:#fff;border:2px solid var(--trait);color:var(--texte);transition:border-color .2s,box-shadow .2s,background .2s}
.zone-choix button:hover{box-shadow:var(--ombre-l)}
.zone-choix button[aria-pressed="true"]{border-color:var(--vert);background:var(--vert);color:#dbe6d8}
.zone-choix .ic{width:48px;height:48px;border-radius:50%;display:grid;place-items:center;background:var(--vert-c);color:var(--vert)}
.zone-choix button[aria-pressed="true"] .ic{background:var(--orange);color:var(--vert-n)}
.zone-choix .ic svg{width:24px;height:24px}
.zone-choix b{display:block;font:700 20px/1.15 var(--f-titre);-webkit-text-stroke:.045em currentColor;font-size-adjust:.74;color:var(--vert-n);margin-bottom:2px}
.zone-choix button[aria-pressed="true"] b{color:#fff}
.zone-choix small{font-size:15px;line-height:1.4}
.zone-france{display:flex;gap:12px;align-items:center;padding:14px 18px;border-radius:16px;background:var(--orange-c);color:var(--vert-n);font-size:15.5px;line-height:1.4}
.zone-france svg{width:28px;height:28px;color:var(--orange-f);flex-shrink:0}
.carte-zones{background:#fff;border-radius:24px;box-shadow:var(--ombre);position:relative;min-width:0;overflow:hidden}
.carte-zones svg{display:block;width:100%;height:auto}
.carte-zones .c-fond{fill:#EEF1EC;stroke:#FFFFFF;stroke-width:.8}
.carte-zones .c-zone{fill:#CFE0CA;stroke:#FFFFFF;stroke-width:.8;transition:fill .35s}
.carte-zones .c-voisins{fill:#F8F9F7;stroke:#D7DCD4;stroke-width:1.2}
.carte-zones .c-doubs{fill:none;stroke:#93A091;stroke-width:1.8}
.carte-zones .c-suisse{fill:#FBFBFA}
.carte-zones .c-pays{font:600 18px var(--f-eti);letter-spacing:.32em;fill:#AEB8AC}
.carte-zones .c-cercle{fill:none;stroke:var(--vert);stroke-width:3;stroke-dasharray:10 8;transition:opacity .35s}
.carte-zones .c-bois{fill:none;stroke:var(--orange);stroke-width:7;stroke-linecap:round;stroke-linejoin:round;opacity:0;transition:opacity .35s}
.carte-zones .c-ville .c-point{fill:var(--vert-n);stroke:#fff;stroke-width:2.5;transition:fill .2s,stroke-width .2s}
.carte-zones .c-ville{cursor:pointer;outline:none}
.carte-zones .c-cible{fill:transparent}
.carte-zones .c-ville:hover .c-point,.carte-zones .c-ville:focus-visible .c-point,.carte-zones .c-ville.choisie .c-point{fill:var(--orange);stroke-width:4}
.carte-zones .c-ville:hover text,.carte-zones .c-ville:focus-visible text,.carte-zones .c-ville.choisie text{fill:var(--orange-f)}
.carte-zones .c-ville.choisie{opacity:1!important}
.carte-zones .c-ville text{font:700 20px var(--f-eti);letter-spacing:.05em;fill:var(--vert-n);paint-order:stroke;stroke:#fff;stroke-width:5px;stroke-linejoin:round}
.carte-zones .c-ville.depot .c-point{fill:var(--orange)}
.carte-zones .c-ville.depot text{fill:var(--orange-f);font-size:23px}
.carte-zones .c-ville.bout{opacity:.35;transition:opacity .35s}
.carte-zones .c-km{font:700 19px var(--f-eti);letter-spacing:.06em;fill:var(--vert);paint-order:stroke;stroke:#fff;stroke-width:5px}
.carte-zones.bois .c-zone{fill:#E7ECE4}
.carte-zones.bois .c-cercle{opacity:.18}
.carte-zones.bois .c-km{opacity:0}
.carte-zones.bois .c-bois{opacity:.85}
.carte-zones.bois .c-ville.bout{opacity:1}
.carte-zones.bois .c-ville.bout .c-point{fill:var(--orange)}
.ville-info{position:absolute;right:16px;bottom:30px;z-index:3;width:min(330px,calc(100% - 32px));background:#fff;border-radius:18px;box-shadow:var(--ombre);padding:18px 20px;display:grid;gap:8px;animation:apparaitre .25s ease both}
.ville-info .vi-nom{font:700 24px/1.1 var(--f-titre);-webkit-text-stroke:.045em currentColor;font-size-adjust:.74;color:var(--vert-n);padding-right:36px}
.ville-info small{font:600 13px/1.2 var(--f-eti);letter-spacing:.1em;text-transform:uppercase;color:var(--orange-f)}
.ville-services{list-style:none;margin:2px 0 4px;padding:0;display:grid;gap:6px;font-size:15.5px}
.ville-services li{display:grid;grid-template-columns:24px 1fr;gap:8px;align-items:center}
.ville-services li::before{content:"";width:24px;height:24px;border-radius:50%;background:var(--vert-c) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232C5428' stroke-width='3'%3E%3Cpath d='m5 12 5 5 9-10'/%3E%3C/svg%3E") center/13px no-repeat}
.ville-services li.non{color:var(--doux)}
.ville-services li.non::before{background:#EEF0EC url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%235D6A60' stroke-width='3'%3E%3Cpath d='M6 12h12'/%3E%3C/svg%3E") center/13px no-repeat}
.ville-info .actions .btn{padding:11px 16px;font-size:15px}
.fermer-ville{position:absolute;top:12px;right:12px;width:34px;height:34px;border:0;border-radius:50%;background:var(--sauge);color:var(--vert-n);font:400 22px/1 var(--f-texte)}
.fermer-ville:hover{background:var(--orange)}
.villes-titre{margin-top:18px;font:600 15px/1.2 var(--f-eti);letter-spacing:.1em;text-transform:uppercase;color:var(--vert-n)}
.villes-liste{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.villes-liste button{padding:9px 14px;border-radius:999px;border:1.5px solid var(--trait);background:#fff;color:var(--vert-n);font:600 15px/1 var(--f-eti);letter-spacing:.05em;text-transform:uppercase;transition:background .2s,color .2s,border-color .2s}
.villes-liste button:hover{border-color:var(--orange);color:var(--orange-f)}
.villes-liste button[aria-pressed="true"]{background:var(--orange);border-color:var(--orange);color:var(--vert-n)}
.carte-zones .credit{position:absolute;right:12px;bottom:8px;font-size:10px;color:#8d988b}

/* ── Engagé localement ── */
.soutiens{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.soutien{background:#fff;border-radius:20px;padding:28px 24px;display:grid;gap:10px;align-content:start;justify-items:center;text-align:center;box-shadow:var(--ombre-l);transition:transform .3s,box-shadow .3s}
.soutien:hover{transform:translateY(-5px);box-shadow:var(--ombre)}
.soutien .ic{width:72px;height:72px;border-radius:50%;display:grid;place-items:center;background:var(--vert-c);color:var(--vert)}
.soutien .ic svg{width:32px;height:32px}
.soutien h3{font-size:21px}
.soutien p{color:var(--doux);font-size:15.5px}
.soutien small{font:600 12px/1 var(--f-eti);letter-spacing:.12em;text-transform:uppercase;color:#8d988b}

/* ── Appel final : bande verte sous une lisière ── */
.appel{position:relative;background:var(--vert);color:#e2ebe0}
.appel .env{padding-block:64px 72px;display:grid;justify-items:center;text-align:center;gap:16px}
.appel h2{color:var(--blanc);font-size:clamp(32px,4.2vw,48px)}
.appel p{font-size:19px;max-width:56ch}
.appel .actions{justify-content:center;margin-top:8px}

/* ── Bandeau des pages internes ── */
.bandeau{position:relative;background:var(--vert-n);overflow:hidden}
.bandeau .fond{position:absolute;inset:0}
.bandeau .fond .ph{height:100%;aspect-ratio:auto;border-radius:0}
.bandeau .fond::after{content:"";position:absolute;inset:0;background:rgba(16,26,18,.66)}
.bandeau .env{position:relative;z-index:1;padding-block:clamp(130px,11vw,160px) clamp(70px,7vw,100px);text-align:center;display:grid;gap:14px;justify-items:center}
.bandeau h1{color:var(--blanc);font-size:clamp(36px,5vw,60px);max-width:1100px;letter-spacing:.03em;line-height:1.1}
.bandeau p{color:#e0e9de;max-width:62ch;font-size:18px}
.ariane{display:flex;gap:8px;flex-wrap:wrap;justify-content:center;font:600 15px/1 var(--f-eti);letter-spacing:.1em;text-transform:uppercase;color:#b8c6bb}
.ariane a{text-decoration:none;color:var(--blanc)}.ariane a:hover{color:var(--orange)}
.ariane b{color:var(--orange);font-weight:600}

/* ── Prestations (pages services) ── */
.presta{display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,6vw,80px);align-items:center;padding-block:clamp(40px,5vw,64px);scroll-margin-top:120px}
.presta:nth-child(even) .photo-cadre{order:2}
.presta .texte{display:grid;gap:16px;min-width:0}
.presta h2{font-size:clamp(28px,3.4vw,40px)}
.presta p{color:var(--doux)}
.presta .actions{margin-top:6px}

/* ── Cartes d'information ── */
.cartes{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.cartes.cinq{grid-template-columns:repeat(5,1fr);gap:14px}
.cartes.deux-c{grid-template-columns:1fr 1fr}
.carte-i{background:#fff;border-radius:20px;padding:28px 26px;display:grid;gap:12px;align-content:start;box-shadow:var(--ombre-l);min-width:0}
.sec:not(.sauge) .carte-i{background:var(--sauge);box-shadow:none}
.carte-i .ic{width:56px;height:56px;border-radius:50%;display:grid;place-items:center;background:var(--vert);color:#fff}
.carte-i .ic svg{width:27px;height:27px}
.carte-i h3{font-size:23px}
.carte-i p{color:var(--doux);font-size:16px}
.carte-i .gros{font:700 52px/1 var(--f-titre);-webkit-text-stroke:.045em currentColor;font-size-adjust:.74;color:var(--orange-f)}
.carte-i .gros small{font:700 22px/1 var(--f-eti);letter-spacing:.06em;text-transform:uppercase;margin-left:6px}
.carte-i.orange{background:var(--orange-c)}
.carte-i.orange .ic{background:var(--orange);color:var(--vert-n)}
.etape .num{display:inline-grid;place-items:center;justify-self:start;height:34px;padding:0 14px;border-radius:999px;background:var(--vert-c);font:700 15px/1 var(--f-eti);letter-spacing:.12em;text-transform:uppercase;color:var(--vert)}
.materiel{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.machine{display:grid;grid-template-columns:62px 1fr;gap:16px;align-items:center;padding:18px 20px;border-radius:18px;background:var(--sauge)}
.machine .ic{width:62px;height:62px;border-radius:50%;display:grid;place-items:center;background:#fff;color:var(--vert)}
.machine .ic svg{width:32px;height:32px}
.machine b{display:block;font:700 20px/1.2 var(--f-titre);-webkit-text-stroke:.045em currentColor;font-size-adjust:.74;color:var(--vert-n)}
.machine small{color:var(--doux);font-size:14.5px}

/* ── Avant / après ── */
.av{position:relative;aspect-ratio:16/8;max-width:100%;overflow:hidden;user-select:none;touch-action:pan-y;border-radius:24px;box-shadow:var(--ombre)}
.av .ph{position:absolute;inset:0;aspect-ratio:auto;height:100%;border-radius:0}
.av .apres{position:absolute;inset:0;clip-path:inset(0 0 0 var(--p,50%))}
.av .poignee{position:absolute;top:0;bottom:0;left:var(--p,50%);width:4px;margin-left:-2px;background:var(--blanc);pointer-events:none}
.av .poignee::after{content:"";position:absolute;top:50%;left:50%;width:58px;height:58px;border-radius:50%;transform:translate(-50%,-50%);background:var(--orange) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23101A12'%3E%3Cpath d='M9 6 3 12l6 6zM15 6l6 6-6 6z'/%3E%3C/svg%3E") center/26px no-repeat;box-shadow:0 0 0 5px #fff}
.av input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:ew-resize;margin:0}
.av .tag{position:absolute;top:18px;font:700 16px/1 var(--f-eti);letter-spacing:.12em;text-transform:uppercase;padding:9px 16px;border-radius:999px;background:var(--vert-n);color:#fff;pointer-events:none}
.av .tag.g{left:18px}.av .tag.d{right:18px;background:var(--orange);color:var(--vert-n)}

/* ── Réalisations ── */
.filtres{display:flex;gap:6px;padding:6px;border-radius:999px;background:#fff;border:1px solid var(--trait);box-shadow:var(--ombre-l);overflow-x:auto;scrollbar-width:none;margin-bottom:28px;position:sticky;top:calc(env(safe-area-inset-top,0px) + 74px);z-index:15}
.filtres a{flex:1 0 auto;display:flex;align-items:center;justify-content:center;gap:8px;padding:11px 16px;border-radius:999px;color:var(--vert-n);font:600 16px/1 var(--f-eti);letter-spacing:.06em;text-transform:uppercase;text-decoration:none;white-space:nowrap;transition:background .2s,color .2s}
.filtres a:hover{background:var(--sauge)}
.filtres a[aria-pressed="true"]{background:var(--vert);color:#fff}
.filtres .pic{width:20px;height:20px;color:var(--orange)}
.galerie{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.galerie figure{margin:0;position:relative;overflow:hidden;border-radius:var(--rayon)}
.galerie .ph{aspect-ratio:4/3;transition:transform .5s}
.galerie figure:hover .ph{transform:scale(1.05)}
.galerie figcaption{position:absolute;left:0;right:0;bottom:0;padding:18px;background:linear-gradient(0deg,rgba(16,26,18,.9),transparent);color:#fff;display:grid;gap:4px}
.galerie figcaption b{font:700 20px/1.2 var(--f-titre);-webkit-text-stroke:.045em currentColor;font-size-adjust:.74}
.galerie figcaption em{font-style:normal;justify-self:start;background:var(--orange);color:var(--vert-n);font:700 12px/1 var(--f-eti);letter-spacing:.1em;text-transform:uppercase;padding:6px 10px;border-radius:999px}
.galerie .ph .leg{display:none}
.vide{grid-column:1/-1;text-align:center;padding:44px 20px;border:2px dashed var(--trait);border-radius:20px;color:var(--doux)}

/* ── FAQ ── */
.faq-env{max-width:960px}
.faq{display:grid;gap:12px}
.faq details{border-radius:16px;background:var(--sauge)}
.faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;gap:16px;align-items:center;padding:18px 22px;font:700 20px/1.25 var(--f-titre);-webkit-text-stroke:.045em currentColor;font-size-adjust:.74;color:var(--vert-n)}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";flex-shrink:0;width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:var(--vert);color:#fff;font:400 22px/1 var(--f-texte)}
.faq details[open] summary::after{content:"–";background:var(--orange);color:var(--vert-n)}
.faq details p{padding:0 22px 20px;color:var(--doux);max-width:75ch}

/* ── Contact ── */
.contact{display:grid;grid-template-columns:1.3fr .7fr;gap:36px;align-items:start}
.coord{background:var(--vert-f);color:#d6e1d4;padding:32px;border-radius:24px;display:grid;gap:20px}
.coord h3{color:#fff;font-size:27px}
.coord .ligne{display:grid;grid-template-columns:46px 1fr;gap:14px;align-items:center;min-width:0}
.coord .ligne .ic{width:46px;height:46px;border-radius:50%;background:var(--orange);display:grid;place-items:center;color:var(--vert-n)}
.coord .ligne .ic svg{width:19px;height:19px}
.coord .ligne small{display:block;font:600 13px/1 var(--f-eti);letter-spacing:.12em;text-transform:uppercase;color:#a6bba9;margin-bottom:5px}
.coord .ligne a{text-decoration:none;color:#fff;word-break:break-word}.coord .ligne a:hover{color:var(--orange)}

/* ── Pied de page : lisière, logo rond au centre ── */
.pied{position:relative;background:var(--vert-n);color:#bfcdc1;padding-block:64px 0}
.pied .logo-pied{display:block;width:132px;height:132px;margin:0 0 18px;border-radius:50%;background:#fff;padding:6px}
.pied .logo-pied img{width:100%;height:100%;border-radius:50%;display:block}
.pied .slogan{max-width:34ch;font-size:15.5px;line-height:1.6}
.pied .grille{display:grid;grid-template-columns:1.25fr 1fr 1fr 1.3fr;gap:36px}
.pied h4{font:700 15px/1 var(--f-eti);letter-spacing:.16em;text-transform:uppercase;color:var(--orange);margin-bottom:16px}
.pied ul{list-style:none;margin:0;padding:0;display:grid;gap:9px;font-size:16px}
.pied ul a{text-decoration:none;transition:color .2s}
.pied ul a:hover{color:#fff}
.pied-coord{display:grid;gap:12px}
.pied-coord a,.pied-coord div{display:flex;align-items:center;gap:12px;text-decoration:none;line-height:1.35}
.pied-coord .ic{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;background:#1E2C21;color:var(--orange);flex-shrink:0}
.pied-coord .ic svg{width:16px;height:16px}
.pied-coord b{display:block;font:600 14px/1.1 var(--f-eti);letter-spacing:.08em;text-transform:uppercase;color:#fff;margin-bottom:2px}
.pied-coord small{font-size:14px;word-break:break-word}
.pied .bas{margin-top:44px;padding-block:18px;padding-right:320px;border-top:1px solid #253428;display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;font-size:13.5px;color:#93a497}
.pied .bas b{color:#fff}
.pied .bas .coeur{color:var(--orange)}
.pied .bas .legal{display:flex;gap:20px;flex-wrap:wrap}
.pied .bas .legal a{text-decoration:none}
.pied .bas .legal a:hover{color:var(--orange)}

/* ── Bouton flottant (encart « Obtenir un devis » de Jeunot) + fenêtre devis ── */
.flottant{position:fixed;right:24px;bottom:calc(36px + env(safe-area-inset-bottom,0px));z-index:60;display:flex;align-items:center;gap:12px;text-align:left;padding:10px 22px 10px 10px;border-radius:999px;background:var(--orange);color:var(--vert-n);border:0;box-shadow:0 14px 30px rgba(16,26,18,.3);transition:transform .25s,background .25s}
.flottant .rond{width:44px;height:44px;border-radius:50%;background:var(--vert-n);color:#fff;display:grid;place-items:center;flex-shrink:0}
.flottant .rond svg{width:20px;height:20px}
.flottant small{display:block;font:400 13px/1.2 var(--f-texte)}
.flottant b{font:700 18px/1.1 var(--f-eti);letter-spacing:.08em;text-transform:uppercase}
.flottant:hover{transform:translateY(-3px);background:#F09450}
.fenetre{position:fixed;inset:0;z-index:80;display:grid;place-items:center;padding:20px;background:rgba(16,26,18,.66);overflow-y:auto}
.fenetre[hidden]{display:none}
.fenetre .carte{position:relative;width:min(660px,100%);background:#fff;padding:36px;border-radius:24px;box-shadow:0 30px 80px rgba(0,0,0,.4);animation:apparaitre .3s cubic-bezier(.2,.8,.2,1) both;margin:auto}
@keyframes apparaitre{from{opacity:0;transform:translateY(24px) scale(.98)}to{opacity:1;transform:none}}
.fenetre h2{font-size:34px;margin:8px 0 10px}
.fenetre .intro-f{color:var(--doux);font-size:16px;margin-bottom:20px}
.fermer{position:absolute;top:14px;right:14px;width:44px;height:44px;border:0;border-radius:50%;background:var(--sauge);color:var(--vert-n);font:400 26px/1 var(--f-texte)}
.fermer:hover{background:var(--orange)}
.presse{margin-top:16px;font-size:15px;color:var(--doux)}
.presse b{color:var(--orange-f)}
.appel-mobile{display:none}
.retour-haut{position:fixed;right:24px;bottom:calc(112px + env(safe-area-inset-bottom,0px));z-index:59;width:48px;height:48px;border:0;border-radius:50%;background:var(--vert-f);color:#fff;display:grid;place-items:center;box-shadow:0 10px 26px rgba(0,0,0,.25);opacity:0;transform:translateY(12px);transition:opacity .3s,transform .3s,background .2s}
.retour-haut.on{opacity:1;transform:none}
.retour-haut:hover{background:var(--orange)}
.retour-haut svg{width:20px;height:20px}

/* Apparition discrète au défilement (l'élément reste visible si le script ne tourne pas) */
.cache{opacity:0;transform:translateY(18px)}
.montre{animation:apparait .7s cubic-bezier(.2,.7,.2,1) both}
@keyframes apparait{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}

/* ── Responsive ── */
@media (max-width:1240px){
  .tete-actions .btn{padding:12px 18px;font-size:15px}
  .nav{grid-template-columns:1fr 228px 1fr}
  .nav-g>a,.nav-d>a,.nav .deroule>button{padding:0 10px;font-size:15.5px}
  .flips{grid-template-columns:repeat(2,1fr)}
  .flip{height:340px}
  .form.quatre{grid-template-columns:repeat(2,1fr)}
  .form.quatre .trois-col{grid-column:1/-1}
  .qte-avant{grid-template-columns:1fr auto;grid-template-areas:"texte texte" "raccourcis compteur"}
  .cartes.cinq{grid-template-columns:repeat(3,1fr)}
  .soutiens{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:1180px) and (min-width:1061px){
  .nav-g>a,.nav-d>a,.nav .deroule>button{padding:0 8px;font-size:14.5px;letter-spacing:.05em}
}
@media (max-width:1060px){
  .tete{--h-haut:0px;top:env(safe-area-inset-top,0px)}
  .tete-haut{display:none}
  .nav-barre{background:#fff;border-top:0;border-bottom:3px solid var(--orange)}
  .nav-barre .env{height:76px;justify-content:space-between}
  .logo-mini,.nav-cta{display:none}
  .logo-mobile{display:flex;align-items:center;align-self:stretch;gap:14px;text-decoration:none}
  .logo-mobile .rond{align-self:flex-start;margin-top:8px;width:92px;height:92px;border-radius:50%;background:#fff;padding:3px;box-shadow:0 8px 20px rgba(16,26,18,.22);position:relative;z-index:2;transition:width .25s,height .25s,margin .25s}
  .menu-ouvert .logo-mobile .rond{width:60px;height:60px;margin-top:8px;box-shadow:none}
  /* en-tête de la carte de commande et intro des services : centrés quand ils passent en colonne */
  .commande .haut{flex-direction:column;text-align:center}
  .commande .haut .sur-titre,.puces{justify-content:center}
  .intro{text-align:center;justify-items:center}
  .intro .sur-titre{justify-content:center}
  .intro p{max-width:62ch}
  .logo-mobile .mot{display:grid;gap:3px;justify-items:start}
  .logo-mobile .mot img{height:46px;width:auto;display:block}
  .logo-mobile small{display:block;font:600 13px/1 "Dosis",var(--f-eti);letter-spacing:.12em;text-transform:uppercase;color:var(--vert-n)}
  .burger{display:block}
  .nav{display:none}
  .nav.ouvert{display:flex;flex-direction:column;align-items:stretch;position:fixed;top:var(--haut-menu,calc(env(safe-area-inset-top,0px) + 79px));left:0;right:0;bottom:0;background:#fff;padding:10px var(--gout) 110px;overflow-y:auto;height:auto;z-index:39;animation:menuEntre .3s cubic-bezier(.2,.8,.2,1) both}
  .nav.ouvert .nav-g,.nav.ouvert .nav-d{display:flex;flex-direction:column;align-items:stretch;height:auto;gap:0}
  .nav.ouvert .nav-place{display:none}
  .nav.ouvert a,.nav.ouvert .deroule>button{height:auto;padding:17px 4px;border-radius:0;font-size:22px;color:var(--vert-n);border-bottom:1px solid var(--trait);width:100%;justify-content:space-between}
  .nav.ouvert a[aria-current="page"]{background:none;color:var(--orange-f)}
  .nav.ouvert .deroule{flex-direction:column;align-items:stretch;height:auto}
  .nav.ouvert .sous-menu{display:none;position:static;visibility:visible;opacity:1;transform:none;box-shadow:none;min-width:0;padding:0 0 8px}
  .nav.ouvert .deroule.ouvert .sous-menu{display:block}
  .nav.ouvert .sous-menu a{font-size:18px;border-bottom:0;padding:12px 8px;justify-content:flex-start;gap:12px}
  .intro,.deux,.presta,.contact,.zones{grid-template-columns:1fr}
  .presta:nth-child(even) .photo-cadre{order:0}
  .galerie,.cartes,.materiel{grid-template-columns:1fr 1fr}
  .pied .grille{grid-template-columns:repeat(3,1fr);gap:30px 24px}
  .pied .grille>div:first-child{grid-column:1/-1;display:flex;flex-direction:column;align-items:center;text-align:center}
  .pied .slogan{max-width:52ch}
  .qte-avant{grid-template-columns:1fr;grid-template-areas:"texte" "raccourcis" "compteur"}
  .raccourcis{display:grid;grid-template-columns:repeat(4,1fr)}
  .raccourcis button{padding:11px 4px;font-size:14px}
  .stere.grand{grid-template-columns:56px 1fr 56px}
  .forts{grid-template-columns:1fr 1fr 1fr;gap:14px}
  .frise{grid-template-columns:1fr 1fr;row-gap:26px}
  .frise::before{display:none}
  .frise.mini{grid-template-columns:repeat(3,1fr)}
  /* blocs texte + photo centrés quand ils passent en colonne */
  .deux .texte,.presta .texte{text-align:center;justify-items:center}
  .deux .texte .sur-titre,.presta .texte .sur-titre,.deux .texte .actions,.presta .texte .actions,.essences{justify-content:center}
  .deux .texte .coches,.presta .texte .coches{text-align:left}
  .frise.mini::before{display:block;left:16%;right:16%}
  .frise.mini>div{justify-items:center;text-align:center}
  .photo-cadre.portrait{width:100%;max-width:420px;justify-self:center}
  .av{aspect-ratio:4/3}
  .badge{right:14px;bottom:14px;width:122px;height:122px;box-shadow:0 0 0 6px #fff,var(--ombre)}
  .badge b{font-size:25px}
  .badge span{font-size:12px}
  .filtres{top:calc(env(safe-area-inset-top,0px) + 86px)}
  .carrousel .piste{grid-auto-columns:calc((100% - 18px)/2)}
  .heros .env{padding-top:80px}
  .bandeau .env{padding-top:80px}
  input,select,textarea{font-size:16px!important}
}
@keyframes menuEntre{from{opacity:0;transform:translateY(-14px)}to{opacity:1;transform:none}}
@media (max-width:680px){
  body{font-size:16px}
  .heros .env{padding-block:56px 150px}
  .commande .haut,.commande .corps,.commande .bas{padding-inline:18px}
  .form,.form.quatre{grid-template-columns:1fr}
  .form .deux-col,.form .trois-col{grid-column:1/-1}
  .ligne-envoi .btn{width:100%;min-width:0}
  .qte-avant{grid-template-columns:1fr;grid-template-areas:"texte" "raccourcis" "compteur";padding:16px;gap:14px}
  .qte-avant label{white-space:normal}
  .raccourcis{grid-template-columns:repeat(2,1fr)}
  .ville-info{position:static;width:auto;margin:0 12px 12px;box-shadow:none;border:1.5px solid var(--trait)}
  .stere.grand{grid-template-columns:56px 1fr 56px}
  .flips,.flips.trois{grid-template-columns:1fr 1fr;gap:10px}
  .flip{height:250px}
  .flip .face,.flip .dos{padding:16px;border-radius:16px}
  .flip .face .pic-rond{width:42px;height:42px;top:12px;left:12px}
  .flip .face .pic-rond .pic{width:24px;height:24px}
  .flip .face h3,.flip .dos h3{font-size:19px}
  .flip .face .eti,.flip .dos p,.flip .dos .pic{display:none}
  .forts,.galerie,.cartes,.cartes.cinq,.cartes.deux-c,.materiel,.soutiens,.frise,.pied .grille{grid-template-columns:1fr}
  .frise.mini{grid-template-columns:repeat(3,1fr);gap:10px}
  .frise.mini h3{font-size:15px}
  .carrousel .piste{grid-auto-columns:80%}
  .actions{flex-wrap:nowrap;gap:8px;width:100%}
  .actions .btn{flex:1 1 0;min-width:0;padding:13px 8px;font-size:14px;letter-spacing:.04em;white-space:normal;text-align:center}
  .fenetre .carte{padding:28px 18px}
  .flottant{right:12px;bottom:calc(18px + env(safe-area-inset-bottom,0px));padding:8px 16px 8px 8px}
  .flottant small{display:none}
  .flottant b{font-size:16px}
  .appel-mobile{display:grid;place-items:center;position:fixed;left:12px;bottom:calc(18px + env(safe-area-inset-bottom,0px));z-index:60;width:54px;height:54px;border-radius:50%;background:var(--vert-f);color:#fff;box-shadow:0 10px 26px rgba(0,0,0,.3)}
  .appel-mobile svg{width:22px;height:22px}
  .retour-haut{right:12px;bottom:calc(86px + env(safe-area-inset-bottom,0px));width:44px;height:44px}
  .pied .grille{text-align:center;gap:34px}
  .pied .grille>div{display:flex;flex-direction:column;align-items:center}
  .pied ul{justify-items:center}
  .pied-coord a,.pied-coord div{flex-direction:column;text-align:center;gap:8px}
  .pied .bas{flex-direction:column;align-items:center;text-align:center;padding-bottom:calc(146px + env(safe-area-inset-bottom,0px));padding-right:0}
  .heros .sur-titre{font-size:13px;letter-spacing:.1em;white-space:nowrap;gap:7px}
  .sauf-mobile{display:none}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important}
  .cache{opacity:1;transform:none}
  html{scroll-behavior:auto}
}

/* ── Thème WordPress ── */
.admin-bar .tete{top:calc(32px - var(--h-haut))}
@media (max-width:1060px){.admin-bar .tete{top:32px}}
@media (max-width:782px){.admin-bar .tete{top:46px}}
@media (max-width:600px){.admin-bar .tete{top:0}}
.champ-piege{position:absolute!important;left:-9999px!important;width:1px;height:1px;overflow:hidden}
#commande,#zone{scroll-margin-top:90px}
.form .envoi-ok{grid-column:1/-1}
.btn[disabled]{opacity:.6;cursor:wait}
.erreur-envoi{grid-column:1/-1;padding:14px 18px;border-radius:12px;background:#FDECEA;color:#8C1D18;font-weight:600}
.page-texte{max-width:860px}
.page-texte h2{font-size:clamp(28px,3vw,36px);margin:34px 0 12px}
.page-texte p,.page-texte li{color:var(--doux)}
.page-texte a{color:var(--orange-f)}
.filtres button{flex:1 0 auto;display:flex;align-items:center;justify-content:center;gap:8px;padding:11px 16px;border-radius:999px;border:0;background:none;color:var(--vert-n);font:600 16px/1 var(--f-eti);letter-spacing:.06em;text-transform:uppercase;white-space:nowrap;transition:background .2s,color .2s}
.filtres button:hover{background:var(--sauge)}
.filtres button[aria-pressed="true"]{background:var(--vert);color:#fff}
.galerie figure[hidden]{display:none}
.retour-envoi{margin:18px auto;width:min(var(--large),calc(100% - 32px))}
/* Photo à la hauteur du texte (présentation, pages communes) */
.photo-cadre.pleine{align-self:stretch;display:flex}
.photo-cadre.pleine .ph{aspect-ratio:auto;height:100%;min-height:340px}
@media (max-width:1060px){.photo-cadre.pleine{display:block}.photo-cadre.pleine .ph{aspect-ratio:4/3;height:auto;min-height:0}}
/* Fiche d'une commune sur la carte : boutons sur une ligne, lien vers la page de la commune */
.ville-info{width:min(410px,calc(100% - 32px))}
.ville-info a.vi-nom{text-decoration:none}
.ville-info a.vi-nom:hover{color:var(--orange-f)}
.ville-info .actions{flex-wrap:nowrap;gap:8px}
.ville-info .actions .btn{flex:1 1 auto;padding:10px 12px;font-size:13.5px;letter-spacing:.05em;white-space:nowrap}
.ville-info .vi-lien{justify-self:start;margin-top:2px;font:600 14px/1.3 var(--f-eti);letter-spacing:.06em;text-transform:uppercase;color:var(--orange-f);text-decoration:underline;text-underline-offset:3px}
.ville-info .vi-lien:hover{color:var(--vert)}
@media (max-width:420px){.ville-info .actions{flex-wrap:wrap}}
/* Pages des communes */
.services-commune li.non{color:var(--doux);font-weight:500}
.services-commune li.non::before{background:#EEF0EC url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%235D6A60' stroke-width='3'%3E%3Cpath d='M6 12h12'/%3E%3C/svg%3E") center/15px no-repeat}
.villes-liens{display:flex;flex-wrap:wrap;justify-content:center;gap:10px}
.villes-liens a{padding:11px 18px;border-radius:999px;border:1.5px solid var(--trait);background:#fff;color:var(--vert-n);font:600 16px/1 var(--f-eti);letter-spacing:.05em;text-transform:uppercase;text-decoration:none;transition:border-color .2s,color .2s}
.villes-liens a:hover{border-color:var(--orange);color:var(--orange-f)}
/* Numéros de téléphone dans le texte : jamais coupés, cliquables */
.tel-ligne{white-space:nowrap;font-weight:700;color:var(--vert-n);text-decoration:none}
.tel-ligne:hover{color:var(--orange-f)}
.presse .tel-ligne{color:var(--orange-f)}
.pied .bas .credit-la{text-decoration:none}
.pied .bas .credit-la:hover b{color:var(--orange)}
