:root{--navy:#081630;--navy2:#0E2142;--cream:#F5F0E6;--ink:#081630;--mut:#5A6478;--line:#DDD6C6;
box-sizing:border-box;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}
html{scroll-behavior:smooth;scroll-padding-top:env(safe-area-inset-top,0px);background:var(--navy)}
*{box-sizing:border-box}
body{margin:0;background:var(--cream);color:var(--ink);font:16px/1.7 Inter,Montserrat,system-ui,sans-serif;padding-bottom:70px}
.w{max-width:1000px;margin:auto;padding:0 24px}
.dark{background:var(--navy);color:var(--cream)}
.dark p{color:#B9C0CE}
section{padding:72px 0}
h1,h2,h3{font-weight:600;line-height:1.15;margin:0 0 16px;letter-spacing:-.01em}
h1{font-size:clamp(2rem,7vw,3.4rem)}h2{font-size:clamp(1.6rem,5vw,2.3rem)}h3{font-size:1.1rem}
p{margin:0 0 16px;color:var(--mut)}
.lab{font-size:.72rem;letter-spacing:.3em;text-transform:uppercase;margin-bottom:14px;opacity:.7;display:block}
.btn{display:inline-block;background:var(--cream);color:var(--navy);font-weight:600;padding:15px 30px;border-radius:2px;text-decoration:none;letter-spacing:.04em;font-size:.95rem}
.btn.n{background:var(--navy);color:var(--cream)}
.btn.o{background:none;color:var(--cream);border:1px solid #5d6b86;margin-left:8px}
header{position:sticky;top:env(safe-area-inset-top,0px);background:var(--navy);z-index:5;border-bottom:1px solid #1a2c4d}
header .w{display:flex;justify-content:space-between;align-items:center;height:64px}
header img{height:44px;width:auto;mix-blend-mode:lighten}
nav a{color:var(--cream);text-decoration:none;margin-left:26px;font-size:.78rem;letter-spacing:.18em;text-transform:uppercase;display:none}
@media(min-width:800px){nav a{display:inline}}
.hero{text-align:center;padding:56px 0 80px}
.hero img{width:min(300px,70vw);height:auto;mix-blend-mode:lighten;margin-bottom:28px}
.hero p{max-width:520px;margin:0 auto 28px}
.hero .sm{font-size:.78rem;letter-spacing:.14em;text-transform:uppercase;color:#8E99AE;margin-top:28px}
.list{border-top:1px solid var(--line)}
.row{display:flex;gap:20px;padding:22px 0;border-bottom:1px solid var(--line);align-items:baseline}
.row b{font-size:.8rem;letter-spacing:.2em;color:var(--mut);min-width:32px}
.row div{flex:1}.row p{margin:4px 0 0}
.soon{opacity:.5}
.ba{position:relative;height:280px;overflow:hidden;background:#C9C2B2}
.ba div{position:absolute;inset:0;padding:16px;font-size:.72rem;letter-spacing:.3em;color:var(--cream);display:flex;align-items:flex-end}
.ba .aft{background:linear-gradient(135deg,#8FA0BC,#D9D3C4);justify-content:flex-end;color:var(--navy)}
.ba .bef{background:linear-gradient(135deg,#2a2f3a,#4a4a42);clip-path:inset(0 50% 0 0)}
.ba .bar{left:50%;right:auto;width:2px;padding:0;background:var(--cream)}
.ba input{position:absolute;inset:0;width:100%;height:100%;opacity:0;margin:0;cursor:ew-resize}
.ph{font-size:.8rem;margin-top:10px}
.grid{display:grid;gap:20px;grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}
.q{border-left:1px solid var(--navy);padding-left:18px}
.tags span{display:inline-block;border:1px solid #33456a;padding:6px 16px;margin:0 8px 8px 0;font-size:.88rem;color:var(--cream)}
.map{height:180px;border:1px dashed #33456a;display:grid;place-items:center;color:#8E99AE;font-size:.85rem;margin-top:16px}
.cta{text-align:center}.cta p{max-width:480px;margin:0 auto 26px}
footer{background:var(--navy);color:#8E99AE;font-size:.78rem;letter-spacing:.08em;text-align:center;padding:26px 24px 90px}
.fix{position:fixed;left:0;right:0;bottom:0;display:flex;background:var(--navy);border-top:1px solid #1a2c4d;padding-bottom:env(safe-area-inset-bottom,0px);z-index:9}
.fix a{flex:1;text-align:center;padding:16px;color:var(--cream);text-decoration:none;font-size:.78rem;letter-spacing:.2em;text-transform:uppercase}
.fix a+a{border-left:1px solid #1a2c4d}
@media(min-width:800px){.fix{display:none}body{padding-bottom:0}}

/* ===== Ajouts multi-pages ===== */
.hero2{padding:64px 0 56px}.hero2 h1{font-size:clamp(2.1rem,6vw,3.4rem)}
.btn.o2{background:none;border:1px solid var(--navy);color:var(--navy);margin-left:8px}
@media(max-width:560px){.btn.o2{margin:12px 0 0}}
.tags span{color:var(--navy);border-color:var(--line)}.map{color:var(--mut);border-color:var(--line)}
.sm2{font-size:.75rem;letter-spacing:.14em;text-transform:uppercase;color:var(--mut);margin-top:28px}
.menu{background:none;border:1px solid #5d6b86;color:var(--cream);padding:8px 14px;font:inherit;font-size:.75rem;letter-spacing:.2em;text-transform:uppercase}
nav{display:none;position:absolute;top:64px;left:0;right:0;background:var(--navy);padding:8px 24px 20px}
nav.open{display:block}
nav a{display:block!important;margin:0;padding:14px 0;border-bottom:1px solid #1a2c4d}
@media(min-width:800px){.menu{display:none}nav{display:flex;position:static;padding:0;background:none}nav a{display:inline-block!important;border:0;margin-left:24px;padding:0}}
nav a.on{border-bottom:1px solid var(--cream)}
.ba .bef{clip-path:inset(0 calc(100% - var(--p,50%)) 0 0)}.ba .bar{left:var(--p,50%)}
.ph-img{background:#D9D3C4;display:grid;place-items:center;color:var(--mut);font-size:.8rem;min-height:220px}
.two{display:grid;gap:32px;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));align-items:start}
.svc{padding:48px 0;border-top:1px solid var(--line)}.svc h3{font-size:.8rem;letter-spacing:.2em;text-transform:uppercase;color:var(--mut);margin:18px 0 4px}
.svc p{margin:0 0 8px}
.steps{counter-reset:s}.step{display:flex;gap:22px;padding:26px 0;border-top:1px solid var(--line)}
.step:before{counter-increment:s;content:"0" counter(s);font-size:1.6rem;font-weight:600;min-width:46px}
.filters{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 24px}
.filters button{background:none;border:1px solid var(--line);padding:9px 18px;font:inherit;font-size:.82rem;cursor:pointer;color:var(--ink)}
.filters button.on{background:var(--navy);color:var(--cream);border-color:var(--navy)}
.gal{display:grid;gap:24px;grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}
details{border-top:1px solid var(--line);padding:18px 0}details:last-of-type{border-bottom:1px solid var(--line)}
summary{cursor:pointer;font-weight:600;list-style:none}summary::after{content:"+";float:right}details[open] summary::after{content:"–"}
details p{margin:12px 0 0}
form label{display:block;font-size:.8rem;letter-spacing:.12em;text-transform:uppercase;margin:18px 0 6px}
form input,form select,form textarea{width:100%;padding:14px;border:1px solid var(--line);background:#fff;font:inherit;border-radius:2px;color:var(--ink)}
form .chk{display:flex;gap:10px;align-items:flex-start;text-transform:none;letter-spacing:0;font-size:.85rem}form .chk input{width:auto;margin-top:5px}
#ok{display:none;border:1px solid var(--navy);padding:22px;margin-top:20px}
.ph-t{background:#fff3c4;color:#5a4a00;padding:0 4px}
.legal h2{font-size:1.2rem;margin-top:32px}
footer a{color:#B9C0CE;margin:0 8px}footer .zf{margin-bottom:12px}
a:focus-visible,button:focus-visible,input:focus-visible,summary:focus-visible{outline:3px solid #7FA6FF;outline-offset:2px}
@media(prefers-reduced-motion:no-preference){.rv{opacity:0;transform:translateY(14px);transition:.6s}.rv.in{opacity:1;transform:none}}