/* Genere par build.mjs — ne pas editer a la main. Palette reprise du site d'origine. */
:root{
  --bleu:#1d4ed8; --bleu-fonce:#1e40af; --bleu-nuit:#1e3a8a; --bleu-clair:#dbeafe; --bleu-pale:#eff6ff;
  --orange:#ea580c; --orange-vif:#fb923c; --ambre:#ca8a04; --vert:#16a34a;
  --encre:#111827; --encre-douce:#4b5563; --ligne:#e5e7eb; --fond:#ffffff; --fond-doux:#f9fafb;
  --rayon:8px; --largeur:1240px;
  --ombre:0 10px 15px -3px rgb(0 0 0 / .1), 0 4px 6px -4px rgb(0 0 0 / .1);
  --ombre-carte:0 1px 3px rgb(0 0 0 / .1);
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;background:var(--fond);color:var(--encre);
  font:400 16px/1.65 ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif}
.nowrap{white-space:nowrap}
.conteneur{max-width:var(--largeur);margin:0 auto;padding:0 20px}
.icone{width:22px;height:22px;flex:none}

/* ---- en-tete blanc collant, comme l'original */
header{position:sticky;top:0;z-index:30;background:#fff;box-shadow:var(--ombre)}
.entete{display:flex;align-items:center;gap:16px;padding:14px 20px;max-width:var(--largeur);margin:0 auto}
.marque{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--bleu-fonce)}
.marque .icone{width:28px;height:28px;color:var(--bleu)}
.marque b{display:block;font-size:17px;line-height:1.2}
.marque span{display:block;font-size:13px;color:var(--encre-douce);font-weight:400}
nav{margin-left:auto}
nav ul{display:flex;align-items:center;gap:4px;list-style:none;margin:0;padding:0}
nav a{display:block;white-space:nowrap;padding:8px 10px;font-size:15px;border-radius:6px;text-decoration:none;color:var(--encre-douce);font-size:15px}
nav a:hover{color:var(--bleu);background:var(--bleu-pale)}
nav a[aria-current="page"]{color:var(--bleu);font-weight:600;box-shadow:inset 0 -2px 0 var(--bleu);border-radius:0}
.urgence{display:inline-flex;align-items:center;gap:8px;background:var(--orange);color:#fff;font-weight:600;
  padding:10px 16px;border-radius:var(--rayon);text-decoration:none;font-size:15px;white-space:nowrap}
