﻿@font-face{font-family:'Bricolage Grotesque';font-style:normal;font-weight:400 800;font-display:swap;src:url('fonts/bricolage-grotesque-400-800-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Bricolage Grotesque';font-style:normal;font-weight:400 800;font-display:swap;src:url('fonts/bricolage-grotesque-400-800-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:400;font-display:swap;src:url('fonts/ibm-plex-mono-400-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:600;font-display:swap;src:url('fonts/ibm-plex-mono-600-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:400;font-display:swap;src:url('fonts/ibm-plex-mono-400-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:600;font-display:swap;src:url('fonts/ibm-plex-mono-600-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Public Sans';font-style:italic;font-weight:400;font-display:swap;src:url('fonts/public-sans-400-italic-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Public Sans';font-style:italic;font-weight:400;font-display:swap;src:url('fonts/public-sans-400-italic-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Public Sans';font-style:normal;font-weight:400 700;font-display:swap;src:url('fonts/public-sans-400-700-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Public Sans';font-style:normal;font-weight:400 700;font-display:swap;src:url('fonts/public-sans-400-700-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}

:root{
    --nuit:#13171a;--nuit-2:#1c2226;--nuit-3:#252d31;
    --papier:#f7f5f1;--papier-2:#efebe4;--carte:#fffefb;
    --encre:#161a17;--encre-2:#4a514b;--encre-3:#6d746e;
    --vert:#1f5132;--vert-2:#2c6b43;
    --ambre:#c07524;--ambre-c:#e5a55c;
    --ligne:#dcd7cd;--ligne-2:#c4beb2;
    --disp:'Bricolage Grotesque',Georgia,serif;
    --corps:'Public Sans',system-ui,sans-serif;
    --mono:'IBM Plex Mono',ui-monospace,monospace;
    --w:min(1300px,100% - clamp(24px,6vw,116px));
    --wt:min(780px,100% - clamp(24px,6vw,116px));
    --h-haut:30px;--h-bas:62px;
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
body{background:var(--papier);color:var(--encre);font-family:var(--corps);
    font-size:clamp(1rem,calc(.97rem + .18vw),1.1rem);line-height:1.66;
    -webkit-font-smoothing:antialiased;overflow-x:hidden}
img{display:block;max-width:100%;height:auto}
a{color:inherit}
:focus-visible{outline:2px solid var(--ambre);outline-offset:3px}
.w{width:var(--w);margin-inline:auto}
.wt{width:var(--wt);margin-inline:auto}
h1,h2,h3{font-family:var(--disp);font-weight:800;letter-spacing:-.035em;line-height:1;text-wrap:balance}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.mono{font-family:var(--mono);font-size:.69rem;letter-spacing:.17em;text-transform:uppercase;font-weight:600}

.btn{display:inline-flex;align-items:center;gap:10px;font-size:.93rem;font-weight:700;text-decoration:none;
    padding:15px 26px;border:2px solid var(--ambre);background:var(--ambre);color:#fff;
    transition:background .2s,color .2s,transform .2s}
.btn:hover{background:transparent;color:var(--ambre-c);transform:translateY(-2px)}
.btn.gh{background:transparent;border-color:currentColor;color:inherit}
/* Sur le hero, le bouton fantome se posait sur la merule orangee, et son
   color:inherit lui donnait l'encre sombre du corps de page : illisible
   dans les deux cas. Fond propre et blanc explicite. */
.hero .btn.gh{background:rgba(19,23,26,.66);border-color:rgba(255,255,255,.68);
    color:#fff}
.hero .btn.gh:hover{background:var(--papier);color:var(--nuit);
    border-color:var(--papier)}
.btn.gh:hover{background:var(--papier);color:var(--nuit);border-color:var(--papier)}
.btn.sm{padding:11px 18px;font-size:.86rem}
.lien{color:var(--vert);font-weight:600;text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1.5px}
.lien:hover{color:var(--ambre)}

.bandeau .w{display:flex;align-items:center;justify-content:space-between;gap:18px}
.bandeau .q{display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.bandeau .q span{display:inline-flex;align-items:center;gap:6px;white-space:nowrap}
.bandeau .q svg{color:var(--ambre-c);flex:none}
.bandeau .z{white-space:nowrap;color:rgba(255,255,255,.55)}
.tel-h{display:inline-flex;align-items:center;gap:8px;color:var(--nuit);
    background:var(--ambre-c);font-weight:700;font-size:.9rem;padding:9px 15px;
    text-decoration:none;white-space:nowrap;transition:background .2s}
.tel-h:hover{background:#fff}

.entete-bloc{position:sticky;top:0;z-index:60}
.bandeau{background:var(--nuit-2);color:rgba(255,255,255,.68);
    border-bottom:1px solid rgba(255,255,255,.09);height:var(--h-haut);
    display:flex;align-items:center;font-size:.71rem;overflow:hidden}
.bandeau .w{flex-wrap:nowrap;min-width:0}
.bandeau .q{flex-wrap:nowrap;min-width:0;overflow:hidden}
.bandeau .z{flex:none}
.entete{background:var(--nuit);border-bottom:1px solid rgba(255,255,255,.1)}
.entete .w{display:flex;align-items:center;gap:clamp(12px,1.6vw,26px);height:var(--h-bas)}
.marque{font-family:var(--disp);font-weight:800;font-size:1.02rem;letter-spacing:-.03em;
    color:#fff;text-decoration:none;flex:none;display:flex;flex-direction:column;gap:2px}
.marque img{height:clamp(30px,3.4vw,40px);width:auto}
.marque span{display:block;font-family:var(--mono);font-size:.5rem;letter-spacing:.17em;
    text-transform:uppercase;color:rgba(255,255,255,.44)}
.hd{display:flex;align-items:center;gap:12px;margin-left:auto;flex:none}
/* Sous 400 px, le logo et le bouton telephone ne tiennent plus cote a cote :
   le numero passe en icone seule. Il reste joignable par la barre du bas, qui
   porte les deux boutons a cette largeur. */
@media(max-width:400px){
    .hd{gap:8px}
    .tel-h{padding:10px;gap:0}
    .tel-h span{position:absolute;width:1px;height:1px;overflow:hidden;
        clip-path:inset(50%);white-space:nowrap}
    .tel-h svg{width:18px;height:18px}
    .marque img{height:28px}
}

.nav-pc{display:flex;align-items:center;gap:clamp(9px,1.1vw,20px);margin-left:auto;
    flex-wrap:nowrap;min-width:0}
.nav-pc a{color:rgba(255,255,255,.84);font-size:.845rem;font-weight:500;
    text-decoration:none;padding:5px 0;border-bottom:2px solid transparent;
    white-space:nowrap;transition:color .2s,border-color .2s}
.nav-pc a:hover,.nav-pc a[aria-current]{color:#fff;border-bottom-color:var(--ambre)}

.sous-e{background:var(--nuit-3);border-bottom:1px solid rgba(255,255,255,.08)}
.sous-e .w{display:flex;align-items:center;justify-content:space-between;
    gap:18px;min-height:38px;padding:5px 0}
.nav-2{display:flex;align-items:center;gap:clamp(10px,1.4vw,24px);flex-wrap:wrap}
.nav-2 a{color:rgba(255,255,255,.6);font-size:.775rem;text-decoration:none;
    white-space:nowrap;transition:color .2s}
.nav-2 a:hover,.nav-2 a[aria-current]{color:var(--ambre-c)}

.rx-h{list-style:none;display:inline-flex;align-items:center;gap:0;margin:0;padding:0;
    border:1px solid rgba(255,255,255,.16);background:rgba(255,255,255,.04);flex:none}
.rx-h li::before{display:none}
.rx-h li+li{border-left:1px solid rgba(255,255,255,.12)}
.rx-h a{display:grid;place-items:center;width:34px;height:28px;color:rgba(255,255,255,.62);
    transition:background .2s,color .2s}
.rx-h a:hover,.rx-h a:focus-visible{background:var(--ambre);color:var(--nuit)}
.rx-h svg{width:16px;height:16px}
.rx-h span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}

.burger{display:none;align-items:center;gap:9px;background:none;
    border:1px solid rgba(255,255,255,.32);color:#fff;height:38px;padding:0 13px 0 11px;
    cursor:pointer;position:relative;font:inherit}
.burger:hover{border-color:var(--ambre-c);color:var(--ambre-c)}
.bg-i{position:relative;display:block;width:18px;height:2px;background:currentColor;
    transition:background .2s}
.bg-i::before,.bg-i::after{content:"";position:absolute;left:0;width:18px;height:2px;
    background:currentColor;transition:transform .28s ease}
.bg-i::before{top:-6px}
.bg-i::after{top:6px}
.bg-t{font-family:var(--mono);font-size:.62rem;letter-spacing:.16em;text-transform:uppercase;
    font-weight:600}
.burger[aria-expanded="true"] .bg-i{background:transparent}
.burger[aria-expanded="true"] .bg-i::before{transform:translateY(6px) rotate(45deg)}
.burger[aria-expanded="true"] .bg-i::after{transform:translateY(-6px) rotate(-45deg)}

@media(max-width:1240px){
    .nav-pc a{font-size:.79rem}
    .nav-2 a{font-size:.74rem}
}
@media(max-width:1080px){
    .nav-pc,.sous-e{display:none}
    .burger{display:inline-flex}
}
@media(max-width:1080px){.bandeau .q span:nth-child(n+4){display:none}}
@media(max-width:860px){.bandeau .q span:nth-child(n+3){display:none}}
@media(max-width:680px){.bandeau .q span:nth-child(n+2){display:none}}
@media(max-width:520px){
    .bandeau .q{display:none}
    .bandeau .w{justify-content:space-between}
    .bandeau .li{display:none}
    .bg-t{display:none}
    .burger{width:40px;padding:0;justify-content:center}
}

.fil{background:var(--papier-2);border-bottom:1px solid var(--ligne);padding:11px 0;
    font-size:.79rem;color:var(--encre-3)}
.fil ol{list-style:none;display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.fil li::after{content:"/";margin-left:8px;color:var(--ligne-2)}
.fil li:last-child::after{content:""}
.fil a{color:var(--encre-2);text-decoration:none}
.fil a:hover{color:var(--vert);text-decoration:underline}

section{padding:clamp(58px,8vw,118px) 0}
.tete{display:grid;grid-template-columns:1fr auto;gap:26px;align-items:end;
    margin-bottom:clamp(32px,4.5vw,56px);border-bottom:2px solid currentColor;padding-bottom:18px}
.tete .mono{color:var(--vert);display:block;margin-bottom:13px}
.tete h2{font-size:clamp(1.85rem,calc(1.05rem + 3.2vw),3.6rem);max-width:19ch}
.tete .intro{color:var(--encre-2);max-width:42ch;font-size:.97rem;padding-bottom:5px}
@media(max-width:880px){.tete{grid-template-columns:1fr}.tete .intro{max-width:none}}

.sombre{background:var(--nuit);color:#fff}
.sombre .tete{border-bottom-color:rgba(255,255,255,.24)}
.sombre .tete .mono{color:var(--ambre-c)}
.sombre .tete h2{color:#fff}
.sombre .tete .intro{color:rgba(255,255,255,.66)}

.hero{position:relative;min-height:calc(94svh - var(--h-bas));display:flex;align-items:flex-end;
    background:var(--nuit);overflow:hidden}
.hero-img{position:absolute;inset:0}
.hero-img img{width:100%;height:100%;object-fit:cover;opacity:.42}
/* La photo du hero est une merule en fructification : de l'orange vif en
   pleine bande mediane, ou se posent le chapo et les deux boutons. Le palier
   central du voile est donc renforce, et une passe horizontale assombrit la
   colonne de texte sur grand ecran sans eteindre la photo a droite. */
.hero-img::after{content:"";position:absolute;inset:0;
    background:linear-gradient(180deg,rgba(19,23,26,.84) 0%,rgba(19,23,26,.5) 34%,rgba(19,23,26,.95) 100%)}
@media(min-width:900px){
    .hero-img::after{background:
        linear-gradient(90deg,rgba(19,23,26,.66) 0%,rgba(19,23,26,.3) 48%,rgba(19,23,26,0) 70%),
        linear-gradient(180deg,rgba(19,23,26,.8) 0%,rgba(19,23,26,.4) 34%,rgba(19,23,26,.95) 100%)}
}
.hero-in{position:relative;z-index:2;padding:clamp(28px,5vh,58px) 0 clamp(26px,4vh,48px);width:100%}
.hero .mono{color:var(--ambre-c);display:block;margin-bottom:clamp(11px,1.8vh,18px)}
.hero h1{color:#fff;font-size:clamp(2.25rem,calc(1rem + 6vw),5.7rem);max-width:17ch}
.hero h1 em{font-style:normal;color:var(--ambre-c)}
.hero .chapo{margin-top:clamp(18px,2.6vh,28px);max-width:56ch;color:rgba(255,255,255,.8);
    font-size:clamp(1.01rem,calc(.96rem + .36vw),1.2rem);line-height:1.58}
.hero .chapo b{color:#fff;font-weight:700}
.hero-act{display:flex;gap:13px;margin-top:clamp(22px,3.4vh,32px);flex-wrap:wrap}
.preuves{position:relative;z-index:2;border-top:1px solid rgba(255,255,255,.16);
    margin-top:clamp(26px,4.4vh,48px);padding-top:19px;display:flex;align-items:center;
    gap:clamp(14px,2.6vw,36px);flex-wrap:wrap}
.preuves .p{display:flex;align-items:center;gap:9px;color:rgba(255,255,255,.72);font-size:.81rem;font-weight:500}
.preuves .p svg{flex:none;color:var(--ambre-c)}
.preuves .note{margin-left:auto;display:flex;align-items:baseline;gap:8px;color:#fff}
.preuves .note b{font-family:var(--disp);font-size:1.42rem;font-weight:800;letter-spacing:-.03em}
.preuves .note span{color:rgba(255,255,255,.6);font-size:.78rem}
@media(max-width:780px){.preuves .note{margin-left:0;width:100%}}

.hero-p{background:var(--nuit);color:#fff;padding:clamp(46px,7vw,86px) 0 clamp(38px,5vw,64px);position:relative;overflow:hidden}
.hero-p .hero-img img{opacity:.42}
.hero-p .hero-img::after{background:linear-gradient(100deg,rgba(19,23,26,.94) 0%,rgba(19,23,26,.86) 42%,rgba(19,23,26,.58) 100%)}
.hero-p .in{position:relative;z-index:2}
.hero-p .mono{color:var(--ambre-c);display:block;margin-bottom:16px}
.hero-p h1{color:#fff;font-size:clamp(2rem,calc(1.1rem + 3.6vw),4rem);max-width:20ch}
.hero-p .chapo{margin-top:20px;max-width:62ch;color:rgba(255,255,255,.78);font-size:clamp(1rem,calc(.95rem + .3vw),1.16rem)}
.hero-p .act{display:flex;gap:12px;margin-top:26px;flex-wrap:wrap}

.agents{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(11px,1.3vw,18px)}
@media(max-width:1020px){.agents{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.agents{grid-template-columns:1fr}}
.ag{position:relative;overflow:hidden;background:var(--nuit-2);display:block;text-decoration:none;
    transition:transform .3s,background .3s}
.ag:hover{transform:translateY(-4px);background:var(--nuit-3)}
.ag .ph{aspect-ratio:4/5;overflow:hidden}
.ag .ph img{width:100%;height:100%;object-fit:cover;filter:saturate(.82);transition:transform .5s,filter .4s}
.ag:hover .ph img{transform:scale(1.05);filter:saturate(1)}
.ag .tx{padding:19px 19px 23px}
.ag .lat{font-family:var(--mono);font-size:.62rem;letter-spacing:.12em;color:var(--ambre-c);
    text-transform:uppercase;display:block;margin-bottom:9px}
.ag h3{color:#fff;font-size:1.2rem;margin-bottom:9px}
.ag p{color:rgba(255,255,255,.64);font-size:.87rem;line-height:1.52}
.ag .go{display:inline-flex;align-items:center;gap:7px;margin-top:13px;color:var(--ambre-c);
    font-size:.78rem;font-weight:700}

.edito{background:var(--papier-2);border-block:1px solid var(--ligne)}
.edito .wt{max-width:min(820px,100% - clamp(24px,6vw,116px))}
.edito .mono{color:var(--ambre);display:block;margin-bottom:16px}
.edito h2{font-size:clamp(1.7rem,calc(1.1rem + 2.4vw),2.9rem);margin-bottom:26px;max-width:22ch}
.edito p{color:var(--encre-2);margin-bottom:18px;font-size:1.03rem}
.edito p:first-of-type{font-size:1.13rem;color:var(--encre)}
.edito .sign{margin-top:32px;padding-top:22px;border-top:1px solid var(--ligne-2);
    font-family:var(--mono);font-size:.68rem;letter-spacing:.13em;text-transform:uppercase;color:var(--encre-3)}

.corps h2{font-size:clamp(1.5rem,calc(1.05rem + 1.9vw),2.4rem);margin:clamp(34px,4vw,54px) 0 16px;
    padding-top:clamp(10px,1.4vw,18px);border-top:2px solid var(--encre)}
.corps h2:first-child{margin-top:0;border-top:0;padding-top:0}
.corps h3{font-size:clamp(1.15rem,1.7vw,1.4rem);margin:26px 0 10px}
.corps p{color:var(--encre-2);margin-bottom:16px}
.corps ul,.corps ol{margin:0 0 18px 0;padding-left:0;list-style:none}
.corps ul li{position:relative;padding-left:22px;margin-bottom:9px;color:var(--encre-2)}
.corps ul li::before{content:"";position:absolute;left:0;top:.72em;width:9px;height:1.5px;background:var(--ambre)}
.corps ol{counter-reset:c}
.corps ol li{counter-increment:c;position:relative;padding-left:34px;margin-bottom:11px;color:var(--encre-2)}
.corps ol li::before{content:counter(c,decimal-leading-zero);position:absolute;left:0;top:.1em;
    font-family:var(--mono);font-size:.72rem;font-weight:600;color:var(--ambre)}
.corps figure{margin:26px 0}
.corps figure img{width:100%}
.corps figcaption{font-family:var(--mono);font-size:.66rem;letter-spacing:.1em;text-transform:uppercase;
    color:var(--encre-3);margin-top:9px}
.corps .encart{border-left:3px solid var(--ambre);background:var(--papier-2);padding:18px 22px;margin:24px 0;font-size:.95rem}
.corps .encart b{display:block;font-family:var(--disp);font-size:1.05rem;margin-bottom:6px;letter-spacing:-.02em}
.corps .encart p:last-child{margin-bottom:0}

.grille2{display:grid;grid-template-columns:1fr 1fr;gap:clamp(15px,2vw,26px)}
@media(max-width:820px){.grille2{grid-template-columns:1fr}}
.fiche{background:var(--carte);border:1px solid var(--ligne);overflow:hidden;text-decoration:none;
    display:block;transition:border-color .3s,transform .3s,box-shadow .3s}
.fiche:hover{border-color:var(--vert);transform:translateY(-4px);box-shadow:0 16px 38px -22px rgba(22,26,23,.4)}
.fiche .ph{aspect-ratio:16/10;overflow:hidden}
.fiche .ph img{width:100%;height:100%;object-fit:cover;transition:transform .5s}
.fiche:hover .ph img{transform:scale(1.04)}
.fiche .tx{padding:22px 24px 26px}
.fiche .lat{font-family:var(--mono);font-size:.62rem;letter-spacing:.12em;color:var(--ambre);
    text-transform:uppercase;display:block;margin-bottom:8px}
.fiche h3{font-size:1.24rem;margin-bottom:9px}
.fiche p{color:var(--encre-2);font-size:.9rem}

.metiers{display:grid;grid-template-columns:repeat(2,1fr);gap:clamp(15px,1.9vw,26px)}
@media(max-width:900px){.metiers{grid-template-columns:1fr}}
.met{background:var(--carte);border:1px solid var(--ligne);overflow:hidden;
    transition:border-color .3s,transform .3s,box-shadow .3s}
.met:hover{border-color:var(--vert);transform:translateY(-5px);box-shadow:0 18px 42px -22px rgba(22,26,23,.4)}
.met .ph{aspect-ratio:16/9;overflow:hidden;position:relative}
.met .ph img{width:100%;height:100%;object-fit:cover;transition:transform .55s}
.met:hover .ph img{transform:scale(1.04)}
.met .num{position:absolute;top:0;left:0;background:var(--vert);color:#fff;font-family:var(--mono);
    font-size:.66rem;font-weight:600;letter-spacing:.14em;padding:8px 13px}
.met .tx{padding:clamp(22px,2.8vw,34px)}
.met h3{font-size:clamp(1.35rem,2.1vw,1.8rem);margin-bottom:11px}
.met h3 a{text-decoration:none}
.met h3 a:hover{color:var(--vert)}
.met p{color:var(--encre-2);font-size:.94rem;margin-bottom:16px}
.met .sous{list-style:none;display:flex;flex-wrap:wrap;gap:7px;margin-bottom:18px}
.met .sous a{font-family:var(--mono);font-size:.62rem;letter-spacing:.09em;text-transform:uppercase;
    color:var(--encre-3);border:1px solid var(--ligne-2);padding:5px 9px;text-decoration:none;
    transition:color .2s,border-color .2s}
.met .sous a:hover{color:var(--vert);border-color:var(--vert)}
.met .go{display:inline-flex;align-items:center;gap:8px;color:var(--vert);font-weight:700;
    font-size:.87rem;border-bottom:2px solid var(--vert);padding-bottom:3px;text-decoration:none}

.etapes{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--ligne);border:1px solid var(--ligne)}
@media(max-width:900px){.etapes{grid-template-columns:repeat(2,1fr)}}
@media(max-width:520px){.etapes{grid-template-columns:1fr}}
.et{background:var(--papier);padding:clamp(22px,2.6vw,32px)}
.et .n{font-family:var(--mono);font-size:.68rem;letter-spacing:.16em;color:var(--ambre);font-weight:600}
.et h3{font-size:1.14rem;margin:12px 0 10px}
.et p{color:var(--encre-2);font-size:.89rem}
.et .d{font-family:var(--mono);font-size:.63rem;letter-spacing:.1em;text-transform:uppercase;
    color:var(--encre-3);margin-top:14px;padding-top:12px;border-top:1px solid var(--ligne)}

.chiffres{background:var(--vert);color:#fff;padding:clamp(44px,5.4vw,72px) 0}
.chiffres .g{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(18px,3vw,38px)}
@media(max-width:860px){.chiffres .g{grid-template-columns:repeat(2,1fr)}}
.cf .n{font-family:var(--disp);font-size:clamp(2.4rem,calc(1.4rem + 3.6vw),4.2rem);font-weight:800;
    letter-spacing:-.05em;line-height:.9}
.cf .n sup{font-size:.4em;vertical-align:super;color:var(--ambre-c);margin-left:2px}
.cf .l{font-family:var(--mono);font-size:.64rem;letter-spacing:.15em;text-transform:uppercase;
    color:rgba(255,255,255,.7);margin-top:11px;line-height:1.5}

.zg{display:grid;grid-template-columns:1fr 1fr;gap:clamp(26px,4vw,60px);align-items:start}
@media(max-width:900px){.zg{grid-template-columns:1fr}}
.depts{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:var(--ligne)}
.dept{background:var(--papier);padding:17px 19px;text-decoration:none;transition:background .25s}
.dept:hover{background:var(--carte)}
.dept .d{font-family:var(--mono);font-size:.65rem;letter-spacing:.14em;color:var(--ambre);font-weight:600}
.dept .n{font-family:var(--disp);font-weight:800;font-size:1.02rem;margin-top:5px;letter-spacing:-.02em;display:block}
.dept .v{color:var(--encre-3);font-size:.78rem;margin-top:4px;line-height:1.4;display:block}
.encart{border-left:3px solid var(--ambre);background:var(--papier-2);padding:18px 22px;margin-top:24px;font-size:.93rem}
.encart b{display:block;font-family:var(--disp);font-size:1.05rem;margin-bottom:6px;letter-spacing:-.02em}

.chantiers{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(15px,1.9vw,24px)}
@media(max-width:940px){.chantiers{grid-template-columns:1fr}}
.ch{background:var(--carte);border:1px solid var(--ligne);overflow:hidden;text-decoration:none;
    transition:transform .3s,box-shadow .3s}
.ch:hover{transform:translateY(-5px);box-shadow:0 18px 42px -22px rgba(22,26,23,.38)}
.ch .ph{aspect-ratio:3/2;overflow:hidden}
.ch .ph img{width:100%;height:100%;object-fit:cover;transition:transform .5s}
.ch:hover .ph img{transform:scale(1.05)}
.ch .tx{padding:21px 23px 25px}
.ch .m{font-family:var(--mono);font-size:.62rem;letter-spacing:.13em;text-transform:uppercase;
    color:var(--ambre);margin-bottom:9px}
.ch h3{font-size:1.13rem;line-height:1.2;margin-bottom:9px}
.ch p{color:var(--encre-2);font-size:.87rem}

.faq details{border-bottom:1px solid var(--ligne);padding:4px 0}
.faq details:first-of-type{border-top:1px solid var(--ligne)}
.faq summary{cursor:pointer;list-style:none;padding:20px 40px 20px 0;position:relative;
    font-family:var(--disp);font-weight:800;font-size:clamp(1.01rem,1.5vw,1.22rem);letter-spacing:-.02em}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"";position:absolute;right:8px;top:50%;width:11px;height:11px;
    border-right:2px solid var(--ambre);border-bottom:2px solid var(--ambre);
    transform:translateY(-60%) rotate(45deg);transition:transform .25s}
.faq details[open] summary::after{transform:translateY(-30%) rotate(-135deg)}
.faq .rep{padding:0 40px 22px 0;color:var(--encre-2);font-size:.96rem}
.faq .rep p+p{margin-top:12px}

.partenaires{border-block:1px solid var(--ligne);background:var(--papier-2);padding:clamp(38px,4.6vw,64px) 0}
.partenaires .lg{font-family:var(--mono);font-size:.65rem;letter-spacing:.16em;text-transform:uppercase;
    color:var(--encre-3);text-align:center;margin-bottom:26px}
.partenaires .rangee{display:flex;align-items:center;justify-content:center;gap:clamp(20px,3.4vw,50px);
    flex-wrap:wrap}
.partenaires .rangee+.lg{margin-top:44px}
.partenaires .rangee img{height:clamp(32px,3.4vw,46px);width:clamp(112px,12vw,161px);object-fit:contain;
    opacity:.7;filter:grayscale(1) contrast(1.06);transition:opacity .3s,filter .3s}
.partenaires .rangee a:hover img{opacity:1;filter:none}
.partenaires .rangee .txt{font-family:var(--disp);font-weight:800;font-size:1.06rem;letter-spacing:-.02em;
    color:var(--vert);text-decoration:none}
.partenaires .rangee .txt small{display:block;font-family:var(--mono);font-size:.57rem;letter-spacing:.13em;
    text-transform:uppercase;color:var(--encre-3);font-weight:600;margin-top:4px}

.final .in{display:grid;grid-template-columns:1fr auto;gap:clamp(26px,4vw,56px);align-items:center}
@media(max-width:900px){.final .in{grid-template-columns:1fr}}

.final .act{display:flex;flex-direction:column;gap:11px}
.final .tel{font-family:var(--disp);font-size:clamp(1.62rem,2.8vw,2.35rem);font-weight:800;
    letter-spacing:-.03em;color:var(--ambre-c);text-decoration:none}

footer{background:var(--nuit);color:rgba(255,255,255,.6);padding:clamp(38px,5vw,62px) 0 30px;
    border-top:1px solid rgba(255,255,255,.12)}
.fg{display:grid;grid-template-columns:1.3fr 1fr 1fr 1fr;gap:clamp(22px,3vw,48px)}
@media(max-width:940px){.fg{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.fg{grid-template-columns:1fr}}
footer h3{font-family:var(--mono);font-size:.63rem;letter-spacing:.16em;text-transform:uppercase;
    color:var(--ambre-c);margin-bottom:15px;font-weight:600}
footer ul{list-style:none}
footer li{margin-bottom:8px;font-size:.86rem}
footer a{text-decoration:none}
footer a:hover{color:#fff}
footer .adr{font-size:.88rem;line-height:1.7}
footer .adr b{color:#fff;display:block;font-family:var(--disp);font-size:1.03rem;margin-bottom:8px;letter-spacing:-.02em}
.social{display:flex;gap:10px;margin-top:16px}
.social a{width:34px;height:34px;border:1px solid rgba(255,255,255,.22);display:grid;place-items:center;
    color:rgba(255,255,255,.72);transition:background .2s,color .2s}
.social a:hover{background:var(--ambre);color:var(--nuit);border-color:var(--ambre)}
.fb{margin-top:clamp(28px,4vw,46px);padding-top:20px;border-top:1px solid rgba(255,255,255,.12);
    display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;font-family:var(--mono);
    font-size:.61rem;letter-spacing:.1em;text-transform:uppercase;color:rgba(255,255,255,.4)}

.entreprise .in{display:grid;grid-template-columns:300px 1fr;gap:clamp(28px,4vw,64px);align-items:start}
@media(max-width:880px){.entreprise .in{grid-template-columns:1fr}}

.avapres{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:26px 0}
@media(max-width:640px){.avapres{grid-template-columns:1fr}}
.avapres figure{position:relative;margin:0}
.avapres img{width:100%;aspect-ratio:4/3;object-fit:cover}
.avapres figcaption{position:absolute;top:0;left:0;background:var(--nuit);color:#fff;font-family:var(--mono);
    font-size:.62rem;letter-spacing:.14em;text-transform:uppercase;padding:7px 12px;margin:0}
.avapres figure:last-child figcaption{background:var(--vert)}

.galerie{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(10px,1.2vw,16px)}
@media(max-width:900px){.galerie{grid-template-columns:repeat(2,1fr)}}
.galerie figure{margin:0}
.galerie img{width:100%;aspect-ratio:1/1;object-fit:cover;transition:transform .45s}
.galerie figure:hover img{transform:scale(1.04)}
.galerie figcaption{font-family:var(--mono);font-size:.6rem;letter-spacing:.1em;text-transform:uppercase;
    color:var(--encre-3);margin-top:8px;line-height:1.45}
.sombre .galerie figcaption{color:rgba(255,255,255,.55)}

.medias{border-block:1px solid var(--ligne);background:var(--carte);padding:clamp(28px,3.4vw,46px) 0}
.medias .in{display:flex;align-items:center;justify-content:center;gap:clamp(20px,3.4vw,54px);flex-wrap:wrap}
.medias .lg{font-family:var(--mono);font-size:.63rem;letter-spacing:.15em;text-transform:uppercase;
    color:var(--encre-3);margin-right:8px}
.medias img{height:clamp(30px,3.2vw,42px);width:clamp(105px,11vw,147px);object-fit:contain;
    opacity:.62;filter:grayscale(1);transition:opacity .3s,filter .3s}
.medias a:hover img{opacity:1;filter:none}

.entete 
.aiguillage{background:var(--papier-2);border-block:1px solid var(--ligne)}
.aiguillage .g{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--ligne-2);
    border:1px solid var(--ligne-2)}
@media(max-width:820px){.aiguillage .g{grid-template-columns:1fr}}
.aiguillage .v{background:var(--carte);padding:clamp(26px,3.4vw,42px);display:flex;flex-direction:column}
.aiguillage .v.fort{background:var(--vert);color:#fff}
.aiguillage .n{font-family:var(--mono);font-size:.65rem;letter-spacing:.15em;text-transform:uppercase;
    color:var(--ambre);font-weight:600;margin-bottom:14px}
.aiguillage .v.fort .n{color:var(--ambre-c)}
.aiguillage h3{font-size:clamp(1.3rem,2.1vw,1.7rem);margin-bottom:12px}
.aiguillage p{color:var(--encre-2);font-size:.96rem;margin-bottom:14px}
.aiguillage .v.fort p{color:rgba(255,255,255,.82)}
.aiguillage ul{list-style:none;margin-bottom:22px}
.aiguillage li{position:relative;padding-left:20px;margin-bottom:8px;font-size:.92rem;color:var(--encre-2)}
.aiguillage .v.fort li{color:rgba(255,255,255,.8)}
.aiguillage li::before{content:"";position:absolute;left:0;top:.72em;width:9px;height:1.5px;background:var(--ambre)}
.aiguillage .bas{margin-top:auto}

.espece{display:grid;grid-template-columns:340px 1fr;gap:clamp(22px,3vw,44px);align-items:start;
    padding:clamp(28px,3.4vw,44px) 0;border-top:1px solid var(--ligne)}
.espece:first-of-type{border-top:2px solid var(--encre)}
@media(max-width:840px){.espece{grid-template-columns:1fr}}
.espece .ph{overflow:hidden;background:var(--papier-2)}
.espece .ph img{width:100%;aspect-ratio:4/3;object-fit:cover;transition:transform .6s}
.espece:hover .ph img{transform:scale(1.03)}
.espece .lat{font-family:var(--mono);font-size:.63rem;letter-spacing:.13em;text-transform:uppercase;
    color:var(--ambre);display:block;margin-bottom:8px}
.espece h3{font-size:clamp(1.35rem,2.2vw,1.85rem);margin-bottom:14px}
.espece p{color:var(--encre-2);margin-bottom:14px}
.espece .traits{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--ligne);
    border:1px solid var(--ligne);margin:18px 0}
@media(max-width:600px){.espece .traits{grid-template-columns:1fr}}
.espece .traits div{background:var(--papier);padding:13px 15px}
.espece .traits dt{font-family:var(--mono);font-size:.58rem;letter-spacing:.13em;text-transform:uppercase;
    color:var(--encre-3);margin-bottom:5px}
.espece .traits dd{font-size:.87rem;font-weight:600;line-height:1.35}
.sombre .espece{border-top-color:rgba(255,255,255,.18)}
.sombre .espece:first-of-type{border-top-color:rgba(255,255,255,.4)}
.sombre .espece h3{color:#fff}
.sombre .espece p{color:rgba(255,255,255,.7)}
.sombre .espece .traits{background:rgba(255,255,255,.14);border-color:rgba(255,255,255,.14)}
.sombre .espece .traits div{background:var(--nuit-2)}
.sombre .espece .traits dt{color:rgba(255,255,255,.5)}
.sombre .espece .traits dd{color:#fff}
.sombre .espece .ph{background:var(--nuit-2)}

.prevention{background:var(--vert);color:#fff;padding:clamp(52px,6.5vw,96px) 0}
.prevention .tete{border-bottom-color:rgba(255,255,255,.28)}
.prevention .tete .mono{color:var(--ambre-c)}
.prevention .tete h2{color:#fff}
.prevention .tete .intro{color:rgba(255,255,255,.72)}
.prev-g{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(14px,1.8vw,24px)}
@media(max-width:900px){.prev-g{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.prev-g{grid-template-columns:1fr}}
.prev{background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.14);padding:22px 22px 24px;
    transition:background .3s,transform .3s}
.prev:hover{background:rgba(255,255,255,.12);transform:translateY(-3px)}
.prev .ico{width:38px;height:38px;border:1.5px solid var(--ambre-c);color:var(--ambre-c);
    display:grid;place-items:center;margin-bottom:16px}
.prev h3{font-size:1.08rem;color:#fff;margin-bottom:9px;line-height:1.22}
.prev p{color:rgba(255,255,255,.74);font-size:.89rem;margin:0}

.rv{opacity:0;transform:translateY(16px);transition:opacity .6s ease,transform .6s ease}
.rv.vu{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.rv{opacity:1;transform:none}}

/* Les organismes, en trois rangs. Le bandeau defilant mettait la certification
   CTB-A+ au meme rang qu'un logo de chaine de television ; les deux titres qui
   engagent reellement sont donc sortis du lot.
   Les logos font 3,5 pour 1 : les cadres suivent ce format au lieu de les
   enfermer dans un carre ou un cercle ou ils ne rempliraient qu'un quart. */
   La section ferme la page, entre l'appel a l'action et le pied qui sont tous
   deux sombres : une bande claire ici serait un sandwich. Le fond est un cran
   au-dessus du noir du pied, assez pour que les trois zones se distinguent
   sans que la page se hache. */
.marques{background:var(--nuit-2);padding:clamp(34px,4.2vw,58px) 0}
.marques .tete{margin-bottom:clamp(18px,2.4vw,28px)}

/* Sur fond sombre, l'emphase s'inverse : les deux titres qui engagent passent
   en plaques claires, ce sont les seuls blocs de papier de la section. */
.mq-h{display:grid;grid-template-columns:1fr 1fr;gap:clamp(10px,1.4vw,18px);
    margin-bottom:clamp(22px,2.8vw,34px)}
.mq-t{background:var(--papier);color:var(--encre);padding:clamp(18px,2.2vw,28px);
    display:flex;flex-direction:column;align-items:center;text-align:center;
    text-decoration:none;position:relative;overflow:hidden;
    transition:background .28s,transform .28s}
.mq-t:hover,.mq-t:focus-visible{background:var(--carte);transform:translateY(-3px)}
.mq-t::after{content:"";position:absolute;left:0;right:0;bottom:0;height:3px;
    background:var(--ambre);transform:scaleX(0);transition:transform .32s}
.mq-t:hover::after,.mq-t:focus-visible::after{transform:scaleX(1)}
/* Les deux logos portent un aplat blanc dans leur propre dessin : sans plaque,
   ce blanc bave en rectangle sur le papier creme. La plaque le rend voulu. */
.mq-tl{display:grid;place-items:center;width:min(236px,100%);height:88px;
    background:#fff;padding:10px 18px;margin-bottom:14px;transition:transform .3s}
.mq-t:hover .mq-tl{transform:scale(1.03)}
.mq-tl img{width:100%;height:auto;max-height:66px;object-fit:contain}
.mq-t b{font-family:var(--disp);font-weight:800;font-size:clamp(1rem,1.4vw,1.14rem);
    letter-spacing:-.02em;color:var(--encre);margin-bottom:7px}
.mq-tp{font-size:.86rem;line-height:1.5;color:var(--encre-2);max-width:46ch}

.mq-r{margin-top:clamp(16px,2vw,26px)}
.mq-rl{display:block;font-family:var(--mono);font-size:.55rem;letter-spacing:.13em;
    text-transform:uppercase;text-align:center;color:var(--ambre-c);
    margin-bottom:14px;padding-bottom:9px;
    border-bottom:1px solid rgba(255,255,255,.16)}
/* Les logos sont centres dans leur rang : un rang de deux ne doit pas etirer
   ses cartes sur toute la largeur. La bordure est portee par les cartes et non
   par le rang, sinon un rang court laisse une bande de fond vide a ses cotes. */
.mq-rg{display:flex;flex-wrap:wrap;justify-content:center;gap:10px}
/* Les logos sont encres sombre pour la plupart : ils gardent leur plaque
   claire, c'est le fond de la section qui a change, pas eux. */
.mq-s{flex:0 1 196px;min-width:148px;background:var(--carte);padding:15px 12px;
    display:flex;flex-direction:column;align-items:center;justify-content:center;
    gap:8px;text-align:center;text-decoration:none;color:inherit;
    transition:background .25s,transform .25s}
a.mq-s:hover,a.mq-s:focus-visible{background:#fff;transform:translateY(-3px)}
/* La boite est plus haute que le format 3,5 pour 1 des logos larges : sinon un
   logo carre comme C'Chartres se retrouve bride a 38 px de large. */
.mq-s img{width:132px;height:48px;object-fit:contain;filter:grayscale(.35);
    opacity:.92;transition:filter .3s,opacity .3s,transform .3s}
a.mq-s:hover img{filter:none;opacity:1;transform:scale(1.05)}
.mq-s>span{font-family:var(--mono);font-size:.5rem;letter-spacing:.11em;
    text-transform:uppercase;color:var(--encre-3);line-height:1.4}
/* La coupure de ligne d'un conteneur flex se decide sur la base, avant tout
   retrecissement : une base en pixels laisse un rang de quatre casser en 3+1.
   En pourcentage, le nombre de cartes par rang est decide, pas subi. */
@media(max-width:1120px){
    .mq-s{flex:0 1 calc(25% - 7.5px);min-width:0}
}
@media(max-width:760px){
    .mq-h{grid-template-columns:1fr}
    .mq-s{flex:0 1 calc(50% - 5px);padding:12px 10px}
    .mq-s img{width:112px;height:42px}
}

.cycle{background:var(--nuit);color:#fff;padding:clamp(46px,6vw,86px) 0;overflow:hidden}
.cycle .in{display:grid;grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr);
    gap:clamp(26px,3.6vw,60px);align-items:center}
@media(max-width:960px){.cycle .in{grid-template-columns:1fr}}
.cycle .mono{color:var(--ambre-c);display:block;margin-bottom:14px}
.cycle h2{color:#fff;font-size:clamp(1.5rem,calc(1.05rem + 1.9vw),2.5rem);margin-bottom:16px;max-width:18ch}
.cycle .tx p{color:rgba(255,255,255,.7);font-size:.98rem;margin:0}
.cycle .tr{margin:0}
.cycle svg{width:100%;height:auto;display:block}
.tr-fond{fill:none;stroke:rgba(255,255,255,.2);stroke-width:1.4}
.tr-fond rect{fill:rgba(255,255,255,.045)}
.tr-fond .tr-bois{fill:rgba(224,165,92,.13);stroke:rgba(229,165,92,.42)}
.tr-gal,.tr-cord{fill:none;stroke:var(--ambre-c);stroke-width:2.4;stroke-linecap:round}
.tr-cord{stroke-width:2}
.tr-eau{fill:none;stroke:#6fb3d8;stroke-width:2.2;stroke-linecap:round}
.tr-flux{fill:none;stroke:#e08a4c;stroke-width:2.2;stroke-linecap:round}
.tr-sel{fill:none;stroke:rgba(255,255,255,.5);stroke-width:2;stroke-dasharray:5 5}
.tr-fruct{fill:rgba(200,116,44,.32);stroke:var(--ambre-c);stroke-width:1.8}
.tr-pts circle{fill:var(--ambre-c);stroke:none;opacity:0;
    transform:scale(.3);transform-box:fill-box;transform-origin:center;
    transition:opacity .45s ease,transform .45s cubic-bezier(.2,1.5,.5,1)}
.trace .tr-pts circle{opacity:1;transform:scale(1)}
.tr-lb{fill:none;stroke:rgba(255,255,255,.3);stroke-width:1;stroke-dasharray:3 3}
.tr-lb text{fill:rgba(255,255,255,.72);font-family:var(--mono);font-size:12.5px;
    text-anchor:middle;stroke:none;opacity:0;transition:opacity .6s ease .8s}
.trace .tr-lb text{opacity:1}
.tr-lb .pc{fill:var(--ambre-c);font-weight:600;font-size:13.5px}
.tr-lb .pc.g{text-anchor:start}
.tr-lb .pc.d{text-anchor:end}
[data-trace] path,[data-trace] line{transition:stroke-dashoffset 1.5s cubic-bezier(.35,.9,.35,1)}
.trace path,.trace line{stroke-dashoffset:0!important}

.ap-g{display:grid;grid-template-columns:1fr 1fr;gap:clamp(16px,2.4vw,32px)}
@media(max-width:900px){.ap-g{grid-template-columns:1fr}}
.ap{margin:0}
.ap-c{position:relative;overflow:hidden;aspect-ratio:3/2;background:var(--nuit-2);
    border:1px solid rgba(255,255,255,.14);touch-action:pan-y;container-type:inline-size}
.ap-c>img,.ap-av img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.ap-av{position:absolute;inset:0;width:50%;overflow:hidden;will-change:width}
.ap-av img{width:100cqw;max-width:none}
.ap-h{position:absolute;top:0;bottom:0;left:50%;width:2px;background:var(--ambre-c);
    transform:translateX(-1px);pointer-events:none;box-shadow:0 0 0 1px rgba(0,0,0,.3)}
.ap-h::after{content:"";position:absolute;top:50%;left:50%;width:44px;height:44px;
    transform:translate(-50%,-50%);border:2px solid var(--ambre-c);border-radius:50%;
    background:rgba(19,23,26,.6)}
.ap-c input{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:ew-resize;
    -webkit-appearance:none;appearance:none;background:transparent;z-index:3}
.ap-c input::-webkit-slider-thumb{-webkit-appearance:none;width:54px;height:200px;cursor:ew-resize}
.ap-c input::-moz-range-thumb{width:54px;height:200px;border:0;background:transparent;cursor:ew-resize}
.ap-c input:focus-visible{outline:2px solid var(--ambre-c);outline-offset:3px}
.ap-t{position:absolute;top:13px;font-family:var(--mono);font-size:.6rem;letter-spacing:.16em;
    text-transform:uppercase;font-weight:600;color:#fff;background:rgba(19,23,26,.74);
    padding:5px 10px;pointer-events:none;z-index:2}
.ap-t1{left:13px}
.ap-t2{right:13px}
.ap figcaption{margin-top:14px;color:rgba(255,255,255,.66);font-size:.88rem;line-height:1.55}
@media(max-width:940px){.presse .in{grid-template-columns:1fr}}
.pr-ph{margin:0}
.pr-ph img{width:100%;object-fit:cover;aspect-ratio:3/2;display:block;border:1px solid var(--ligne)}

.po-g{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(14px,1.9vw,26px)}
@media(max-width:900px){.po-g{grid-template-columns:1fr}}
.po{margin:0;background:var(--carte);border:1px solid var(--ligne);overflow:hidden}
.po img{width:100%;aspect-ratio:4/3;object-fit:cover;display:block}
.po figcaption{padding:20px 22px 24px}
.po h3{font-size:1.14rem;margin-bottom:9px}
.po p{color:var(--encre-2);font-size:.9rem;line-height:1.56;margin:0}

.br-in{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);
    gap:clamp(24px,3.4vw,58px);align-items:start}
@media(max-width:940px){.br-in{grid-template-columns:1fr}}
.br-ph{margin:0;position:sticky;top:calc(var(--h-bas) + 24px)}
@media(max-width:940px){.br-ph{position:static}}
.br-g{display:grid;grid-template-columns:1fr 1fr;gap:6px}
.br-g img{width:100%;aspect-ratio:3/2;object-fit:cover;display:block;border:1px solid var(--ligne)}
.br-ph figcaption{margin-top:14px;font-size:.85rem;line-height:1.55;color:var(--encre-3)}
.brulage .corps ol li b{color:var(--encre);font-weight:700}

.galerie.g3{grid-template-columns:repeat(3,1fr)}
.galerie.g4{grid-template-columns:repeat(3,1fr)}
@media(max-width:820px){.galerie.g3,.galerie.g4{grid-template-columns:repeat(2,1fr)}}
@media(max-width:520px){.galerie.g3,.galerie.g4{grid-template-columns:1fr}}

.ct{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,.65fr);
    gap:clamp(24px,3.2vw,54px);align-items:start}
@media(max-width:1000px){.ct{grid-template-columns:1fr}}
.fm{background:var(--carte);border:1px solid var(--ligne);padding:clamp(22px,3vw,44px);
    box-shadow:0 20px 50px -34px rgba(22,26,23,.34)}
/* Le formulaire vient de wb-mail et porte ses propres styles, cales sur une
   autre charte. On neutralise ce qui casserait la mise en page du site : la
   largeur maximale et les marges automatiques du plugin, et sa grille a deux
   colonnes qui deborde dans une colonne deja etroite. Le reste de son
   habillage se regle dans le plugin, pas ici. */
.fm-wb .wb-contact-wrap,.fm-wb .wb-form-card,.fm-wb form{max-width:none;margin:0;
    background:none;box-shadow:none;border-radius:0;padding:0}
.fm-wb .wb-contact-wrap{display:block}
@media(max-width:760px){.fm-wb .wb-grid{grid-template-columns:1fr}}

@media(max-width:620px){.fm-g{grid-template-columns:1fr}}
.ch{display:flex;flex-direction:column;gap:7px}
.ch.pl{grid-column:1/-1}
.ch label{font-family:var(--mono);font-size:.66rem;letter-spacing:.13em;text-transform:uppercase;
    font-weight:600;color:var(--encre-2)}
.ch label .rq{color:var(--ambre);margin-left:3px}
.ch input,.ch select,.ch textarea{font:inherit;font-size:.95rem;color:var(--encre);
    background:var(--papier);border:1px solid var(--ligne-2);border-radius:0;
    padding:13px 15px;width:100%;transition:border-color .2s,box-shadow .2s,background .2s}
.ch textarea{min-height:148px;resize:vertical;line-height:1.6}
.ch select{appearance:none;-webkit-appearance:none;cursor:pointer;padding-right:42px;
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8' fill='none' stroke='%234a514b' stroke-width='1.8'%3E%3Cpath d='M1 1l5 5 5-5'/%3E%3C/svg%3E");
    background-repeat:no-repeat;background-position:right 16px center}
.ch input:focus,.ch select:focus,.ch textarea:focus{outline:none;border-color:var(--vert);
    background:var(--carte);box-shadow:0 0 0 3px rgba(31,81,50,.11)}
.ch input::placeholder,.ch textarea::placeholder{color:var(--encre-3);opacity:.72}
.ch[data-ko] input,.ch[data-ko] select,.ch[data-ko] textarea{border-color:#b3401c;
    box-shadow:0 0 0 3px rgba(179,64,28,.1)}
.ch .er{display:none;font-size:.8rem;color:#a83a18;font-weight:500}
.ch[data-ko] .er{display:block}

.fi{position:relative;background:var(--papier-2);border:1px solid var(--ligne);overflow:hidden}

.fi button{position:absolute;top:6px;right:6px;width:24px;height:24px;display:grid;place-items:center;
    background:rgba(19,23,26,.76);color:#fff;border:0;cursor:pointer;transition:background .2s}
.fi button:hover{background:#a83a18}

.ct-a{display:flex;flex-direction:column;gap:16px;position:sticky;top:calc(var(--h-bas) + 20px)}
@media(max-width:1000px){.ct-a{position:static}}
.ct-c{background:var(--nuit);color:#fff;padding:26px 26px 28px}
.ct-c h3{color:#fff;font-size:1.1rem;margin-bottom:16px}
.ct-c .gr{display:flex;align-items:center;gap:12px;font-family:var(--disp);font-size:1.6rem;
    font-weight:800;letter-spacing:-.03em;color:var(--ambre-c);text-decoration:none;margin-bottom:5px}
.ct-c .gr:hover{color:#fff}
.ct-c .sub{color:rgba(255,255,255,.56);font-size:.83rem;margin-bottom:20px}
.ct-c dl{display:grid;grid-template-columns:auto 1fr;gap:9px 16px;font-size:.87rem;
    padding-top:18px;border-top:1px solid rgba(255,255,255,.14)}
.ct-c dt{font-family:var(--mono);font-size:.62rem;letter-spacing:.13em;text-transform:uppercase;
    color:rgba(255,255,255,.44);padding-top:3px}
.ct-c dd{color:rgba(255,255,255,.84);margin:0}
.ct-c dd a{color:var(--ambre-c);text-decoration:none}
.ct-c dd a:hover{text-decoration:underline}
.ct-e{background:var(--carte);border:1px solid var(--ligne);border-left:3px solid var(--ambre);
    padding:22px 24px}
.ct-e h3{font-size:1rem;margin-bottom:11px}
.ct-e p{color:var(--encre-2);font-size:.88rem;line-height:1.6;margin-bottom:10px}
.ct-e p:last-child{margin-bottom:0}
.ct-e ul{list-style:none;margin:0;padding:0}
.ct-e li{position:relative;padding-left:20px;margin-bottom:8px;color:var(--encre-2);font-size:.88rem;
    line-height:1.55}
.ct-e li:last-child{margin-bottom:0}
.ct-e li::before{content:"";position:absolute;left:0;top:.62em;width:8px;height:1.5px;background:var(--ambre)}
.lsh-hp{position:absolute!important;left:-9999px!important;width:1px;height:1px;overflow:hidden}

.fm-msg.ko{border-left-color:#a83a18;background:rgba(168,58,24,.07)}

.fm-msg.ko b{color:#a83a18}

.fm[data-envoye] .fm-t,.fm[data-envoye] .fm-g{display:none}
.fm[data-envoye] .fm-ok{display:block}

.zoom{display:block;position:relative;width:100%;padding:0;border:0;background:none;
    font:inherit;color:inherit;cursor:zoom-in;overflow:hidden;text-align:inherit}
.ph>.zoom{height:100%}
.zoom>img{transition:transform .55s cubic-bezier(.2,.7,.3,1)}
.zoom::after{content:"";position:absolute;top:12px;right:12px;width:32px;height:32px;
    background:rgba(19,23,26,.62) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='15' height='15' viewBox='0 0 20 20' fill='none' stroke='%23fff' stroke-width='2'%3E%3Ccircle cx='8.5' cy='8.5' r='6'/%3E%3Cpath d='M13 13l5 5M8.5 6v5M6 8.5h5'/%3E%3C/svg%3E") center/15px no-repeat;
    opacity:0;transform:scale(.8);transition:opacity .25s,transform .25s;pointer-events:none;
    backdrop-filter:blur(3px)}
.zoom:hover::after,.zoom:focus-visible::after{opacity:1;transform:none}
.zoom:hover>img{transform:scale(1.03)}
.zoom:focus-visible{outline:2px solid var(--ambre);outline-offset:3px}
.galerie .zoom>img,.po .zoom>img,.br-g .zoom>img{display:block}
.ap-zoom{position:absolute;top:12px;right:12px;z-index:4;width:34px;height:34px;display:grid;
    place-items:center;border:0;cursor:zoom-in;color:#fff;background:rgba(19,23,26,.66);
    transition:background .2s,transform .2s}
.ap-zoom:hover{background:var(--ambre);transform:scale(1.08)}

.lb{position:fixed;inset:0;z-index:200;display:none;background:rgba(10,12,14,.94);
    backdrop-filter:blur(6px);opacity:0;transition:opacity .28s ease}
.lb[data-ouvert]{display:block}
.lb[data-vu]{opacity:1}
.lb-sc{position:absolute;inset:0;display:grid;place-items:center;padding:clamp(52px,7vh,78px) clamp(14px,5vw,86px)}
.lb-fig{margin:0;display:flex;flex-direction:column;align-items:center;gap:16px;max-height:100%}
.lb-img{max-width:100%;max-height:calc(100vh - 190px);width:auto;height:auto;object-fit:contain;
    box-shadow:0 30px 80px -30px rgba(0,0,0,.9);transform:scale(.94);opacity:0;
    transition:transform .38s cubic-bezier(.2,.9,.3,1),opacity .3s;cursor:zoom-in;
    touch-action:none;user-select:none;-webkit-user-drag:none}
.lb[data-vu] .lb-img{transform:none;opacity:1}
.lb[data-zoome] .lb-img{cursor:grab;max-width:none;max-height:none;transition:transform .3s ease}
.lb[data-zoome] .lb-img:active{cursor:grabbing}
.lb-cap{max-width:74ch;text-align:center;color:rgba(255,255,255,.76);font-size:.9rem;
    line-height:1.55;text-wrap:balance}
.lb-cap b{display:block;color:#fff;font-family:var(--mono);font-size:.62rem;letter-spacing:.16em;
    text-transform:uppercase;margin-bottom:7px;font-weight:600}
.lb-bar{position:absolute;top:0;left:0;right:0;height:clamp(52px,7vh,78px);display:flex;
    align-items:center;justify-content:space-between;padding:0 clamp(14px,3vw,30px);
    color:rgba(255,255,255,.7);font-family:var(--mono);font-size:.68rem;letter-spacing:.14em}
.lb-b{width:42px;height:42px;display:grid;place-items:center;border:1px solid rgba(255,255,255,.22);
    background:rgba(255,255,255,.05);color:#fff;cursor:pointer;transition:background .2s,border-color .2s,transform .2s}
.lb-b:hover{background:var(--ambre);border-color:var(--ambre);transform:scale(1.06)}
.lb-b:focus-visible{outline:2px solid var(--ambre);outline-offset:3px}
.lb-nav{position:absolute;top:50%;transform:translateY(-50%);z-index:3}
.lb-nav.p{left:clamp(8px,2vw,26px)}
.lb-nav.s{right:clamp(8px,2vw,26px)}
.lb-nav[hidden]{display:none}
.lb-out{display:flex;gap:10px;align-items:center}
@media(max-width:640px){
    .lb-sc{padding:56px 8px 96px}
    .lb-img{max-height:calc(100vh - 210px)}
    .lb-nav{top:auto;bottom:16px;transform:none}
    .lb-cap{font-size:.83rem}
}
html[data-fige]{overflow:hidden}

.d3{perspective:1100px}
.d3>*{transform-style:preserve-3d}
[data-tilt]{transition:transform .5s cubic-bezier(.2,.8,.3,1)}
[data-tilt][data-actif]{transition:transform .1s linear}
[data-tilt] .ph,[data-tilt] .tx{transition:transform .5s cubic-bezier(.2,.8,.3,1)}
[data-tilt][data-actif] .ph{transform:translateZ(38px) scale(1.02)}
[data-tilt][data-actif] .tx{transform:translateZ(22px)}
[data-tilt]::before{content:"";position:absolute;inset:0;z-index:3;pointer-events:none;
    opacity:0;transition:opacity .3s;
    background:radial-gradient(340px circle at var(--mx,50%) var(--my,50%),
        rgba(255,255,255,.16),transparent 62%)}
[data-tilt][data-actif]::before{opacity:1}
@media(hover:none),(prefers-reduced-motion:reduce){
    [data-tilt]{transform:none!important}
    [data-tilt] .ph,[data-tilt] .tx{transform:none!important}
    [data-tilt]::before{display:none}
}

.hero-img img{will-change:transform}
.hero .hero-in{will-change:transform}
.hero-prof{position:absolute;inset:0;z-index:1;pointer-events:none;
    background:radial-gradient(1100px circle at var(--hx,50%) var(--hy,42%),
        rgba(229,165,92,.16),transparent 58%);opacity:0;transition:opacity .6s}
.hero:hover .hero-prof{opacity:1}
@media(hover:none),(prefers-reduced-motion:reduce){.hero-prof{display:none}}

[data-tilt]{position:relative}
.hero{overflow:hidden}
.hero-img{overflow:hidden}
.met,.ch{position:relative}

.chan{padding:clamp(30px,4vw,54px) 0;border-top:1px solid var(--ligne)}
.chan:first-of-type{border-top:0;padding-top:clamp(14px,2vw,26px)}
.chan>header{display:flex;justify-content:space-between;align-items:flex-start;gap:20px;
    flex-wrap:wrap;margin-bottom:22px}
.chan h3{font-size:clamp(1.4rem,calc(1.05rem + 1.5vw),2.1rem);margin-bottom:7px}
.chan .lieu{font-family:var(--mono);font-size:.68rem;letter-spacing:.13em;text-transform:uppercase;
    color:var(--encre-3);margin:0}
.chan .cat{flex:none;font-family:var(--mono);font-size:.6rem;letter-spacing:.13em;
    text-transform:uppercase;font-weight:600;text-decoration:none;padding:8px 14px;
    background:var(--papier-2);color:var(--encre-2);border:1px solid var(--ligne);
    transition:background .2s,color .2s,border-color .2s}
.chan .cat:hover{background:var(--vert);color:#fff;border-color:var(--vert)}
.ch-g{display:grid;gap:clamp(10px,1.4vw,16px)}
.ch-g.un{grid-template-columns:minmax(0,1.5fr) minmax(0,1fr)}
.ch-g.un .ch-ph:only-child{grid-column:1}
.ch-g.deux{grid-template-columns:1fr 1fr}
.ch-g.plus{grid-template-columns:repeat(3,1fr)}
@media(max-width:820px){.ch-g.plus{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.ch-g.un,.ch-g.deux,.ch-g.plus{grid-template-columns:1fr}}
.ch-ph{margin:0;align-self:start}
.ch-ph img{width:100%;aspect-ratio:4/3;object-fit:cover;display:block;border:1px solid var(--ligne)}
.ch-ph figcaption{margin-top:9px;font-size:.83rem;line-height:1.5;color:var(--encre-3)}
.ch-tx{margin:22px 0 0;max-width:78ch;font-size:1.02rem;color:var(--encre-2)}
.chantiers-d .tete{margin-bottom:clamp(20px,3vw,36px)}

.zones{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(12px,1.6vw,20px)}
@media(max-width:1080px){.zones{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.zones{grid-template-columns:1fr}}
.zone{display:block;text-decoration:none;background:var(--carte);border:1px solid var(--ligne);
    overflow:hidden;position:relative;
    transition:transform .3s,box-shadow .3s,border-color .3s}
.zone:hover{transform:translateY(-5px);border-color:var(--vert);
    box-shadow:0 18px 40px -24px rgba(22,26,23,.44)}
.zone .ph{aspect-ratio:4/3;overflow:hidden;background:var(--nuit-2)}
.zone .ph img{width:100%;height:100%;object-fit:cover;transition:transform .55s;filter:saturate(.9)}
.zone:hover .ph img{transform:scale(1.05);filter:saturate(1)}
.zone{display:flex;flex-direction:column}
.zone .tx{padding:18px 20px 22px;position:relative;flex:1;display:flex;flex-direction:column}
.zone .mt{margin-top:auto;padding-top:10px}
.zone .num{position:absolute;top:-24px;right:16px;font-family:var(--disp);font-weight:800;
    font-size:2.4rem;letter-spacing:-.05em;color:#fff;text-shadow:0 2px 14px rgba(0,0,0,.5);
    line-height:1}
.zone h3{font-size:1.18rem;margin-bottom:8px}
.zone .ct{font-size:.85rem;line-height:1.5;color:var(--encre-2);margin:0 0 10px}
.zone .mt{font-family:var(--mono);font-size:.62rem;letter-spacing:.12em;text-transform:uppercase;
    color:var(--vert);font-weight:600;margin:0}

.chan .ch-g.un .ch-ph img{aspect-ratio:16/10}

.art-t{padding:clamp(40px,6vw,84px) 0 clamp(26px,3.4vw,46px);background:var(--papier-2);
    border-bottom:1px solid var(--ligne)}
.art-t .mono{color:var(--vert);display:block;margin-bottom:16px}
.art-t h1{font-size:clamp(2rem,calc(1.2rem + 3.4vw),3.6rem);max-width:20ch}
.art-t .chapo{margin-top:22px;font-size:clamp(1.06rem,calc(1rem + .4vw),1.24rem);
    color:var(--encre-2);max-width:60ch}
.art-m{display:flex;flex-wrap:wrap;gap:8px 26px;margin-top:30px;padding-top:20px;
    border-top:1px solid var(--ligne-2);font-family:var(--mono);font-size:.64rem;
    letter-spacing:.11em;text-transform:uppercase;color:var(--encre-3)}
.art{padding:clamp(34px,5vw,64px) 0}
.art .wt p{color:var(--encre-2);margin-bottom:18px}
.art .wt>p:first-of-type{font-size:1.1rem;color:var(--encre)}
.art h2{font-size:clamp(1.4rem,calc(1.05rem + 1.6vw),2.15rem);margin:clamp(38px,4.4vw,62px) 0 16px;
    padding-top:clamp(26px,3vw,40px);border-top:1px solid var(--ligne);max-width:24ch}
.art h2:first-child{margin-top:0;border-top:0;padding-top:0}
.art h3{font-size:clamp(1.1rem,calc(1rem + .7vw),1.38rem);margin:30px 0 11px}
.art ul,.art ol{margin:0 0 20px}
.art li{margin-bottom:11px}
.art .encart{margin:30px 0}
.art-f{margin:clamp(28px,3.4vw,44px) 0}
.art-f img{width:100%;display:block;border:1px solid var(--ligne)}
.art-f figcaption{margin-top:11px;font-size:.86rem;line-height:1.55;color:var(--encre-3)}
.art-f.grand{width:min(1100px,100vw - clamp(24px,6vw,116px));
    margin-inline:calc((min(780px,100vw - clamp(24px,6vw,116px)) - min(1100px,100vw - clamp(24px,6vw,116px)))/2)}
@media(max-width:900px){.art-f.grand{width:100%;margin-inline:0}}
.art .rap{background:var(--nuit);color:#fff;padding:clamp(24px,3vw,38px);margin:clamp(30px,4vw,50px) 0}
.art .rap .t{font-family:var(--disp);font-weight:800;font-size:1.16rem;margin-bottom:14px;
    letter-spacing:-.02em}
.art .rap p,.art .rap li{color:rgba(255,255,255,.78)}
.art .rap li::before{background:var(--ambre-c)}
.art .rap p:last-child,.art .rap ul:last-child{margin-bottom:0}
.art .rap a{color:var(--ambre-c)}

.cas{border-top:1px solid var(--ligne);padding:clamp(28px,3.4vw,46px) 0}
.cas:first-of-type{border-top:0}
.cas .in{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);
    gap:clamp(20px,2.6vw,40px);align-items:start}
@media(max-width:820px){.cas .in{grid-template-columns:1fr}}
.cas img{width:100%;aspect-ratio:4/3;object-fit:cover;display:block;border:1px solid var(--ligne)}
.cas .lieu{font-family:var(--mono);font-size:.64rem;letter-spacing:.13em;text-transform:uppercase;
    color:var(--vert);font-weight:600;display:block;margin-bottom:10px}
.cas h3{font-size:clamp(1.16rem,calc(1.02rem + .8vw),1.5rem);margin:0 0 12px}
.cas p{color:var(--encre-2);font-size:.97rem;margin-bottom:12px}
.cas .verdict{font-size:.88rem;padding:13px 16px;background:var(--papier-2);
    border-left:3px solid var(--ambre);margin:0}
.cas .verdict b{display:block;font-family:var(--mono);font-size:.6rem;letter-spacing:.14em;
    text-transform:uppercase;color:var(--ambre);margin-bottom:5px}

.suite{background:var(--papier-2);border-top:1px solid var(--ligne);padding:clamp(34px,4.4vw,60px) 0}
.su-g{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(12px,1.6vw,20px)}
@media(max-width:820px){.su-g{grid-template-columns:1fr}}
.su{display:block;background:var(--carte);border:1px solid var(--ligne);padding:20px 22px 24px;
    text-decoration:none;transition:transform .25s,border-color .25s,box-shadow .25s}
.su:hover{transform:translateY(-4px);border-color:var(--vert);
    box-shadow:0 16px 34px -22px rgba(22,26,23,.4)}
.su .mono{color:var(--ambre);display:block;margin-bottom:9px}
.su .tt{font-family:var(--disp);font-weight:800;font-size:1.06rem;letter-spacing:-.02em;
    line-height:1.2;color:var(--encre);display:block}

.journal{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(14px,2vw,26px)}
@media(max-width:960px){.journal{grid-template-columns:1fr 1fr}}
@media(max-width:620px){.journal{grid-template-columns:1fr}}
.jr{display:flex;flex-direction:column;background:var(--carte);border:1px solid var(--ligne);
    overflow:hidden;text-decoration:none;position:relative;
    transition:transform .3s,border-color .3s,box-shadow .3s}
.jr:hover{transform:translateY(-5px);border-color:var(--vert);
    box-shadow:0 20px 44px -26px rgba(22,26,23,.45)}
.jr .ph{aspect-ratio:16/10;overflow:hidden}
.jr .ph img{width:100%;height:100%;object-fit:cover;transition:transform .5s}
.jr:hover .ph img{transform:scale(1.05)}
.jr .tx{padding:20px 22px 24px;flex:1;display:flex;flex-direction:column}
.jr .cat{font-family:var(--mono);font-size:.6rem;letter-spacing:.13em;text-transform:uppercase;
    color:var(--vert);font-weight:600;margin-bottom:10px}
.jr h3{font-size:1.16rem;line-height:1.2;margin-bottom:10px}
.jr p{font-size:.9rem;line-height:1.55;color:var(--encre-2);margin:0 0 14px}
.jr .go{margin-top:auto;font-family:var(--mono);font-size:.62rem;letter-spacing:.13em;
    text-transform:uppercase;color:var(--ambre);font-weight:600;display:flex;
    justify-content:space-between;gap:12px}
.jr .go span:last-child{color:var(--encre-3)}
/* Pagination des archives, rendue par index.php. */
.pagi{margin-top:clamp(24px,3vw,40px)}
.pagi ul{list-style:none;display:flex;flex-wrap:wrap;gap:8px;justify-content:center}
.pagi a,.pagi span{display:inline-flex;align-items:center;justify-content:center;
    min-width:44px;height:44px;padding:0 14px;background:var(--carte);
    border:1px solid var(--ligne);text-decoration:none;color:var(--encre);
    font-family:var(--mono);font-size:.78rem;transition:background .2s,border-color .2s}
.pagi a:hover{background:var(--papier-2);border-color:var(--encre-3)}
.pagi .current{background:var(--vert);border-color:var(--vert);color:#fff}
.jr.vedette{grid-column:span 2}
@media(max-width:620px){.jr.vedette{grid-column:span 1}}
.jr.vedette .ph{aspect-ratio:16/9}
.jr.vedette h3{font-size:clamp(1.3rem,2.2vw,1.7rem)}

.tw{overflow-x:auto;-webkit-overflow-scrolling:touch;max-width:100%}
table.comp{width:100%;border-collapse:collapse;font-size:.88rem;margin:8px 0 0;min-width:660px}
table.comp th{text-align:left;font-family:var(--disp);font-weight:800;font-size:1rem;
    letter-spacing:-.02em;color:var(--encre);padding:0 16px 14px 0;
    border-bottom:2px solid var(--encre);vertical-align:bottom}
table.comp th em{display:block;font-family:var(--mono);font-size:.6rem;letter-spacing:.09em;
    text-transform:none;font-style:normal;color:var(--encre-3);font-weight:400;margin-top:4px}
table.comp td{padding:13px 16px 13px 0;border-bottom:1px solid var(--ligne);
    color:var(--encre-2);vertical-align:top;line-height:1.5}
table.comp td:first-child{width:150px;color:var(--encre)}
table.comp tr:hover td{background:rgba(31,81,50,.04)}

.appel{position:fixed;left:0;right:0;bottom:0;z-index:80;display:none;
    background:var(--nuit);border-top:1px solid rgba(255,255,255,.14);
    padding:9px clamp(10px,3vw,16px);gap:9px;
    padding-bottom:calc(9px + env(safe-area-inset-bottom,0px))}
/* min-width:0 est indispensable : sans lui un enfant flex ne descend pas sous
   sa largeur de contenu, et white-space:nowrap faisait deborder le second
   bouton de sept pixels sur un ecran de 320. */
.appel a{flex:1 1 0;min-width:0;display:flex;align-items:center;
    justify-content:center;gap:8px;font-size:.92rem;font-weight:700;
    text-decoration:none;padding:14px 10px;white-space:nowrap;
    transition:background .2s}
@media(max-width:360px){
    .appel a{font-size:.86rem;padding:14px 6px;gap:6px}
}
.appel .t{background:var(--ambre);color:#fff}
.appel .t:active{background:var(--ambre-c)}
.appel .p{background:transparent;color:#fff;border:1.5px solid rgba(255,255,255,.4)}
.appel svg{flex:none}
/* Les deux boutons d'appel restent accessibles sur tout telephone, et sur
   toute tablette tenue en portrait, jusqu'a l'iPad Pro 12,9 pouces qui fait
   1024 px de large dans ce sens. */
@media(max-width:860px),(orientation:portrait) and (max-width:1180px){
    .appel{display:flex;transform:translateY(105%);
        transition:transform .32s cubic-bezier(.2,.8,.3,1)}
    .appel[data-vu]{transform:none}
    body{padding-bottom:78px}
    /* La bulle d'aide est fixe : en bas de page elle se posait sur la derniere
       ligne du pied et masquait un lien. Le pied reserve donc la hauteur de la
       bulle et son ecart, plutot que de lui disputer la place. */
    footer{padding-bottom:calc(clamp(34px,5vh,60px) + 12px + 74px)}
    :root{--h-appel:78px}
}
@media(prefers-reduced-motion:reduce){
    .appel{transition:none}
}
@media(orientation:portrait) and (min-width:861px) and (max-width:1180px){
    .appel a{font-size:1rem;padding:15px 12px;max-width:340px}
    .appel{justify-content:center}
}

/* Les fiches de l'equipe : la carte s'incline en suivant le curseur, le
   portrait flotte plus haut qu'elle, ce decalage donne le relief. */
/* ================================================ F : inclinaison 3D ==== */

.equipe{background:var(--papier-2);border-block:1px solid var(--ligne)}
.eq-band{margin:0 0 clamp(24px,3vw,42px);display:grid;
    grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:clamp(22px,3vw,48px);
    align-items:center}
.eq-band figure{margin:0}
.eq-band img{width:100%;height:auto;display:block;border:1px solid var(--ligne)}
.eq-bi{font-size:clamp(1.06rem,1.5vw,1.24rem);line-height:1.5;color:var(--encre);
    font-family:var(--disp);font-weight:800;letter-spacing:-.02em;margin-bottom:16px}
.eq-bt p{color:var(--encre-2);font-size:.98rem;line-height:1.62}
.eq-bl{margin-top:16px;padding-top:13px;border-top:1px solid var(--ligne-2);
    font-family:var(--mono);font-size:.6rem;letter-spacing:.13em;text-transform:uppercase;
    color:var(--encre-3)}
.eq-aide{margin-top:14px;font-family:var(--mono);font-size:.58rem;letter-spacing:.13em;
    text-transform:uppercase;color:var(--encre-3)}
.tl-g{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(12px,1.6vw,22px)}
.tl-c{position:relative}
.tl-ph{position:relative;z-index:4;height:196px;flex:none;display:grid;
    place-items:end center}
.tl-tx{position:relative;z-index:4;margin-top:12px;flex:1}
.tl-in{position:relative;background:var(--carte);border:1px solid var(--ligne);
    padding:clamp(16px,1.8vw,24px);height:100%;display:flex;flex-direction:column;
    align-items:center;text-align:center;transform-style:preserve-3d;
    overflow:hidden;transition:box-shadow .45s}
.tl-c:hover .tl-in,.tl-c:focus-visible .tl-in{box-shadow:0 26px 50px rgba(0,0,0,.16)}

.tl-halo{position:absolute;left:50%;top:22px;width:168px;height:168px;
    transform:translateX(-50%);border-radius:50%;background:var(--papier-2);
    transition:transform .5s,background .4s}
.tl-c:hover .tl-halo{background:rgba(192,117,36,.14);transform:translateX(-50%) scale(1.08)}

.tl-ph img{width:auto;height:196px;object-fit:contain;object-position:bottom center;
    filter:saturate(.92) drop-shadow(0 14px 18px rgba(0,0,0,.22));
    transition:filter .4s}
.tl-c:hover .tl-ph img{filter:saturate(1) drop-shadow(0 22px 26px rgba(0,0,0,.3))}

.tl-r{display:block;font-family:var(--mono);font-size:.55rem;letter-spacing:.14em;
    text-transform:uppercase;color:var(--ambre);margin-bottom:5px}
.tl-c h3{font-family:var(--disp);font-weight:800;letter-spacing:-.025em;
    font-size:1.14rem;margin:0 0 7px}
.tl-p{font-size:.85rem;color:var(--encre-2);margin:0 0 10px;font-style:italic}
/* Le detail restait replie et ne s'ouvrait qu'au survol. Trois consequences :
   la carte survolee grandissait et etirait les trois autres, qui devenaient
   de grands cadres presque vides ; la mise en page sautait a chaque passage
   de souris ; et au doigt le comportement etait deja different, le detail
   restant ouvert. On l'affiche donc toujours. Ce qui faisait la version F
   reste en place : l'inclinaison au curseur, le halo, l'ombre portee et la
   remontee de saturation de la photo. */
/* Le detail reste replie et se deplie au survol, comme avant. Ce qui change,
   c'est que la carte survolee sort de sa case au lieu de l'agrandir : elle
   passe en absolu sur ses propres bornes et grandit vers le bas. La ligne de
   grille garde donc sa hauteur, les trois autres cartes ne sont plus etirees
   en cadres presque vides, et rien n'est recouvert dans la carte ouverte.
   Le repli par grid-template-rows n'agit que sur un seul enfant : la liste est
   donc enveloppee, sinon seule sa premiere ligne se replierait. */
.tl-vo{display:grid;grid-template-rows:0fr;
    transition:grid-template-rows .42s cubic-bezier(.22,.75,.3,1)}
.tl-c:hover .tl-vo,.tl-c:focus-visible .tl-vo,.tl-c:focus-within .tl-vo{
    grid-template-rows:1fr}
.tl-c:hover,.tl-c:focus-within{z-index:20}
.tl-c:hover .tl-in,.tl-c:focus-within .tl-in{position:absolute;
    top:0;left:0;right:0;height:auto}
.tl-f{list-style:none;margin:0;padding:0;text-align:left;overflow:hidden;
    min-height:0}
/* Au doigt il n'y a pas de survol : le detail reste ouvert, sinon il devient
   inaccessible. Cette regle doit passer APRES celle qui replie. */
@media(hover:none){
    .tl-vo{grid-template-rows:1fr}
    .eq-aide{display:none}
}
.tl-f li{font-size:.79rem;line-height:1.5;color:var(--encre-2);padding-left:13px;
    position:relative;margin-bottom:5px}
.tl-f li::before{content:"";position:absolute;left:0;top:.62em;width:7px;height:1.5px;
    background:var(--ambre)}
.tl-ph[data-vide]{display:grid;place-items:center}
.tl-mo{font-family:var(--disp);font-weight:800;font-size:3rem;color:var(--ligne-2)}
.tl-c[data-rang="un"] .tl-in{background:var(--nuit);border-color:var(--nuit)}
.tl-c[data-rang="un"] h3{color:#fff}
.tl-c[data-rang="un"] .tl-r{color:var(--ambre-c)}
.tl-c[data-rang="un"] .tl-p{color:rgba(255,255,255,.82)}
.tl-c[data-rang="un"] .tl-f li{color:rgba(255,255,255,.7)}
.tl-c[data-rang="un"] .tl-halo{background:radial-gradient(circle,
    rgba(229,165,92,.4) 0%,rgba(192,117,36,.2) 56%,rgba(192,117,36,0) 74%)}
.tl-c[data-rang="un"]:hover .tl-halo{background:radial-gradient(circle,
    rgba(229,165,92,.54) 0%,rgba(192,117,36,.28) 56%,rgba(192,117,36,0) 74%)}

@media(max-width:980px){.tl-g{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.tl-g{grid-template-columns:1fr}}

.bandeau .z{display:flex;align-items:center;gap:18px;white-space:nowrap}
.bandeau .av{display:inline-flex;align-items:center;gap:6px;color:rgba(255,255,255,.82)}
.bandeau .av svg{color:var(--ambre-c)}
.bandeau .av b{color:#fff;font-weight:700}
.bandeau .li{color:rgba(255,255,255,.5)}
@media(max-width:1180px){.bandeau .li{display:none}}

@media(max-width:1080px){
    .dd{width:100%}
    }

.film{background:var(--nuit);color:#fff;padding:clamp(42px,6vw,90px) 0;position:relative;
    overflow:hidden}
.film::after{content:"";position:absolute;inset:0;pointer-events:none;
    background:radial-gradient(820px circle at 18% 30%,rgba(200,74,24,.22),transparent 62%)}
.film .in{position:relative;z-index:2;display:grid;
    grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr);gap:clamp(28px,4vw,64px);
    align-items:center}
@media(max-width:940px){.film .in{grid-template-columns:1fr}}
.film .mono{color:var(--ambre-c);display:block;margin-bottom:14px}
.film h2{color:#fff;font-size:clamp(1.5rem,calc(1.1rem + 2vw),2.6rem);margin-bottom:18px;max-width:20ch}
.film p{color:rgba(255,255,255,.76);margin-bottom:15px}
.film b{color:#fff}
.film .lg{display:flex;align-items:center;gap:22px;margin-bottom:22px;padding-bottom:18px;
    border-bottom:1px solid rgba(255,255,255,.16)}
.film .lg img{width:104px;height:32px;object-fit:contain;object-position:left center}
.film .sig{font-family:var(--mono);font-size:.7rem;letter-spacing:.11em;text-transform:uppercase;
    color:var(--ambre-c);font-weight:600;margin:0}

.lect{position:relative;margin:0;background:#000;overflow:hidden;
    border:1px solid rgba(255,255,255,.16);max-width:440px;justify-self:center;width:100%}
.lect{--ar:4/5}
.lect video,.lect .po{display:block;width:100%;aspect-ratio:var(--ar);object-fit:cover}
/* Les clips verticaux tournes au telephone montent trop haut a cote du
   texte sur grand ecran : on borne la hauteur sans deformer l'image. */
.lect{max-height:min(72vh,620px)}
.lect video,.lect .po{max-height:min(72vh,620px)}
.lect video{background:#000}
.lect .po{cursor:pointer;transition:transform .6s,filter .4s;filter:brightness(.82)}
.lect:hover .po{transform:scale(1.03);filter:brightness(.95)}
.lect .go{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;
    justify-content:center;gap:16px;border:0;background:none;cursor:pointer;color:#fff;
    padding:0;font:inherit}
.lect .go .rd{width:74px;height:74px;border-radius:50%;background:rgba(200,74,24,.94);
    display:grid;place-items:center;transition:transform .3s,background .3s;
    box-shadow:0 12px 40px -12px rgba(0,0,0,.8)}
.lect .go:hover .rd{transform:scale(1.09);background:var(--rust,#c84a18)}
.lect .go .rd svg{margin-left:5px}
.lect .go .dur{font-family:var(--mono);font-size:.66rem;letter-spacing:.16em;text-transform:uppercase;
    font-weight:600;background:rgba(0,0,0,.66);padding:8px 14px;backdrop-filter:blur(3px);
    color:#fff}
.lect .go:focus-visible{outline:2px solid var(--ambre-c);outline-offset:-4px}
.lect[data-joue] .po,.lect[data-joue] .go{display:none}
.lect figcaption{position:absolute;left:0;right:0;bottom:0;padding:14px 16px;
    background:linear-gradient(180deg,transparent,rgba(0,0,0,.85));
    font-family:var(--mono);font-size:.6rem;letter-spacing:.13em;text-transform:uppercase;
    color:rgba(255,255,255,.82);pointer-events:none}
.lect[data-joue] figcaption{display:none}

.doc{padding:clamp(34px,5vw,70px) 0}
.doc .in{display:grid;grid-template-columns:minmax(0,260px) minmax(0,1fr);
    gap:clamp(26px,4vw,64px);align-items:start}
@media(max-width:900px){.doc .in{grid-template-columns:1fr}}
.doc-nav{position:sticky;top:calc(var(--h-bas) + 22px);border-left:2px solid var(--ligne);
    padding-left:20px}
@media(max-width:900px){.doc-nav{position:static;border-left:0;border-top:1px solid var(--ligne);
    padding:20px 0 0}}
.doc-nav .t{font-family:var(--mono);font-size:.6rem;letter-spacing:.15em;text-transform:uppercase;
    color:var(--encre-3);font-weight:600;display:block;margin-bottom:14px}
.doc-nav ol{list-style:none;counter-reset:d;margin:0;padding:0}
.doc-nav li{counter-increment:d;padding:0;margin:0 0 3px}
.doc-nav li::before{display:none}
.doc-nav a{display:block;padding:7px 0;font-size:.87rem;color:var(--encre-2);text-decoration:none;
    line-height:1.4;transition:color .2s}
.doc-nav a::before{content:counter(d,decimal-leading-zero) ".";font-family:var(--mono);
    font-size:.68rem;color:var(--ambre);margin-right:9px;font-weight:600}
.doc-nav a:hover{color:var(--vert)}
.doc-c{counter-reset:s}
.doc-c h2{counter-increment:s;font-size:clamp(1.2rem,calc(1.05rem + .9vw),1.62rem);
    margin:clamp(34px,4vw,54px) 0 14px;padding-top:clamp(26px,3vw,38px);
    border-top:1px solid var(--ligne);scroll-margin-top:calc(var(--h-bas) + 20px)}
.doc-c h2:first-child{margin-top:0;padding-top:0;border-top:0}
.doc-c h2::before{content:counter(s,decimal-leading-zero);display:block;font-family:var(--mono);
    font-size:.68rem;letter-spacing:.14em;color:var(--ambre);font-weight:600;margin-bottom:9px}
.doc-c h3{font-size:1.06rem;margin:24px 0 9px}
.doc-c p,.doc-c li{color:var(--encre-2);font-size:.97rem}
.doc-c dl{display:grid;grid-template-columns:auto 1fr;gap:9px 22px;margin:0 0 18px;font-size:.95rem}
.doc-c dt{font-family:var(--mono);font-size:.63rem;letter-spacing:.13em;text-transform:uppercase;
    color:var(--encre-3);padding-top:4px}
.doc-c dd{color:var(--encre-2);margin:0}
.doc-c .maj{font-family:var(--mono);font-size:.66rem;letter-spacing:.12em;text-transform:uppercase;
    color:var(--encre-3);padding:14px 0 0;border-top:1px solid var(--ligne);margin-top:34px}

.gal-f{display:flex;flex-wrap:wrap;gap:9px;margin-bottom:clamp(20px,2.6vw,34px)}
.gal-f button{font:inherit;font-size:.86rem;font-weight:600;padding:10px 18px;cursor:pointer;
    background:var(--carte);border:1px solid var(--ligne-2);color:var(--encre-2);
    transition:background .2s,color .2s,border-color .2s}
.gal-f button:hover{border-color:var(--vert);color:var(--vert)}
.gal-f button[aria-pressed="true"]{background:var(--vert);border-color:var(--vert);color:#fff}
.gal-f button:focus-visible{outline:2px solid var(--ambre);outline-offset:2px}
.gal-g{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(10px,1.3vw,16px)}
@media(max-width:1000px){.gal-g{grid-template-columns:repeat(3,1fr)}}
@media(max-width:700px){.gal-g{grid-template-columns:repeat(2,1fr)}}
@media(max-width:440px){.gal-g{grid-template-columns:1fr}}
.gal-i{margin:0;position:relative;background:var(--nuit-2);overflow:hidden}
.gal-i[hidden]{display:none}
.gal-i img{width:100%;aspect-ratio:1;object-fit:cover;display:block;transition:transform .5s}
.gal-i:hover img{transform:scale(1.05)}
.gal-i figcaption{position:absolute;inset:auto 0 0 0;padding:26px 14px 12px;
    background:linear-gradient(180deg,transparent,rgba(10,12,14,.9));color:#fff;
    font-size:.8rem;line-height:1.35}
.gal-i figcaption b{display:block;font-family:var(--mono);font-size:.58rem;letter-spacing:.13em;
    text-transform:uppercase;color:var(--ambre-c);font-weight:600;margin-bottom:4px}
.gal-n{font-family:var(--mono);font-size:.68rem;letter-spacing:.12em;text-transform:uppercase;
    color:var(--encre-3);margin:18px 0 0}

.err{min-height:calc(100svh - var(--h-bas) - var(--h-haut));display:flex;align-items:center;
    background:var(--nuit);color:#fff;padding:clamp(46px,7vh,90px) 0;position:relative;
    overflow:hidden}
.err::after{content:"";position:absolute;inset:0;pointer-events:none;
    background:radial-gradient(900px circle at 78% 26%,rgba(200,74,24,.24),transparent 62%)}
.err .in{position:relative;z-index:2;display:grid;
    grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:clamp(28px,4vw,64px);align-items:center}
@media(max-width:900px){.err .in{grid-template-columns:1fr}}
.err .code{font-family:var(--disp);font-weight:800;font-size:clamp(4.5rem,16vw,11rem);
    line-height:.82;letter-spacing:-.06em;color:var(--ambre-c);display:block;margin-bottom:18px}
.err h1{color:#fff;font-size:clamp(1.7rem,calc(1.15rem + 2.4vw),3rem);margin-bottom:18px;max-width:18ch}
.err p{color:rgba(255,255,255,.74);margin-bottom:15px;max-width:52ch}
.err .act{display:flex;gap:12px;flex-wrap:wrap;margin-top:26px}
.err-l{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.14);padding:24px 26px}
.err-l .t{font-family:var(--mono);font-size:.62rem;letter-spacing:.15em;text-transform:uppercase;
    color:var(--ambre-c);font-weight:600;display:block;margin-bottom:16px}
.err-l ul{margin:0;padding:0;list-style:none}
.err-l li{padding:0;margin:0;border-bottom:1px solid rgba(255,255,255,.09)}
.err-l li:last-child{border-bottom:0}
.err-l li::before{display:none}
.err-l a{display:flex;justify-content:space-between;gap:14px;align-items:baseline;
    padding:13px 0;text-decoration:none;color:rgba(255,255,255,.85);font-size:.94rem;
    transition:color .2s}
.err-l a:hover{color:var(--ambre-c)}
.err-l a em{font-style:normal;font-size:.78rem;color:rgba(255,255,255,.42);text-align:right;
    flex:none;max-width:48%}

.vfaits-s{background:var(--papier-2);border-bottom:1px solid var(--ligne);
    padding:clamp(22px,3vw,38px) 0}
.vfaits{display:grid;grid-template-columns:repeat(5,1fr);gap:1px;background:var(--ligne);
    border:1px solid var(--ligne)}
.vf{background:var(--carte);padding:clamp(15px,1.7vw,22px) clamp(14px,1.5vw,20px);
    display:flex;flex-direction:column;gap:3px;min-width:0}
.vf .k{font-family:var(--disp);font-weight:800;font-size:clamp(1.35rem,2vw,1.75rem);
    letter-spacing:-.045em;line-height:1;color:var(--vert)}
.vf .l{font-family:var(--mono);font-size:.6rem;letter-spacing:.13em;text-transform:uppercase;
    color:var(--encre-3);font-weight:600;margin-top:5px}
.vf .s{font-size:.79rem;line-height:1.4;color:var(--encre-2);margin-top:4px}
@media(max-width:1020px){.vfaits{grid-template-columns:repeat(3,1fr)}
    .vf:nth-child(4),.vf:nth-child(5){grid-column:span 1}}
@media(max-width:620px){.vfaits{grid-template-columns:repeat(2,1fr)}
    .vf:last-child{grid-column:1/-1}}

.etapes.trois{grid-template-columns:repeat(3,1fr)}
@media(max-width:900px){.etapes.trois{grid-template-columns:1fr}}
.depts.trois{grid-template-columns:repeat(3,1fr)}
@media(max-width:820px){.depts.trois{grid-template-columns:repeat(2,1fr)}}
@media(max-width:480px){.depts.trois{grid-template-columns:1fr}}

.edito .src{margin-top:26px;padding-top:18px;border-top:1px solid var(--ligne-2);
    font-family:var(--mono);font-size:.7rem;line-height:1.7;letter-spacing:.03em;
    color:var(--encre-3);text-transform:none}

.preuve-s{background:var(--nuit);color:#fff;padding:clamp(16px,2vw,24px) 0}
.preuve{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 18px;margin:0}
.preuve b{font-family:var(--disp);font-weight:800;font-size:clamp(.98rem,1.5vw,1.14rem);
    letter-spacing:-.02em}
.preuve span{font-family:var(--mono);font-size:.66rem;letter-spacing:.11em;
    text-transform:uppercase;color:var(--ambre-c);line-height:1.7}

.axes{background:var(--papier-2);border-bottom:1px solid var(--ligne)}
.axe-g{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--ligne);
    border:1px solid var(--ligne)}
@media(max-width:900px){.axe-g{grid-template-columns:1fr}}
.axe{background:var(--carte);padding:clamp(24px,2.8vw,36px)}
.axe h3{font-size:clamp(1.08rem,1.7vw,1.3rem);margin-bottom:14px;
    padding-bottom:12px;border-bottom:2px solid var(--vert)}
.axe p{font-size:.96rem;color:var(--encre-2);margin-bottom:13px}
.axe p:last-child{margin-bottom:0}
.axe b{color:var(--encre)}

.burger:hover{border-color:var(--ambre-c);color:var(--ambre-c)}
.burger[aria-expanded="true"] .burger[aria-expanded="true"] .burger[aria-expanded="true"] 
body[data-fige]{position:fixed;left:0;right:0;width:100%;overflow:hidden}

.voile{position:fixed;inset:0;z-index:200;background:var(--nuit);color:#fff;
    overflow-y:auto;overscroll-behavior:contain;opacity:0;transition:opacity .26s ease}
.voile[data-ouvert]{opacity:1}
.voile::before{content:"";position:absolute;inset:0;pointer-events:none;
    background:radial-gradient(64% 52% at 82% 4%,rgba(192,117,36,.24),transparent 66%)}
.voile-in{position:relative;z-index:2;width:var(--w);margin-inline:auto;
    min-height:100%;display:flex;flex-direction:column;
    padding:clamp(14px,2vw,22px) 0 clamp(26px,4vw,44px)}
.v-haut{display:flex;align-items:center;justify-content:space-between;gap:20px;
    height:var(--h-bas);flex:none}
.v-haut .v-x{background:none;border:1px solid rgba(255,255,255,.3);color:#fff;width:44px;height:44px;
    cursor:pointer;display:grid;place-items:center;transition:border-color .2s,color .2s}
.v-x:hover{border-color:var(--ambre-c);color:var(--ambre-c)}

.v-corps{flex:1;display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr) minmax(0,.85fr);
    gap:clamp(26px,4vw,64px);padding:clamp(24px,4vw,52px) 0}
@media(max-width:1040px){.v-corps{grid-template-columns:1fr 1fr}}
@media(max-width:720px){.v-corps{grid-template-columns:1fr;gap:30px}}

.v-nav{display:flex;flex-direction:column;gap:2px}
.v-p{font-family:var(--disp);font-weight:800;letter-spacing:-.035em;
    font-size:clamp(1.5rem,3.4vw,2.5rem);line-height:1.12;color:#fff;text-decoration:none;
    padding:7px 0;border-bottom:1px solid rgba(255,255,255,.1);transition:color .2s,padding .25s}
.v-p:hover,.v-p:focus-visible{color:var(--ambre-c);padding-left:12px}
.v-p[aria-current]{color:var(--ambre-c)}

.v-col .mono{color:var(--ambre-c);display:block;margin-bottom:16px;
    padding-bottom:11px;border-bottom:1px solid rgba(255,255,255,.16)}
.v-srv{display:flex;flex-direction:column;gap:2px}
.v-srv a{display:flex;align-items:flex-start;gap:13px;padding:10px 10px 10px 0;
    text-decoration:none;color:#fff;transition:background .2s,padding-left .25s}
.v-srv a:hover,.v-srv a:focus-visible{background:rgba(255,255,255,.06);padding-left:10px}
.v-srv .ic{flex:none;width:34px;height:34px;display:grid;place-items:center;
    border:1px solid rgba(255,255,255,.2);color:var(--ambre-c)}
.v-srv .ic svg{width:17px;height:17px}
.v-srv .tx b{display:block;font-size:.96rem;font-weight:600;line-height:1.3}
.v-srv .tx em{display:block;font-style:normal;font-size:.79rem;line-height:1.45;
    color:rgba(255,255,255,.58);margin-top:3px}

.v-zones{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:rgba(255,255,255,.13);
    border:1px solid rgba(255,255,255,.13)}
.v-zones a{background:var(--nuit);padding:11px 13px;text-decoration:none;color:#fff;
    transition:background .2s}
.v-zones a:hover,.v-zones a:focus-visible{background:var(--nuit-3)}
.v-zones b{display:block;font-family:var(--disp);font-weight:800;font-size:.92rem;
    letter-spacing:-.02em}
.v-zones em{display:block;font-style:normal;font-family:var(--mono);font-size:.6rem;
    letter-spacing:.13em;color:var(--ambre-c);margin-top:3px}

.v-bas{flex:none;border-top:1px solid rgba(255,255,255,.16);padding-top:clamp(20px,3vw,30px);
    display:grid;grid-template-columns:auto 1fr;gap:clamp(20px,3vw,42px);align-items:center}
@media(max-width:880px){.v-bas{grid-template-columns:1fr;gap:22px}}
.v-act{display:flex;gap:11px;flex-wrap:wrap}
.v-rx .mono{color:rgba(255,255,255,.5);display:block;margin-bottom:10px}
.rx{list-style:none;display:flex;flex-wrap:wrap;gap:9px;margin:0;padding:0}
.rx li::before{display:none}
.rx a{display:inline-flex;align-items:center;gap:9px;padding:9px 14px 9px 11px;
    border:1px solid rgba(255,255,255,.22);color:#fff;text-decoration:none;
    transition:background .2s,border-color .2s,color .2s}
.rx a:hover,.rx a:focus-visible{background:var(--ambre);border-color:var(--ambre);color:var(--nuit)}
.rx svg{flex:none}
.rx span{font-family:var(--mono);font-size:.63rem;letter-spacing:.13em;
    text-transform:uppercase;font-weight:600}
@media(max-width:560px){.rx span{display:none}.rx a{padding:10px}}
.v-ad{grid-column:1/-1;font-size:.78rem;color:rgba(255,255,255,.42);line-height:1.6;
    margin:clamp(14px,2vw,20px) 0 0}

footer .rx{margin-top:16px}
footer .rx a{border-color:rgba(255,255,255,.18);padding:8px 12px 8px 10px}
footer .rx span{font-size:.58rem}
@media(max-width:1080px){.dcs{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.dcs{grid-template-columns:1fr}}
.dc{background:var(--carte);padding:clamp(20px,2.2vw,28px);text-decoration:none;color:inherit;
    display:flex;flex-direction:column;position:relative;transition:background .25s}
.dc::after{content:"";position:absolute;left:0;right:0;bottom:0;height:3px;
    background:var(--vert);transform:scaleX(0);transform-origin:left;transition:transform .3s}
.dc:hover,.dc:focus-visible{background:var(--papier-2)}
.dc:hover::after,.dc:focus-visible::after{transform:scaleX(1)}
.dc-n{font-family:var(--disp);font-weight:800;font-size:2.5rem;line-height:.9;
    letter-spacing:-.05em;color:var(--ligne-2);transition:color .25s}
.dc:hover .dc-n{color:var(--ambre)}
.dc h3{font-size:1.22rem;margin:10px 0 12px}
.dc-p{font-size:.87rem;color:var(--encre-2);margin:0 0 4px;line-height:1.5}
.dc-p b{font-family:var(--disp);font-weight:800;font-size:.95rem;letter-spacing:-.02em;
    color:var(--vert)}
.dc-r{font-family:var(--mono);font-size:.61rem;letter-spacing:.11em;text-transform:uppercase;
    color:var(--encre-3);margin:0 0 14px;line-height:1.7}
.dc-t{font-size:.88rem;line-height:1.55;color:var(--encre-2);margin:0 0 16px;flex:1}
.dc-c{font-family:var(--mono);font-size:.6rem;letter-spacing:.1em;text-transform:uppercase;
    color:var(--encre-3);padding-top:12px;border-top:1px solid var(--ligne);line-height:1.7}

.ct-d path{fill:var(--papier-2);stroke:var(--papier);stroke-width:2.5;
    transition:fill .25s,stroke .25s}
.ct-d:hover path,.ct-d:focus-visible path{fill:var(--ligne-2)}
.ct-d[data-actif] path{fill:var(--vert)}
.ct-d[data-actif]:hover path{fill:var(--vert-2)}
.ct-d:focus-visible{outline:none}
.ct-d:focus-visible path{stroke:var(--ambre);stroke-width:4}
.ct-l{pointer-events:none;text-anchor:middle}
.ct-n{font-family:var(--mono);font-size:30px;font-weight:600;fill:var(--encre-3);
    letter-spacing:.06em}
.ct-v{font-family:var(--disp);font-size:24px;font-weight:800;fill:var(--encre-2);
    letter-spacing:-.02em}
.ct-la .ct-n{fill:rgba(255,255,255,.6)}
.ct-la .ct-v{fill:#fff}
.ct-p{pointer-events:none}
.ct-p circle{fill:var(--ambre);stroke:var(--papier);stroke-width:3}
.ct-p text{font-family:var(--disp);font-size:24px;font-weight:800;fill:var(--encre);paint-order:stroke;stroke:var(--papier-2);stroke-width:5px;stroke-linejoin:round;
    letter-spacing:-.02em}
.ct-p[data-actif] circle{fill:#fff;stroke:var(--vert);stroke-width:4}
.ct-p[data-actif] text{fill:var(--vert);font-size:29px}
.ct-a{pointer-events:none}
.ct-a circle:first-child{fill:none;stroke:var(--ambre);stroke-width:2.5;opacity:.55}
.ct-a circle:last-of-type{fill:var(--ambre)}
.ct-a text{font-family:var(--mono);font-size:20px;font-weight:600;fill:var(--ambre);paint-order:stroke;stroke:var(--papier-2);stroke-width:5px;stroke-linejoin:round;
    letter-spacing:.1em;text-transform:uppercase}
.ct-a .ct-s{font-family:var(--disp);font-size:25px;font-weight:800;fill:var(--encre);
    letter-spacing:-.02em;text-transform:none}
@media(max-width:700px){
    .ct-n{font-size:38px}.ct-v{font-size:0}
    .ct-p text{font-size:32px}.ct-a text{font-size:26px}.ct-a .ct-s{font-size:32px}
}

/* Les quatre prestations : panneaux bord a bord, texte pose sur la photo.
   La hauteur ne vient pas du format des images mais de l'ecran, bornee haut
   et bas : sur un grand moniteur les panneaux ne s'etirent pas sur toute la
   page, sur un petit portable ils gardent de quoi lire. */
.svs{background:var(--nuit);color:#fff;padding-bottom:0}
.svs .tete h2{color:#fff}
.svs .tete .intro{color:rgba(255,255,255,.72)}
.sv-g{display:flex;margin-top:clamp(20px,3vw,36px)}
.sv{position:relative;flex:1 1 0;min-width:0;overflow:hidden;display:block;
    text-decoration:none;color:#fff;isolation:isolate;
    height:clamp(400px,58vh,620px);
    transition:flex-grow .55s cubic-bezier(.2,.7,.3,1)}
.sv + .sv{border-left:1px solid rgba(255,255,255,.12)}
.sv:hover,.sv:focus-visible{flex-grow:1.8}
.sv img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
    filter:saturate(.78) brightness(.74);
    transition:transform .7s cubic-bezier(.2,.7,.3,1),filter .5s}
.sv:hover img,.sv:focus-visible img{transform:scale(1.05);
    filter:saturate(1) brightness(.88)}
.sv::after{content:"";position:absolute;inset:0;pointer-events:none;
    background:linear-gradient(180deg,rgba(19,23,26,0) 40%,rgba(19,23,26,.92))}
.sv-tx{position:absolute;left:0;right:0;bottom:0;z-index:2;
    padding:clamp(16px,1.8vw,28px);
    padding-bottom:clamp(26px,3vw,44px)}
.sv-n{display:block;font-family:var(--disp);font-weight:800;line-height:1;
    letter-spacing:-.045em;font-size:clamp(1.5rem,2.6vw,2.4rem);
    color:rgba(255,255,255,.36);transition:color .3s}
.sv:hover .sv-n{color:var(--ambre-c)}
.sv-s{display:block;font-family:var(--mono);font-size:.56rem;letter-spacing:.13em;
    text-transform:uppercase;color:var(--ambre-c);font-weight:600;margin:12px 0 5px}
.sv h3{font-size:clamp(1.05rem,1.5vw,1.38rem);margin:0;color:#fff}
.sv-p{display:block;font-size:.88rem;line-height:1.5;color:rgba(255,255,255,.82);
    max-height:0;opacity:0;overflow:hidden;
    transition:max-height .5s,opacity .4s,margin .5s}
.sv:hover .sv-p,.sv:focus-visible .sv-p{max-height:9em;opacity:1;margin-top:9px}
.sv-q{display:block;font-family:var(--mono);font-size:.55rem;letter-spacing:.1em;
    text-transform:uppercase;color:rgba(255,255,255,.5);line-height:1.7;
    max-height:0;opacity:0;overflow:hidden;transition:max-height .5s,opacity .4s,margin .5s}
.sv:hover .sv-q,.sv:focus-visible .sv-q{max-height:5em;opacity:1;margin-top:10px}
.sv-go{display:inline-flex;align-items:center;gap:7px;margin-top:12px;
    font-family:var(--mono);font-size:.56rem;letter-spacing:.13em;
    text-transform:uppercase;color:var(--ambre-c)}
.sv-go svg{transition:transform .3s}
.sv:hover .sv-go svg{transform:translateX(5px)}
/* En dessous de 1020 px on passe a deux colonnes, puis une seule. Le survol
   n'existe plus au doigt : tout le texte reste deplie et le degrade monte
   plus haut pour rester lisible sur les photos claires. */
@media(max-width:1020px){
    .sv-g{flex-wrap:wrap}
    .sv{flex:0 0 50%;height:clamp(330px,44vh,430px)}
    .sv:hover,.sv:focus-visible{flex-grow:0}
    .sv:nth-child(n+3){border-top:1px solid rgba(255,255,255,.12)}
    .sv:nth-child(odd){border-left:0}
    .sv-p,.sv-q{max-height:none;opacity:1;overflow:visible}
    .sv-p{margin-top:9px}
    .sv-q{margin-top:10px}
    .sv img{filter:saturate(.78) brightness(.66)}
    .sv::after{background:linear-gradient(180deg,rgba(19,23,26,.15) 6%,
        rgba(19,23,26,.7) 40%,rgba(19,23,26,.95))}
}
@media(max-width:560px){
    .sv{flex:0 0 100%;height:clamp(360px,50vh,460px)}
    .sv:nth-child(n+2){border-top:1px solid rgba(255,255,255,.12);border-left:0}
}

/* Les avis : note cumulee animee, jauges par plateforme, mur
   defilant. Le prefixe est pv- parce que ap- appartient deja au
   curseur avant/apres. */
.pv{background:var(--nuit);color:#fff;padding:clamp(38px,5vw,74px) 0 0;
    position:relative;overflow:hidden}
.pv::before{content:"";position:absolute;inset:0;pointer-events:none;
    background:radial-gradient(900px circle at 16% 12%,rgba(200,74,24,.2),transparent 60%)}
.pv>*{position:relative;z-index:2}
.pv-h{display:grid;grid-template-columns:auto minmax(0,1fr) minmax(0,.86fr);
    gap:clamp(18px,3vw,52px);align-items:center;
    padding-bottom:clamp(26px,3.4vw,44px)}
.pv-n{display:flex;flex-direction:column;align-items:center;flex:none}
.pv-k{font-family:var(--disp);font-weight:800;letter-spacing:-.055em;line-height:.86;
    font-size:clamp(4.2rem,10vw,7.6rem);color:#fff;
    font-variant-numeric:tabular-nums}
.pv-sur{font-family:var(--mono);font-size:.6rem;letter-spacing:.2em;
    text-transform:uppercase;color:rgba(255,255,255,.42);margin-top:6px}
.pv-e{position:relative;display:inline-block;font-size:clamp(1.5rem,2.8vw,2.1rem);
    letter-spacing:.1em;line-height:1;white-space:nowrap}
.pv-ev{color:rgba(255,255,255,.17)}
.pv-ep{position:absolute;left:0;top:0;color:#fbbc05;overflow:hidden;width:0;
    transition:width 1.5s cubic-bezier(.2,.7,.3,1) .25s}
.pv[data-vu] .pv-ep{width:var(--p)}
.pv-c{display:block;margin-top:14px;font-size:1.02rem;color:rgba(255,255,255,.9)}
.pv-c b{font-family:var(--disp);font-weight:800;font-size:1.34rem;
    font-variant-numeric:tabular-nums}
.pv-m{display:block;margin-top:7px;font-size:.88rem;color:rgba(255,255,255,.56)}
.pv-p{display:flex;flex-direction:column;gap:9px}
.pv-pl{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:13px;
    align-items:center;text-decoration:none;color:inherit;padding:11px 14px;
    background:rgba(255,255,255,.055);border:1px solid rgba(255,255,255,.11);
    transition:background .25s,border-color .25s}
.pv-pl:hover{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.24)}
.pv-pi{display:flex;align-items:center;justify-content:center;width:24px;flex:none}
.pv-pi .g-g{position:static}
.pv-pj{display:flex;align-items:center;justify-content:center;width:22px;height:22px;
    background:#ffd200;color:#1a1a1a;font-family:var(--disp);font-weight:800;
    font-size:.66rem;letter-spacing:-.03em;border-radius:3px}
.pv-pc{min-width:0}
.pv-ph{display:flex;justify-content:space-between;align-items:baseline;gap:10px;
    margin-bottom:6px}
.pv-ph b{font-size:.9rem;font-weight:650}
.pv-ph i{font-style:normal;font-family:var(--mono);font-size:.54rem;
    letter-spacing:.11em;text-transform:uppercase;color:rgba(255,255,255,.5)}
.pv-pb{display:block;height:4px;background:rgba(255,255,255,.14);overflow:hidden}
.pv-pf{display:block;height:100%;width:0;background:var(--ambre-c);
    transition:width 1.3s cubic-bezier(.2,.7,.3,1) .45s}
.pv[data-vu] .pv-pf{width:var(--p)}
.pv-pk{font-family:var(--disp);font-weight:800;font-size:1.22rem;
    letter-spacing:-.03em;color:var(--ambre-c);flex:none}

.pv-mur{position:relative;overflow:hidden;padding:4px 0 clamp(24px,3vw,38px);
    -webkit-mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent);
    mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent)}
.pv-piste{display:flex;gap:14px;width:max-content;
    animation:pv-def 62s linear infinite}
.pv-mur:hover .pv-piste,.pv-mur:focus-within .pv-piste{animation-play-state:paused}
@keyframes pv-def{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@media(prefers-reduced-motion:reduce){
    .pv-piste{animation:none}
    .pv-mur{overflow-x:auto;-webkit-mask-image:none;mask-image:none}
}
.pv-a{flex:0 0 clamp(268px,25vw,330px);margin:0;display:flex;flex-direction:column;
    background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);
    padding:clamp(15px,1.6vw,20px);transition:background .25s,border-color .25s}
.pv-a:hover{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.24)}
.pv-t{color:#fbbc05;font-size:.9rem;letter-spacing:.12em;line-height:1}
.pv-a blockquote{margin:11px 0 0;font-size:.9rem;line-height:1.55;
    color:rgba(255,255,255,.84);flex:1}
.pv-a figcaption{display:flex;align-items:center;gap:10px;margin-top:14px;
    padding-top:12px;border-top:1px solid rgba(255,255,255,.12)}
.pv-av{flex:none;width:34px;height:34px;border-radius:50%;overflow:hidden;
    background:rgba(255,255,255,.14);display:flex;align-items:center;
    justify-content:center}
.pv-av img{width:100%;height:100%;object-fit:cover}
.pv-mo{font-family:var(--disp);font-weight:800;font-size:.9rem;color:#fff}
.pv-q{min-width:0;flex:1}
.pv-q b{display:block;font-size:.84rem;font-weight:650;white-space:nowrap;
    overflow:hidden;text-overflow:ellipsis}
.pv-q i{display:block;font-style:normal;font-family:var(--mono);font-size:.52rem;
    letter-spacing:.11em;text-transform:uppercase;color:rgba(255,255,255,.46);
    margin-top:2px}
/* Le sigle Google fait dix-huit pixels de large : la marge negative etend la
   zone tactile a vingt-huit sans deplacer le dessin. */
.pv-lg{flex:none;opacity:.75;transition:opacity .2s;padding:5px;margin:-5px;
    display:inline-flex;align-items:center}
.pv-lg:hover{opacity:1}
.pv-lg .g-g{position:static}

.pv-cta{display:flex;justify-content:space-between;align-items:center;gap:20px;
    flex-wrap:wrap;padding:clamp(18px,2.2vw,26px) 0 clamp(30px,4vw,52px);
    border-top:1px solid rgba(255,255,255,.14)}
.pv-cta .mono{color:var(--ambre-c);display:block;margin-bottom:5px}
.pv-ct{font-family:var(--disp);font-weight:800;font-size:clamp(1.1rem,1.9vw,1.5rem);
    letter-spacing:-.025em;margin:0}
.pv-ca{display:flex;gap:10px;flex-wrap:wrap}

@media(max-width:1080px){
    .pv-h{grid-template-columns:auto minmax(0,1fr)}
    .pv-p{grid-column:1/-1}
}
@media(max-width:620px){
    .pv-h{grid-template-columns:1fr;text-align:center;justify-items:center}
    .pv-ph{justify-content:space-between}
    .pv-p{width:100%}
    .pv-pl{text-align:left}
    .pv-cta{flex-direction:column;align-items:stretch;text-align:center}
    .pv-ca{justify-content:center}
    .pv-ca .btn{flex:1;justify-content:center}
}
@media(max-width:880px){.av-g{grid-template-columns:1fr}}

/* Les deux plateformes, l'une sous l'autre. Chaque ligne mene a la fiche
   publique correspondante : c'est la seule preuve qui compte, une note qu'on
   affiche sans pouvoir y renvoyer ne vaut rien. */
/* La pastille n'est absolue que sur l'avatar : ailleurs le G reste en flux,
   sinon il s'echappe du document et provoque un debordement de 3 px. */
.av-av .g-g{position:absolute;right:-3px;bottom:-3px;background:#fff;
    border-radius:50%;padding:2px;box-shadow:0 1px 4px rgba(0,0,0,.16)}

.jn-g{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(16px,2vw,28px)}
@media(max-width:900px){.jn-g{grid-template-columns:1fr 1fr}}
@media(max-width:600px){.jn-g{grid-template-columns:1fr}}
.jn{display:flex;flex-direction:column;text-decoration:none;color:inherit;
    background:var(--carte);border:1px solid var(--ligne);
    transition:transform .3s,border-color .3s}
.jn:hover{transform:translateY(-4px);border-color:var(--vert)}
.jn-ph{display:block;aspect-ratio:3/2;overflow:hidden}
.jn-ph img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .55s}
.jn:hover .jn-ph img{transform:scale(1.05)}
.jn-tx{padding:18px 20px 22px;flex:1;display:flex;flex-direction:column}
.jn-m{display:block;font-family:var(--mono);font-size:.58rem;letter-spacing:.12em;
    text-transform:uppercase;color:var(--ambre)}
.jn h3{font-size:1.08rem;margin:9px 0 10px;line-height:1.22}
.jn-c{display:block;font-size:.87rem;line-height:1.55;color:var(--encre-2);flex:1}
.jn-d{display:block;font-family:var(--mono);font-size:.58rem;letter-spacing:.11em;
    text-transform:uppercase;color:var(--encre-3);margin-top:14px;padding-top:11px;
    border-top:1px solid var(--ligne)}

.rc-g{display:grid;grid-template-columns:repeat(5,1fr);gap:1px;
    background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.14)}
@media(max-width:1020px){.rc-g{grid-template-columns:repeat(2,1fr)}}
@media(max-width:520px){.rc-g{grid-template-columns:1fr}}
.rc{background:var(--nuit);padding:clamp(20px,2.2vw,26px);text-decoration:none;color:#fff;
    display:flex;flex-direction:column;transition:background .25s}
.rc:hover,.rc:focus-visible{background:var(--nuit-3)}
.rc-i{display:grid;place-items:center;width:44px;height:44px;
    border:1px solid rgba(255,255,255,.22);color:var(--ambre-c);margin-bottom:15px;
    transition:background .25s,color .25s,border-color .25s}
.rc:hover .rc-i{background:var(--ambre);color:var(--nuit);border-color:var(--ambre)}
.rc-n{display:block;font-family:var(--mono);font-size:.6rem;letter-spacing:.15em;
    text-transform:uppercase;color:var(--ambre-c);font-weight:600}
.rc-t{display:block;font-family:var(--disp);font-weight:800;font-size:1.04rem;
    letter-spacing:-.02em;margin:7px 0 9px;line-height:1.2}
.rc-p{display:block;font-size:.85rem;line-height:1.55;color:rgba(255,255,255,.66)}

.chal .ch-g2{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);
    gap:clamp(20px,3vw,46px);align-items:center;margin-bottom:clamp(24px,3vw,40px)}
@media(max-width:940px){.chal .ch-g2{grid-template-columns:1fr;gap:22px}}
.chal .ch-t p{color:var(--encre-2);margin-bottom:12px;
    font-size:clamp(.88rem,.83rem + .22vw,.98rem);line-height:1.58}
.chal .ch-t b{color:var(--encre)}
.chal .ch-t .encart{font-size:clamp(.84rem,.8rem + .18vw,.93rem);line-height:1.55;
    padding:15px 17px;margin-top:16px}
.chal .tete h2{font-size:clamp(1.55rem,calc(1rem + 2.4vw),2.7rem)}
.chal .tete .intro{font-size:clamp(.88rem,.85rem + .2vw,.96rem);max-width:38ch}
.chal .carte svg{max-height:min(62vh,560px)}

.aide{position:fixed;left:clamp(14px,2vw,26px);z-index:120;
    bottom:calc(var(--h-appel,0px) + clamp(14px,2vw,26px))}
.aide-b{position:relative;display:inline-flex;align-items:center;gap:11px;
    background:var(--vert);color:#fff;border:0;cursor:pointer;font:inherit;
    padding:12px 20px 12px 14px;border-radius:34px;
    box-shadow:0 14px 34px -12px rgba(19,23,26,.5);
    transition:background .25s,transform .25s,box-shadow .25s}
.aide-b:hover{background:var(--vert-2);transform:translateY(-2px);
    box-shadow:0 18px 40px -12px rgba(19,23,26,.6)}
.aide-o{position:absolute;left:20px;top:50%;width:26px;height:26px;border-radius:50%;
    transform:translate(-50%,-50%);background:var(--ambre);opacity:.55;
    animation:pouls 2.6s ease-out infinite;pointer-events:none}
@keyframes pouls{0%{transform:translate(-50%,-50%) scale(.7);opacity:.6}
    70%{transform:translate(-50%,-50%) scale(2.1);opacity:0}
    100%{opacity:0}}
.aide-ic{position:relative;display:grid;place-items:center;width:26px;height:26px;
    animation:bascule 4.5s ease-in-out infinite;transform-origin:50% 60%}
@keyframes bascule{0%,72%,100%{transform:rotate(0)}
    78%{transform:rotate(-13deg)}84%{transform:rotate(11deg)}
    90%{transform:rotate(-7deg)}95%{transform:rotate(0)}}
.aide-t{font-family:var(--disp);font-weight:800;font-size:.92rem;letter-spacing:-.02em;
    white-space:nowrap}
.aide[data-ouvert] .aide-o{animation:none;opacity:0}
@media(prefers-reduced-motion:reduce){.aide-o,.aide-ic{animation:none}}

.aide-p{position:absolute;left:0;bottom:calc(100% + 12px);width:min(420px,calc(100vw - 28px));
    background:var(--carte);border:1px solid var(--ligne);
    box-shadow:0 30px 70px -24px rgba(10,12,14,.5);
    display:flex;flex-direction:column;max-height:min(620px,calc(100vh - 120px));
    opacity:0;transform:translateY(10px);transition:opacity .24s,transform .24s}
.aide-p[hidden]{display:none}
.aide[data-ouvert] .aide-p{opacity:1;transform:none}
.aide-h{display:flex;justify-content:space-between;align-items:flex-start;gap:14px;
    padding:16px 18px;background:var(--nuit);color:#fff;flex:none}
.aide-h .mono{color:var(--ambre-c);display:block;margin-bottom:5px}
.aide-h b{font-family:var(--disp);font-weight:800;font-size:1.02rem;letter-spacing:-.02em}
.aide-x{background:none;border:0;cursor:pointer;color:rgba(255,255,255,.6);padding:0;
    display:grid;place-items:center;flex:none}
.aide-x:hover{color:#fff}
.aide-c{padding:16px 18px;overflow-y:auto;flex:1;overscroll-behavior:contain}
.aide-f{display:flex;border-top:1px solid var(--ligne);flex:none}
.aide-f a{flex:1;display:inline-flex;align-items:center;justify-content:center;gap:7px;
    padding:13px 10px;text-decoration:none;font-family:var(--mono);font-size:.62rem;
    letter-spacing:.12em;text-transform:uppercase;font-weight:600;
    color:var(--encre-2);transition:background .2s,color .2s}
.aide-f a:first-child{border-right:1px solid var(--ligne);color:var(--vert)}
.aide-f a:hover{background:var(--vert);color:#fff}
@media(max-width:520px){
    .aide{left:10px;right:auto}
    /* Le panneau etait en left:0;right:0 : il s'etirait sur son conteneur, or
       .aide est reduit a la taille du bouton rond, cinquante-deux pixels. Le
       panneau sortait donc en bandeau vertical illisible. On lui donne une
       largeur reelle, mesuree sur l'ecran et non sur le parent. */
    .aide-p{width:calc(100vw - 20px);left:0;right:auto;
        max-height:calc(100vh - var(--h-appel,0px) - 100px)}
    .aide-t{display:none}
    .aide-b{padding:13px;border-radius:50%}
    /* Le panneau couvre presque l'ecran : un voile dit ce qui est actif. Il ne
       recoit pas les clics, la fermeture au clic exterieur passe a travers. */
    .aide[data-ouvert]::before{content:"";position:fixed;inset:0;z-index:-1;
        background:rgba(10,12,14,.5);pointer-events:none}
}

.aide .fq-r{position:relative}
.aide .fq-r svg{position:absolute;left:13px;top:50%;transform:translateY(-50%);
    color:var(--encre-3);pointer-events:none}
.aide input{width:100%;font:inherit;font-size:.92rem;padding:12px 40px 12px 38px;
    background:var(--papier);border:1px solid var(--ligne-2);color:var(--encre)}
.aide input::-webkit-search-cancel-button{display:none}
.aide input:focus{outline:none;border-color:var(--vert);
    box-shadow:0 0 0 3px rgba(31,81,50,.13)}
.fq-eff{position:absolute;right:9px;top:50%;transform:translateY(-50%);
    background:var(--ligne);border:0;width:24px;height:24px;border-radius:50%;
    cursor:pointer;display:grid;place-items:center;color:var(--encre-2)}
.fq-eff:hover{background:var(--vert);color:#fff}
.fq-suj{display:flex;flex-wrap:wrap;gap:6px;margin-top:12px}
.fq-suj button{font:inherit;font-size:.76rem;background:var(--papier-2);
    border:1px solid var(--ligne);padding:5px 11px;border-radius:20px;cursor:pointer;
    color:var(--encre-2);transition:background .2s,color .2s,border-color .2s}
.fq-suj button:hover{background:var(--vert);color:#fff;border-color:var(--vert)}
.fq-etat{min-height:1.1em;margin-top:12px;font-family:var(--mono);font-size:.58rem;
    letter-spacing:.13em;text-transform:uppercase;color:var(--vert)}
.fq-l{list-style:none;margin:4px 0 0;padding:0;display:grid;gap:1px;
    background:var(--ligne);border:1px solid var(--ligne)}
.fq-l li::before{display:none}
.fq-i{display:flex}
.fq-i[hidden]{display:none}
.fq-i button{width:100%;background:var(--carte);border:0;cursor:pointer;font:inherit;
    text-align:left;align-items:flex-start;padding:13px 15px;display:flex;gap:12px;
    justify-content:space-between;color:var(--encre);transition:background .2s}
.fq-i button:hover,.fq-i[data-sur] button{background:var(--papier-2)}
.fq-i[data-sur] button{box-shadow:inset 3px 0 0 var(--vert)}
.fq-i button span{font-weight:500;line-height:1.4;font-size:.88rem}
.fq-i button svg{flex:none;color:var(--vert);margin-top:2px;transition:transform .25s}
.fq-i button:hover svg,.fq-i[data-sur] button svg{transform:translateX(4px)}
.fq-vide{margin-top:14px;background:var(--nuit);color:#fff;padding:16px 18px}
.fq-vt{font-family:var(--disp);font-weight:800;font-size:1rem;letter-spacing:-.02em;
    margin-bottom:7px}
.fq-vide p{color:rgba(255,255,255,.74);font-size:.87rem;line-height:1.5}
.fq-va{margin-top:14px}
.fq-va .btn{width:100%;justify-content:center;text-align:center}
.fq-d{border:0;padding:0;margin:auto;width:min(640px,92vw);background:var(--carte);
    box-shadow:0 40px 90px -30px rgba(10,12,14,.55)}
.fq-d::backdrop{background:rgba(19,23,26,.74)}
.fq-dh{display:flex;justify-content:space-between;align-items:center;
    padding:18px 24px;border-bottom:1px solid var(--ligne)}
.fq-dh .mono{color:var(--vert)}
.fq-dx{background:none;border:0;cursor:pointer;color:var(--encre-3);padding:0;
    display:grid;place-items:center}
.fq-dx:hover{color:var(--encre)}
.fq-d h3{font-size:clamp(1.15rem,2.2vw,1.5rem);padding:24px 24px 0;line-height:1.25}
.fq-d>p{padding:14px 24px 0;color:var(--encre-2);line-height:1.65}
.fq-df{display:flex;gap:10px;flex-wrap:wrap;padding:24px}
.fq-dn{display:flex;border-top:1px solid var(--ligne)}
.fq-dn button{flex:1;background:var(--papier-2);border:0;cursor:pointer;font:inherit;
    font-family:var(--mono);font-size:.6rem;letter-spacing:.12em;text-transform:uppercase;
    padding:14px 10px;color:var(--encre-2);transition:background .2s,color .2s}
.fq-dn button:first-child{border-right:1px solid var(--ligne)}
.fq-dn button:hover{background:var(--vert);color:#fff}
@media(max-width:820px){.eq-band{grid-template-columns:1fr;gap:20px}}
@media(max-width:1080px){.eq-g{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.eq-g{grid-template-columns:1fr}}

@media(max-width:560px){.eq-ph,.eq-ph img{height:160px}}

/* Cibles tactiles : les liens de liste du pied de page et du fil d'ariane
   faisaient 16 px de haut. On leur donne une zone cliquable confortable
   sans changer la mise en page perçue. */
footer ul a{display:inline-block;padding:5px 0}
footer .adr a{display:inline-block;padding:4px 0}
.fb a{display:inline-block;padding:5px 0}
.fil a,.fil li{display:inline-block;padding:3px 0}

/* Les liens isoles passent a 24 px de haut minimum. Les liens en pleine
   phrase gardent leur hauteur : les elargir casserait l'interlignage, et la
   regle de taille de cible ne s'applique pas aux liens dans un texte. */
.nav-2 a{display:inline-block;padding:4px 0}
.adr a{display:inline-block;padding:5px 0}
.jns .lien,.chal .lien,.chantiers-d .lien{display:inline-block;padding:4px 0}

/* Second rang de la carte : desservi, mais sans arborescence de pages. Trace
   et numerote, sans lien, dans un remplissage plus clair que les huit. */
.ct-sup path{pointer-events:none}
.ct-fil{stroke:var(--ligne-2);stroke-width:1.5;fill:none}
.ct-ls .ct-n{font-size:23px}
.ct-ls .ct-v{font-size:15px}
