:root{
  --encre:#1F2933; --gris:#4B5563; --bleu:#0A6A94; --bleu-fonce:#08506f; --bleu-pale:#EAF7FC;
  --jaune:#FAE60A; --cyan:#46C8E6; --fond:#FFFFFF; --filet:#D9E2E8; --rayon:14px;
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:84px}
body{margin:0;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;color:var(--encre);background:var(--fond);line-height:1.65;font-size:17px}
img{max-width:100%;height:auto}
a{color:var(--bleu);text-underline-offset:3px}
a:hover{color:var(--bleu-fonce)}
:focus-visible{outline:3px solid var(--bleu);outline-offset:3px;border-radius:4px}
.lien-evitement{position:absolute;left:-999px;top:0;background:var(--jaune);color:var(--encre);padding:10px 16px;font-weight:700;z-index:20}
.lien-evitement:focus{left:12px;top:12px}
.conteneur{width:min(1080px,100% - 40px);margin-inline:auto}

/* En-tête */
.entete{position:sticky;top:0;z-index:10;background:rgba(255,255,255,.96);border-bottom:1px solid var(--filet);backdrop-filter:blur(6px)}
.entete .conteneur{display:flex;align-items:center;justify-content:space-between;gap:18px;flex-wrap:wrap;padding:8px 0}
.marque{display:flex;align-items:center;gap:12px;text-decoration:none;color:var(--encre);font-weight:800;font-size:18px}
.marque img{height:46px;width:auto}
.nav ul{display:flex;gap:6px;list-style:none;margin:0;padding:0;flex-wrap:wrap}
.nav a{display:block;padding:8px 14px;border-radius:999px;text-decoration:none;color:var(--encre);font-weight:600;font-size:15px}
.nav a:hover{background:var(--bleu-pale);color:var(--bleu-fonce)}

/* Accueil */
.heros{background:linear-gradient(180deg,var(--bleu-pale),#fff 92%);padding:56px 0 48px}
.heros .conteneur{display:grid;grid-template-columns:1.15fr .85fr;gap:40px;align-items:center}
.surtitre{display:inline-block;background:var(--jaune);color:var(--encre);font-weight:800;font-size:13px;letter-spacing:.06em;text-transform:uppercase;padding:5px 12px;border-radius:999px;margin-bottom:14px}
h1{font-size:clamp(34px,5.4vw,52px);line-height:1.1;margin:0 0 16px;letter-spacing:-.02em}
.chapeau{font-size:clamp(18px,2.2vw,21px);color:var(--gris);margin:0 0 24px;max-width:34em}
.boutons{display:flex;gap:12px;flex-wrap:wrap}
.btn{display:inline-block;padding:13px 24px;border-radius:999px;font-weight:700;text-decoration:none;font-size:16px;border:2px solid var(--bleu)}
.btn-plein{background:var(--bleu);color:#fff}
.btn-plein:hover{background:var(--bleu-fonce);border-color:var(--bleu-fonce);color:#fff}
.btn-creux{background:#fff;color:var(--bleu)}
.btn-creux:hover{background:var(--bleu-pale)}
.pastilles{display:flex;gap:10px;flex-wrap:wrap;list-style:none;padding:0;margin:26px 0 0}
.pastilles li{background:#fff;border:1px solid var(--filet);border-radius:999px;padding:6px 14px;font-size:14px;font-weight:600;color:var(--gris)}
.logo-grand{display:flex;justify-content:center}
.logo-grand img{width:min(420px,100%);height:auto}

/* Sections */
section{padding:60px 0}
section+section{border-top:1px solid var(--filet)}
h2{font-size:clamp(26px,3.6vw,34px);line-height:1.2;margin:0 0 8px;letter-spacing:-.01em}
h2::after{content:"";display:block;width:56px;height:5px;border-radius:3px;background:linear-gradient(90deg,var(--jaune),var(--cyan));margin-top:12px}
.intro{color:var(--gris);max-width:42em;margin:18px 0 28px}
.cartes{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:20px;margin-top:28px}
.carte{border:1px solid var(--filet);border-radius:var(--rayon);padding:24px;background:#fff}
.carte h3{margin:0 0 8px;font-size:20px}
.carte p{margin:0;color:var(--gris);font-size:16px}
.carte .puce{display:inline-block;width:14px;height:14px;border-radius:50%;background:var(--jaune);box-shadow:0 0 0 3px var(--bleu-pale);margin-bottom:12px}
.etapes{counter-reset:etape;list-style:none;padding:0;margin:24px 0;display:grid;gap:14px;max-width:46em}
.etapes li{counter-increment:etape;position:relative;padding:14px 16px 14px 62px;border:1px solid var(--filet);border-radius:var(--rayon);background:#fff}
.etapes li::before{content:counter(etape);position:absolute;left:16px;top:50%;transform:translateY(-50%);width:32px;height:32px;border-radius:50%;background:var(--jaune);color:var(--encre);font-weight:800;display:grid;place-items:center}
.encart{background:var(--bleu-pale);border-radius:var(--rayon);padding:18px 20px;max-width:46em}
.contact-grille{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:20px;margin-top:24px}
.contact-bloc{border:1px solid var(--filet);border-radius:var(--rayon);padding:22px}
.contact-bloc h3{margin:0 0 6px;font-size:16px;color:var(--gris);text-transform:uppercase;letter-spacing:.06em}
.contact-bloc p{margin:0;font-size:18px}
.contact-bloc a{font-weight:700;word-break:break-word}

/* Pied de page */
.pied{background:var(--encre);color:#E5E7EB;padding:40px 0;font-size:15px}
.pied a{color:var(--jaune)}
.pied strong{color:#fff}
.pied .conteneur{display:grid;gap:10px}
.pied-id{display:flex;flex-wrap:wrap;gap:6px 22px}
.petit{font-size:14px;color:#C5CAD1}

/* Pages de texte */
.page-texte{padding:48px 0 64px;max-width:760px}
.page-texte h1{font-size:clamp(30px,4.4vw,40px)}
.page-texte h2{font-size:22px;margin-top:36px}
.page-texte h2::after{display:none}
.page-texte dl{display:grid;grid-template-columns:max-content 1fr;gap:6px 24px;margin:12px 0}
.page-texte dt{font-weight:700}
.page-texte dd{margin:0}

@media (max-width:820px){
  .heros{padding:36px 0 32px}
  .heros .conteneur{grid-template-columns:1fr}
  .logo-grand{order:-1}
  .logo-grand img{width:min(300px,80%)}
  section{padding:44px 0}
  .page-texte dl{grid-template-columns:1fr}
  .page-texte dt{margin-top:8px}
}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
@media print{.entete,.boutons,.lien-evitement{display:none}.heros{background:#fff}}