/* Socle commun aux modèles. Ne porte aucune couleur ni police : tout vient des variables du style.css du modèle. */
[hidden]{display:none!important}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility}
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto!important}
.lenis.lenis-stopped{overflow:clip}
body{margin:0;background:var(--fond);color:var(--encre);font-family:var(--texte);font-size:17px;line-height:1.6;overflow-x:clip}
body.menu-ouvert{overflow:hidden}
img{display:block;width:100%;height:100%;object-fit:cover}
a{color:inherit;text-decoration:none}
h1,h2,h3,p,ul,figure{margin:0;padding:0}
ul{list-style:none}
button,input,textarea,select{font:inherit;color:inherit}
button{background:none;border:0;padding:0;cursor:pointer}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:4px}
.wrap{width:min(100% - 2*var(--marge),1320px);margin-inline:auto}
section{position:relative}
.cadre{overflow:hidden;border-radius:var(--rayon);position:relative;background:var(--panneau)}
.cadre img{transform:scale(1.001);transition:transform 1.2s cubic-bezier(.2,.7,.2,1)}
.cadre[data-parallax-box] img{height:116%;will-change:transform}
a.cadre:hover img,.survol:hover .cadre img{transform:scale(1.04)}

/* Bouton : libellé + pastille flèche, la pastille tourne au survol */
.btn{display:inline-flex;align-items:center;gap:4px;font-weight:600;font-size:15px;line-height:1;white-space:nowrap}
.btn__l{display:block;padding:17px 26px;border-radius:999px;background:var(--btn-fond);color:var(--btn-encre);transition:background .3s,color .3s}
.btn__f{width:49px;height:49px;border-radius:50%;display:grid;place-items:center;background:var(--btn-fond);color:var(--btn-encre);transition:transform .45s cubic-bezier(.2,.7,.2,1)}
.btn__f::before{content:"";width:14px;height:14px;background:currentColor;-webkit-mask:var(--fl) center/contain no-repeat;mask:var(--fl) center/contain no-repeat}
:root{--fl:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 14'%3E%3Cpath d='M2 12 12 2M4 2h8v8' fill='none' stroke='%23000' stroke-width='1.6'/%3E%3C/svg%3E")}
.btn:hover .btn__f{transform:rotate(45deg)}
.btn--clair{--btn-fond:var(--encre-sur);--btn-encre:var(--fond-sur)}
.btn--petit .btn__l{padding:13px 20px;font-size:14px}.btn--petit .btn__f{width:41px;height:41px}

/* Navigation */
.nav{position:fixed;z-index:50;top:0;left:0;right:0;display:flex;align-items:center;justify-content:space-between;gap:24px;padding:20px var(--marge);transition:transform .5s cubic-bezier(.2,.7,.2,1),background .4s,color .4s,padding .4s}
.nav__logo{font-family:var(--titre);font-size:22px;font-weight:600;letter-spacing:-.01em}
.nav__liens{display:flex;gap:30px;font-size:15px}
.nav__liens a{position:relative;padding:4px 0}
.nav__liens a::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:currentColor;transform:scaleX(0);transform-origin:left;transition:transform .4s cubic-bezier(.2,.7,.2,1)}
.nav__liens a:hover::after{transform:scaleX(1)}
.nav__burger{display:none;width:46px;height:46px;border-radius:50%;position:relative;background:var(--nav-pastille,rgba(255,255,255,.14));-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.nav__burger i{position:absolute;left:14px;right:14px;height:1.6px;background:currentColor;transition:transform .35s,top .35s}
.nav__burger i:first-child{top:19px}.nav__burger i:last-child{top:26px}
.menu-ouvert .nav__burger i:first-child{top:22px;transform:rotate(45deg)}
.menu-ouvert .nav__burger i:last-child{top:22px;transform:rotate(-45deg)}
.nav--cache{transform:translateY(-110%)}
.menu{position:fixed;inset:0;z-index:45;background:var(--fond-menu,var(--fond));color:var(--encre-menu,var(--encre));display:flex;flex-direction:column;justify-content:center;gap:10px;padding:90px var(--marge) 40px;opacity:0;visibility:hidden;transition:opacity .35s,visibility .35s}
.menu a{font-family:var(--titre);font-size:38px;line-height:1.25}
.menu-ouvert .menu{opacity:1;visibility:visible}
.menu-ouvert .nav{color:var(--encre-menu,var(--encre))!important;background:transparent!important}
@media(max-width:860px){.nav__liens,.nav .btn{display:none}.nav__burger{display:block}}

/* Carrousel */
.car__piste{display:flex;gap:var(--ecart,20px);overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;-ms-overflow-style:none;overscroll-behavior-x:contain}
.car__piste::-webkit-scrollbar{display:none}
.car__piste>*{scroll-snap-align:start;flex:none}
.car__nav{display:flex;align-items:center;gap:10px}
.car__nav button{width:50px;height:50px;border-radius:50%;border:1px solid var(--trait);display:grid;place-items:center;transition:background .3s,color .3s,opacity .3s}
.car__nav button::before{content:"";width:14px;height:14px;background:currentColor;-webkit-mask:var(--fl) center/contain no-repeat;mask:var(--fl) center/contain no-repeat;transform:rotate(45deg)}
.car__nav [data-prec]::before{transform:rotate(225deg)}
.car__nav button:hover{background:var(--encre);color:var(--fond)}
.car__nav button:disabled{opacity:.3;pointer-events:none}

/* Défilement continu */
.defile{display:flex;overflow:hidden;white-space:nowrap}
.defile>div{display:flex;flex:none;animation:defile 34s linear infinite}
@keyframes defile{to{transform:translateX(-100%)}}

/* Formulaire */
.champ{display:block;margin-bottom:18px}
.champ span{display:block;font-size:14px;margin-bottom:6px;opacity:.75}
.champ input,.champ textarea,.champ select{width:100%;padding:14px 0;background:transparent;border:0;border-bottom:1px solid var(--trait);border-radius:0;outline:0;transition:border-color .3s;min-height:48px}
.champ input:focus,.champ textarea:focus,.champ select:focus{border-color:var(--accent)}
.champ textarea{resize:vertical;min-height:96px}
.form__ok{margin-top:14px;font-size:15px;min-height:1.5em}
.pied-fictif{font-size:13px;opacity:.6}

/* Apparitions : uniquement si JavaScript tourne */
.js [data-reveal]{opacity:0;transform:translateY(30px);transition:opacity 1s cubic-bezier(.2,.7,.2,1) var(--d,0s),transform 1s cubic-bezier(.2,.7,.2,1) var(--d,0s)}
.js [data-reveal].vu{opacity:1;transform:none}
.js [data-clip]{clip-path:inset(14% 10% 14% 10% round var(--rayon));transition:clip-path 1.5s cubic-bezier(.2,.75,.15,1) var(--d,0s)}
.js [data-clip].vu{clip-path:inset(0 0 0 0 round var(--rayon))}
.js [data-clip]>img{transform:scale(1.22);transition:transform 1.8s cubic-bezier(.2,.75,.15,1) var(--d,0s)}
.js [data-clip].vu>img{transform:scale(1.001)}
.mot{display:inline-block;overflow:hidden;vertical-align:top;padding-top:.2em;margin-top:-.2em;padding-bottom:.16em;margin-bottom:-.16em}
.mot>i{display:inline-block;font-style:inherit;will-change:transform}
.js [data-mots] .mot>i{transform:translateY(112%);transition:transform 1.1s cubic-bezier(.2,.75,.15,1);transition-delay:calc(var(--i)*38ms + var(--d,0s))}
.js [data-mots].vu .mot>i{transform:none}
[data-scrub] .s{transition:opacity .25s linear}
.js [data-scrub] .s{opacity:.16}
@media(prefers-reduced-motion:reduce){
 .js [data-reveal],.js [data-clip],.js [data-clip]>img,.js [data-mots] .mot>i,.js [data-scrub] .s{opacity:1!important;transform:none!important;clip-path:none!important;transition:none!important}
 .defile>div{animation:none}
}

.en-cadre{scrollbar-width:none}.en-cadre::-webkit-scrollbar{display:none}
/* Pages légales des sites clients (outils/pages-legales-client.mjs) */
.page-legale{max-width:820px;padding-block:60px 90px}
.page-legale h1{margin:24px 0 8px}.page-legale .maj{opacity:.6;margin-bottom:30px}
.page-legale h2{font-size:20px;margin:34px 0 10px}.page-legale p{line-height:1.7}
.page-legale a{text-decoration:underline}.page-legale mark{background:#f7d9d3;color:#7a1d0d;padding:0 4px}
.page-legale .tab{overflow-x:auto}.page-legale table{width:100%;min-width:600px;border-collapse:collapse;font-size:14px}
.page-legale th,.page-legale td{text-align:left;vertical-align:top;padding:10px 8px;border-bottom:1px solid var(--trait,#ddd)}