.urgence:hover{background:#c2410c}
.bascule,.burger{display:none}

/* ---- heros en degrade */
.hero{background:linear-gradient(to right,var(--bleu-fonce),var(--bleu),var(--bleu-nuit));color:#fff;
  padding:64px 0;text-align:center}
.hero h1{margin:0 0 6px;font-size:46px;line-height:1.12;font-weight:700;letter-spacing:-.02em}
.hero h1 .accent{display:block;color:var(--orange-vif)}
.hero .chapeau{margin:18px auto 26px;font-size:19px;max-width:62ch;color:#e0e7ff}
.hero .actions{display:flex;flex-wrap:wrap;gap:14px;justify-content:center}
.hero .dispo{margin:24px 0 0;color:#c7d2fe;font-size:16px}
.hero.compact{padding:40px 0}
.hero.compact h1{font-size:36px}
.hero.compact .chapeau{margin-bottom:0;font-size:18px}
.hero.compact .actions{margin-top:22px}

/* ---- boutons */
.bouton{display:inline-flex;align-items:center;gap:9px;padding:13px 22px;border-radius:var(--rayon);
  font-weight:600;font-size:16px;text-decoration:none;border:2px solid transparent;cursor:pointer}
.bouton.appel{background:var(--orange);color:#fff}
.bouton.appel:hover{background:#c2410c}
.bouton.contour{border-color:#fff;color:#fff}
.bouton.contour:hover{background:#fff;color:var(--bleu-fonce)}
.bouton.bleu{background:var(--bleu);color:#fff}
.bouton.bleu:hover{background:var(--bleu-fonce)}
.bouton.bleu-clair{background:#3b82f6;color:#fff}
.bouton.bleu-clair:hover{background:#2563eb}

/* ---- sections, alternance blanc / gris comme l'original */
section{padding:56px 0}
section.douce{background:var(--fond-doux)}
section h2{font-size:30px;line-height:1.25;margin:0 0 10px;text-align:center;letter-spacing:-.01em}
section .sous-titre{margin:0 auto 34px;color:var(--encre-douce);text-align:center;max-width:70ch}
section.texte h2,section.texte .sous-titre{text-align:left;margin-left:0}
section.texte p{max-width:72ch;margin:0 0 14px;color:#374151}
.centre{text-align:center;margin-top:32px}

/* ---- cartes */
.grille{display:grid;gap:22px;grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}  /* 3 cartes par ligne, comme l'original */
.grille.quatre{gap:20px;grid-template-columns:repeat(auto-fit,minmax(215px,1fr))}  /* 4 atouts sur une ligne, comme l'original */
.carte{background:#fff;border:1px solid var(--ligne);border-radius:12px;padding:24px;box-shadow:var(--ombre-carte)}
.carte h3{margin:0 0 10px;font-size:19px}
.carte p{margin:0 0 14px;color:var(--encre-douce)}
.carte ul{list-style:none;padding:0;margin:0 0 14px;display:grid;gap:7px;font-size:15px;color:#374151}
.carte ul li{position:relative;padding-left:22px}
.carte ul li::before{content:"\2713";position:absolute;left:0;color:var(--bleu);font-weight:700}
.carte .lien{color:var(--bleu);font-weight:600;text-decoration:none;font-size:15px}
.carte .lien:hover{text-decoration:underline}
.carte .icone{width:30px;height:30px;margin-bottom:12px}
.atout{text-align:center}
.atout .icone{width:34px;height:34px;margin:0 auto 14px}
.orange{color:var(--orange)} .bleu{color:var(--bleu)} .ambre{color:var(--ambre)} .vert{color:var(--vert)}

/* ---- listes */
ul.puces{list-style:none;padding:0;margin:0 auto;max-width:80ch;display:grid;gap:12px}
ul.puces li{position:relative;padding-left:30px;color:#374151}
ul.puces li::before{content:"";position:absolute;left:8px;top:10px;width:8px;height:8px;border-radius:2px;background:var(--bleu)}

/* ---- etapes numerotees */
ol.etapes{list-style:none;counter-reset:n;padding:0;margin:0;display:grid;gap:18px;
  grid-template-columns:repeat(auto-fit,minmax(215px,1fr))}
ol.etapes li{counter-increment:n;background:#fff;border:1px solid var(--ligne);border-radius:12px;padding:22px 20px 20px;
  position:relative;box-shadow:var(--ombre-carte)}
ol.etapes li::before{content:counter(n);display:grid;place-items:center;width:36px;height:36px;border-radius:50%;
  background:var(--bleu);color:#fff;font-weight:700;margin-bottom:12px}
ol.etapes strong{display:block;margin-bottom:6px}
ol.etapes span{color:var(--encre-douce);font-size:15px}

/* ---- zones */
.zones-grille{display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}
.zone{background:#fff;border:1px solid var(--ligne);border-radius:10px;padding:18px;text-align:center;box-shadow:var(--ombre-carte)}
.zone .icone{color:var(--bleu);margin:0 auto 8px;display:block}
.zone b{display:block;font-size:16px}
.zone span{display:block;color:var(--encre-douce);font-size:14px;margin-top:4px}
table.zones{width:100%;border-collapse:collapse;background:#fff;border:1px solid var(--ligne);border-radius:12px;overflow:hidden}
table.zones th,table.zones td{text-align:left;padding:14px 16px;border-bottom:1px solid var(--ligne);vertical-align:top}
table.zones tr:last-child td{border-bottom:0}
table.zones th{font-size:13px;text-transform:uppercase;letter-spacing:.04em;color:var(--encre-douce);background:var(--fond-doux)}
table.zones td:first-child{font-weight:600;white-space:nowrap}

/* ---- faq */
.faq{max-width:860px;margin:0 auto;display:grid;gap:12px}
details{border:1px solid var(--ligne);border-radius:10px;background:#fff;box-shadow:var(--ombre-carte)}
details summary{cursor:pointer;padding:16px 18px;font-weight:600;list-style:none;display:flex;justify-content:space-between;gap:16px}
details summary::-webkit-details-marker{display:none}
details summary::after{content:"+";color:var(--bleu);font-weight:700;font-size:20px;line-height:1}
details[open] summary::after{content:"\2013"}
details p{padding:0 18px 16px;margin:0;color:var(--encre-douce)}

/* ---- bandeau d'appel bleu */
.bandeau-cta{background:var(--bleu-fonce);color:#fff;text-align:center;padding:56px 0}
.bandeau-cta h2{color:#fff}
.bandeau-cta p{color:#dbeafe;margin:0 0 26px}
.bandeau-cta .actions{display:flex;flex-wrap:wrap;gap:14px;justify-content:center}
.bandeau-cta .tel{margin:22px 0 0;color:#c7d2fe;font-weight:600}

/* ---- contact */
.coordonnees{display:grid;gap:18px;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));margin:0 0 36px}
.coordonnees div{background:#fff;border:1px solid var(--ligne);border-radius:12px;padding:20px;box-shadow:var(--ombre-carte)}
.coordonnees .icone{color:var(--bleu);margin-bottom:10px}
.coordonnees dt{font-size:13px;text-transform:uppercase;letter-spacing:.04em;color:var(--encre-douce);margin:0 0 6px}
.coordonnees dd{margin:0;font-size:18px;font-weight:600;word-break:break-word}
.coordonnees dd a{color:var(--bleu);text-decoration:none}
form{display:grid;gap:16px;max-width:640px;margin:0 auto}
label{font-weight:600;font-size:15px;display:grid;gap:6px}
input,textarea{font:inherit;padding:12px 13px;border:1px solid #cbd5e1;border-radius:var(--rayon);width:100%;background:#fff}
input:focus,textarea:focus{outline:2px solid var(--bleu);outline-offset:1px;border-color:var(--bleu)}
textarea{min-height:140px;resize:vertical}
form .note{font-size:14px;color:var(--encre-douce);margin:0}

/* ---- pied de page sombre */
footer{background:var(--encre);color:#d1d5db;padding:48px 0 28px;font-size:15px}
footer .grille{gap:32px;grid-template-columns:repeat(auto-fit,minmax(210px,1fr))}
footer h2{color:#fff;font-size:16px;text-align:left;margin:0 0 14px}
footer .marque-pied{display:flex;align-items:center;gap:10px;color:#fff;font-weight:700;margin-bottom:12px}
footer .marque-pied .icone{color:#60a5fa}
footer ul{list-style:none;padding:0;margin:0;display:grid;gap:9px}
footer a{color:#d1d5db;text-decoration:none}
footer a:hover{color:#fff;text-decoration:underline}
footer li.avec-icone{display:flex;gap:10px;align-items:flex-start}
footer li.avec-icone .icone{width:18px;height:18px;color:#60a5fa;margin-top:3px}
footer .bas{margin-top:34px;padding-top:20px;border-top:1px solid #374151;text-align:center;color:#9ca3af;font-size:14px}
footer .bas p{margin:6px 0}
footer .nap b{color:#d1d5db}

/* ---- mobile */
@media (max-width:900px){
  .hero h1{font-size:32px}
  .hero{padding:44px 0}
  section{padding:42px 0}
  section h2{font-size:25px}
  .entete{gap:10px;padding:12px 16px}
  .marque b{font-size:15px}
  .marque span{font-size:12px}
  .urgence{margin-left:auto;padding:10px 12px}
  .urgence .libelle{display:none}      /* bouton d'appel compact, toujours visible */
  .burger{display:grid;place-items:center;width:44px;height:44px;border:1px solid var(--ligne);
    border-radius:var(--rayon);cursor:pointer;color:var(--encre)}
  nav{order:5;margin:0;width:100%;display:none}
  .bascule:checked ~ .entete nav{display:block}   /* le nav est DANS .entete : sans ce chemin, le burger ne fait rien */
  nav ul{flex-direction:column;align-items:stretch;gap:2px;padding:6px 0 10px;border-top:1px solid var(--ligne)}
  nav a{padding:12px 6px;font-size:16px}
  nav a[aria-current="page"]{box-shadow:none;background:var(--bleu-pale);border-radius:6px}
  .hero .actions .bouton,.bandeau-cta .actions .bouton{width:100%;justify-content:center}
}
