:root{--bleu:#309CB4;--vert:#C6DEAD;--jaune:#F0EA5A;--roi:#3C6CC0;--ciel:#AEBEDE;--arc:#9FC689;--peche:#F3B293;--encre:#23485E;--fond:#F4F8F9}
*{box-sizing:border-box}
body{margin:0;font:17px/1.55 system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;color:var(--encre);background:#fff}
a{color:var(--roi)}
.haut{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:14px max(16px,calc((100vw - 1100px)/2));position:sticky;top:0;background:rgba(255,255,255,.94);backdrop-filter:blur(8px);z-index:5;border-bottom:1px solid #E3ECEF}
.marque{display:flex;align-items:center;gap:8px;font-size:1.15rem;color:var(--encre);text-decoration:none}
.marque img{width:46px;height:auto;display:block}
.haut nav{display:flex;align-items:center;gap:18px}
.haut nav a{text-decoration:none;color:var(--encre);font-weight:600;font-size:.95rem}
@media (max-width:720px){.haut nav a:not(.bouton){display:none}}
.bouton{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:10px 22px;border-radius:14px;background:var(--bleu);color:#fff!important;font-weight:700;text-decoration:none;border:2px solid var(--bleu)}
.bouton.petit{min-height:40px;padding:6px 14px;font-size:.92rem}
.bouton.contour{background:transparent;color:var(--encre)!important}
.bouton.contour.clair{color:#fff!important;border-color:rgba(255,255,255,.7)}
.hero{display:grid;grid-template-columns:1.15fr .85fr;gap:40px;align-items:center;padding:56px max(16px,calc((100vw - 1100px)/2)) 40px;background:linear-gradient(180deg,#EAF5F8,#fff)}
@media (max-width:860px){.hero{grid-template-columns:1fr;padding-top:32px}}
.surtitre{text-transform:uppercase;letter-spacing:.08em;font-size:.8rem;font-weight:700;color:var(--bleu);margin:0 0 8px}
h1{font-size:clamp(2rem,5vw,3.2rem);line-height:1.08;margin:0 0 16px}
h1 span{background:linear-gradient(transparent 62%,var(--jaune) 62%)}
.chapo{font-size:1.1rem;color:#3E5E70;max-width:34em}
.ctas{display:flex;gap:12px;flex-wrap:wrap;margin:22px 0 8px}
.mini{font-size:.88rem;color:#5B7584}
.hero-visuel{display:flex;justify-content:center}
.telephone{width:290px;border-radius:38px;background:var(--encre);padding:12px;box-shadow:0 30px 60px rgba(35,72,94,.25)}
.ecran{background:var(--fond);border-radius:28px;padding:16px 12px;display:flex;flex-direction:column;gap:7px;font-size:.78rem}
.ligne-var{display:flex;align-items:center;gap:8px;background:#fff;border-radius:11px;padding:8px;font-weight:700}
.ligne-var .n{width:22px;height:22px;border-radius:6px;background:var(--encre);color:#fff;display:grid;place-items:center;font-size:.7rem}
.code{margin-left:auto;width:24px;height:24px;border-radius:7px;display:grid;place-items:center;font-weight:800}
.code.a{background:var(--arc)} .code.b{background:var(--jaune)} .code.c{background:var(--peche)}
.q{display:flex;align-items:center;gap:7px;background:#F6FAF2;border:1px solid #DCEBCF;border-radius:9px;padding:6px 8px}
.q span{width:18px;height:18px;border-radius:5px;background:var(--vert);display:grid;place-items:center;font-weight:800;font-size:.7rem}
.q em{margin-left:auto;font-style:normal;font-weight:700;color:#4B7A34}
.q.non{background:#FDF1EA;border-color:#F0C9B0} .q.non span{background:var(--peche)} .q.non em{color:#B4452F}
.gir{display:flex;align-items:center;gap:10px;background:var(--encre);color:#fff;border-radius:14px;padding:10px;margin-top:4px}
.gir b{width:44px;height:44px;border-radius:11px;background:var(--bleu);display:grid;place-items:center;font-size:1.5rem}
.bande{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;padding:26px max(16px,calc((100vw - 1100px)/2));background:var(--encre);color:#fff;text-align:center}
.bande b{display:block;font-size:2rem;color:var(--jaune)}
@media (max-width:640px){.bande{grid-template-columns:1fr}}
.section{padding:64px max(16px,calc((100vw - 1100px)/2))}
.section h2{font-size:clamp(1.5rem,3.4vw,2.1rem);margin:0 0 12px}
.intro{max-width:46em;color:#3E5E70;font-size:1.05rem}
.cartes3,.cartes2{display:grid;gap:18px;margin-top:26px}
.cartes3{grid-template-columns:repeat(3,1fr)} .cartes2{grid-template-columns:repeat(2,1fr)}
@media (max-width:860px){.cartes3,.cartes2{grid-template-columns:1fr}}
.cartes3 article,.cartes2 article{background:var(--fond);border-radius:18px;padding:22px}
article h3{margin:.2rem 0 .5rem;font-size:1.1rem}
article p{margin:0;color:#3E5E70}
.pastille{display:inline-grid;place-items:center;width:34px;height:34px;border-radius:10px;background:var(--jaune);font-weight:800}
.fonce{background:var(--encre);color:#fff}
.fonce .intro,.fonce article p{color:#C9DCE3}
.fonce article{background:rgba(255,255,255,.07)!important}
.offre{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:26px}
@media (max-width:760px){.offre{grid-template-columns:1fr}}
.offre>div{border:1.5px solid rgba(255,255,255,.25);border-radius:18px;padding:22px}
.offre .vedette{background:#fff;color:var(--encre);border-color:#fff}
.offre p{color:inherit;opacity:.9}
.cadre{margin-top:26px;font-size:.92rem;color:#5B7584;border-left:4px solid var(--jaune);padding:6px 14px}
.final{text-align:center;background:linear-gradient(180deg,#fff,#EAF5F8)}
.bas{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;padding:26px max(16px,calc((100vw - 1100px)/2));background:var(--fond);font-size:.9rem;color:#5B7584}