
:root{
 --brand:#1457b8;--brand-d:#0a2547;--brand-2:#2e86e6;--brand-soft:#eaf1fb;
 --ink:#0e1a2b;--ink2:#41526b;--muted:#6b7a90;--bg:#fff;--surface:#f3f7fc;--line:#e1e9f3;
 --font:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
 --max:1180px;--ease:cubic-bezier(.23,1,.32,1);--r:16px;
}
*{box-sizing:border-box;margin:0}
html{scroll-behavior:smooth}
body{font-family:var(--font);color:var(--ink);background:var(--bg);line-height:1.6;-webkit-font-smoothing:antialiased}
.wrap{max-width:var(--max);margin:0 auto;padding:0 32px}
a{color:inherit;text-decoration:none}
svg{display:block}
h1,h2,h3,h4{line-height:1.08;letter-spacing:-.025em;font-weight:800}
h1{font-size:clamp(34px,5.2vw,62px)}
h2{font-size:clamp(26px,3.4vw,42px)}
img{max-width:100%}
.kicker{font-size:12.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--brand);font-weight:700;margin-bottom:14px}
.lead{font-size:18px;color:var(--ink2);max-width:60ch}
/* reveal (visible sans JS) */
.reveal{opacity:1;transform:none}
.js .reveal{opacity:0;transform:translateY(18px);transition:opacity .6s var(--ease),transform .6s var(--ease)}
.js .reveal.in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.js .reveal{opacity:1!important;transform:none!important;transition:none}}
/* nav */
.nav{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.82);backdrop-filter:blur(10px);border-bottom:1px solid transparent;transition:border-color .3s var(--ease),box-shadow .3s var(--ease)}
.nav.stuck{border-color:var(--line);box-shadow:0 6px 24px rgba(10,37,71,.06)}
.nav .wrap{display:flex;align-items:center;gap:28px;height:76px}
.brand{display:flex;align-items:center}
.links{display:flex;gap:26px;margin-left:auto;font-weight:600;font-size:15px}
.links a{color:var(--ink2);padding:4px 0;position:relative}
.links a:hover{color:var(--ink)}
.links a.on{color:var(--brand)}
.links a.on::after{content:"";position:absolute;left:0;right:0;bottom:-2px;height:2px;background:var(--brand);border-radius:2px}
.tel{display:inline-flex;align-items:center;gap:8px;background:var(--brand);color:#fff;font-weight:700;font-size:15px;padding:10px 16px;border-radius:12px;transition:background .15s var(--ease),transform .15s var(--ease)}
.tel:hover{background:#0f47a0;transform:translateY(-1px)}
/* buttons */
.btn{display:inline-flex;align-items:center;gap:9px;font-weight:700;font-size:16px;padding:14px 22px;border-radius:13px;transition:all .15s var(--ease)}
.btn-pri{background:var(--brand);color:#fff;box-shadow:0 8px 22px rgba(20,87,184,.28)}
.btn-pri:hover{background:#0f47a0;transform:translateY(-2px);box-shadow:0 12px 28px rgba(20,87,184,.34)}
.btn-ghost{border:1.5px solid rgba(255,255,255,.6);color:#fff}
.btn-ghost:hover{background:rgba(255,255,255,.12)}
.link{display:inline-flex;align-items:center;gap:7px;color:var(--brand);font-weight:700}
.link svg{transition:transform .2s var(--ease)}
.link:hover svg{transform:translateX(3px)}
/* hero */
.hero{position:relative;color:#fff;overflow:hidden;background:var(--brand-d)}
.hero-bg{position:absolute;inset:-6% 0;overflow:hidden}
.hero-bg img{width:100%;height:112%;object-fit:cover;opacity:.32;animation:ken 20s ease-in-out infinite alternate}
@keyframes ken{from{transform:scale(1.05)}to{transform:scale(1.16) translateY(-2%)}}
.hero::after{content:"";position:absolute;inset:0;background:var(--brand-d);opacity:.62}
.hero-in{position:relative;z-index:2;padding:104px 32px 96px}
.hero .eyebrow{font-size:13px;letter-spacing:.14em;text-transform:uppercase;color:#bcd3f5;font-weight:700;margin-bottom:20px}
.hero h1{letter-spacing:-.035em}
/* titre kinétique (CSS pur, visible sans JS) */
.kine{font-size:clamp(34px,5.2vw,62px);letter-spacing:-.035em;font-weight:800;line-height:1.04}
.kine .kw{display:inline-block;overflow:hidden;vertical-align:top}
.kine .kw>span{display:inline-block;transform:translateY(110%);animation:kinup 1s var(--ease) both;animation-delay:var(--kd)}
@keyframes kinup{to{transform:none}}
@media(prefers-reduced-motion:reduce){.kine .kw>span{transform:none;animation:none}}
.hero .sub{font-size:20px;color:#dce8fa;max-width:48ch;margin-top:22px}
.actions{display:flex;gap:14px;flex-wrap:wrap;margin-top:34px}
/* stats */
.stats{background:var(--brand-d);border-top:1px solid rgba(255,255,255,.08)}
.statrow{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;padding:30px 32px}
.stat{display:flex;flex-direction:column;gap:6px;color:#fff}
.stat .num{font-size:40px;font-weight:800;letter-spacing:-.03em;line-height:1}
.stat .lbl{font-size:13.5px;color:#aac3ea;display:flex;align-items:center;gap:7px}
.stars{display:inline-flex;gap:1px;color:#f4a72c}
.certs-stat{flex-direction:row;align-items:center;gap:10px;flex-wrap:wrap}
.cert{display:inline-flex;align-items:center;gap:6px;font-size:13px;font-weight:700;color:#fff;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.18);padding:7px 11px;border-radius:9px}
.cert svg{color:#7fb0f4}
/* sections */
.sec{padding:92px 0}
.band{background:var(--surface)}
.sec-head{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;margin-bottom:36px}
/* services grid */
.svcs{display:grid;grid-template-columns:repeat(2,1fr);gap:18px;margin-top:42px}
.svc{display:block;background:var(--bg);border:1px solid var(--line);border-radius:var(--r);padding:30px;transition:transform .2s var(--ease),box-shadow .2s var(--ease),border-color .2s}
.svc:hover{transform:translateY(-3px);box-shadow:0 16px 40px rgba(10,37,71,.08);border-color:#cfe0f5}
.svc-i{display:inline-flex;color:var(--brand);background:var(--brand-soft);padding:11px;border-radius:12px;margin-bottom:18px}
.svc-i.big{padding:13px}
.svc h3{font-size:21px;margin-bottom:8px}
.svc p{color:var(--ink2);font-size:15.5px}
.svc .more{display:inline-flex;align-items:center;gap:6px;color:var(--brand);font-weight:700;font-size:14.5px;margin-top:16px}
/* split */
.splitin{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center}
.round{border-radius:var(--r);width:100%;height:100%;object-fit:cover;max-height:420px}
.ticks{list-style:none;padding:0;margin:22px 0 28px;display:grid;gap:11px}
.ticks li{display:flex;align-items:center;gap:10px;font-weight:600;color:var(--ink)}
.ticks li svg{color:var(--brand);flex:none}
.ticks.two{grid-template-columns:1fr 1fr}
/* galerie */
.gal4{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.gal{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.gtile{position:relative;border-radius:var(--r);overflow:hidden;display:block}
.gtile img{width:100%;height:240px;object-fit:cover;transition:transform .5s var(--ease)}
.gtile:hover img{transform:scale(1.06)}
.gtile span,.gtile figcaption{position:absolute;left:0;right:0;bottom:0;padding:14px 16px;color:#fff;font-weight:600;font-size:14.5px;background:linear-gradient(to top,rgba(10,37,71,.82),transparent)}
.gal4 .gtile img{height:180px}
/* reviews */
.revs{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin:40px 0 28px}
.revs.col2{grid-template-columns:repeat(2,1fr)}
.rev{background:var(--bg);border:1px solid var(--line);border-radius:var(--r);padding:26px}
.rev-top{margin-bottom:14px}
.rev blockquote{font-size:16px;line-height:1.62;color:var(--ink)}
.rev figcaption{margin-top:18px;font-weight:700;font-size:14.5px}
.rev figcaption span{display:block;font-weight:500;color:var(--muted);font-size:13px;margin-top:2px}
/* certs marquee */
.cmarq{background:var(--brand-d);overflow:hidden;padding:18px 0}
.cmarq-row{display:flex;gap:34px;align-items:center;width:max-content;animation:scrollx 34s linear infinite}
.cm-i{display:inline-flex;align-items:center;gap:9px;color:#fff;font-weight:800;font-size:18px;letter-spacing:.02em}
.cm-i svg{color:#7fb0f4}
.cm-x{color:#9fc0f0;font-weight:600;font-size:17px}
.cm-d{color:#37527d}
@keyframes scrollx{to{transform:translateX(-50%)}}
@media(prefers-reduced-motion:reduce){.cmarq-row,.rmarq-row{animation:none}}
/* reviews marquee */
.rev-sec{padding-bottom:60px}
.rmarq{overflow:hidden;margin-top:8px;-webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
.rmarq-row{display:flex;gap:18px;width:max-content;padding:8px 0;animation:scrollx 60s linear infinite}
.rmarq:hover .rmarq-row{animation-play-state:paused}
.rmarq .rev{flex:0 0 360px}
/* avis page */
.avis-grid{display:grid;grid-template-columns:300px 1fr;gap:40px;align-items:start}
.dist{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:28px;position:sticky;top:96px}
.distbig{font-size:60px;font-weight:800;letter-spacing:-.03em;line-height:1;color:var(--brand)}
.distbig small{font-size:24px;color:var(--muted)}
.distm{color:var(--muted);font-size:13.5px;margin:10px 0 18px}
.bars{display:grid;gap:8px}
.bar{display:flex;align-items:center;gap:9px;font-size:13px}
.bl{display:inline-flex;align-items:center;gap:3px;color:var(--ink2);width:34px}.bl svg{color:#f4a72c}
.btrack{flex:1;height:7px;background:var(--line);border-radius:99px;overflow:hidden}
.bfill{display:block;height:100%;background:var(--brand);border-radius:99px}
.bc{color:var(--muted);width:24px;text-align:right}
/* prestations page */
.phead{background:var(--surface);border-bottom:1px solid var(--line);padding:72px 0 64px}
.phead .sub{font-size:19px;color:var(--ink2);margin-top:14px;max-width:54ch}
.pstack{display:grid;gap:20px}
.presta{background:var(--bg);border:1px solid var(--line);border-radius:var(--r);padding:34px}
.presta-h{display:flex;align-items:center;gap:16px;margin-bottom:14px}
.presta-h h2{font-size:26px}
.svc-i.big{color:var(--brand);background:var(--brand-soft);border-radius:12px}
/* cta */
.cta{background:var(--brand-d);color:#fff;text-align:center;padding:90px 0}
.cta h2{color:#fff}
.cta p{color:#cdddf5;font-size:18px;margin-top:14px}
.cta .btn{margin-top:30px}
/* contact */
.contact-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:40px;align-items:start}
.cform{display:grid;gap:16px;background:var(--bg);border:1px solid var(--line);border-radius:var(--r);padding:30px}
.cform label{display:grid;gap:7px;font-weight:600;font-size:14px;color:var(--ink2)}
.cform input,.cform textarea{font:inherit;padding:12px 14px;border:1px solid var(--line);border-radius:11px;background:var(--surface);color:var(--ink)}
.cform input:focus,.cform textarea:focus{outline:none;border-color:var(--brand);box-shadow:0 0 0 4px rgba(20,87,184,.14)}
.f2{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.fmini{color:var(--muted);font-size:12.5px}
.cside{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:30px}
.cside h3{font-size:19px;margin-bottom:16px}.cside h3.mt{margin-top:26px}
.cline{display:flex;align-items:center;gap:11px;margin-bottom:12px;color:var(--ink2)}
.cline svg{color:var(--brand);flex:none}.cline a{color:var(--ink);font-weight:600}
.maplink{display:inline-flex;align-items:center;gap:7px;color:var(--brand);font-weight:700;margin-top:6px}
.hours .h-row{display:flex;justify-content:space-between;padding:9px 0;border-bottom:1px solid var(--line);font-size:14.5px}
.hours .h-row.off dd{color:var(--brand)}
/* footer */
footer{background:#081a33;color:#9fb3cf;font-size:14px;padding:56px 0 30px}
.fcols{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:36px;padding-bottom:30px}
footer h4{color:#fff;font-size:14px;letter-spacing:.04em;text-transform:uppercase;margin-bottom:12px}
footer p{margin-top:6px}
footer a{color:#cfe0f7}
.finv{filter:brightness(0) invert(1);opacity:.92;margin-bottom:14px}
.certs{display:flex;gap:8px;margin-top:16px}
.zonep{line-height:1.9}
.fbar{display:flex;justify-content:space-between;gap:20px;border-top:1px solid rgba(255,255,255,.1);padding-top:22px;color:#6f86a6;font-size:12.5px}
/* responsive */
@media(max-width:920px){
 .links{display:none}
 .statrow,.svcs,.splitin,.gal4,.gal,.revs,.revs.col2,.avis-grid,.contact-grid,.fcols,.ticks.two,.f2{grid-template-columns:1fr}
 .splitin{gap:32px}.sec{padding:60px 0}.hero-in{padding:72px 24px 64px}
 .dist{position:static}.fbar{flex-direction:column;gap:8px}
 .wrap{padding:0 22px}
}
