:root{
  --creme:#FDF3EA; --sable:#F7E4D7; --peche:#FBE7DA; --ivoire:#FFF9F4;
  --corail:#F2704B; --corail-f:#D8593A; --orange:#F6A340; --jaune:#FFCC5C;
  --marine:#2B4C7E; --bleu:#5B8FD8; --ciel:#A8C6EE;
  --menthe:#5FBFA0; --foret:#3D8B6E; --terre:#C0563F;
  --encre:#22303F; --doux:#5A6B7B; --trait:#EDE2D7;
  --max:1120px;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:"Source Sans 3",Calibri,-apple-system,"Segoe UI",sans-serif;
  color:var(--encre);background:#fff;line-height:1.62;font-size:17px;
  -webkit-font-smoothing:antialiased}
.wrap{max-width:var(--max);margin:0 auto;padding:0 24px}
a{color:var(--corail-f)}
h1,h2,h3{line-height:1.15;letter-spacing:-.02em;font-weight:700}
h2{font-size:clamp(26px,3.4vw,36px);margin:0 0 14px}
h3{font-size:19px;margin:0 0 8px}
p{margin:0 0 14px}
section{padding:76px 0}
.lead{font-size:19px;color:var(--doux);max-width:62ch}

/* barre */
header{position:sticky;top:0;z-index:50;background:rgba(253,243,234,.94);
  backdrop-filter:blur(8px);border-bottom:1px solid var(--trait)}
.bar{display:flex;align-items:center;justify-content:space-between;
  gap:24px;padding:16px 24px;max-width:var(--max);margin:0 auto}
.logo{display:inline-flex;align-items:center;gap:11px;font-weight:700;
  letter-spacing:.22em;color:var(--corail-f);font-size:17px;text-decoration:none}
.logo img{display:block;width:30px;height:30px;flex:none}
@media(max-width:520px){.logo{font-size:15px;gap:9px}.logo img{width:26px;height:26px}}
nav ul{display:flex;gap:26px;list-style:none;flex-wrap:wrap}
nav a{color:var(--encre);text-decoration:none;font-size:15.5px}
nav a:hover{color:var(--corail-f)}
.btn{display:inline-block;background:var(--corail-f);color:var(--creme);
  padding:12px 22px;border-radius:8px;text-decoration:none;font-weight:600;
  font-size:16px;border:none;cursor:pointer;transition:background .15s}
.btn:hover{background:var(--terre)}
.btn-clair{background:var(--marine)}
.btn-clair:hover{background:#20395f}

/* héros */
.hero{background:var(--creme);padding:88px 0 76px}
.hero-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:56px;align-items:center}
.hero h1{font-size:clamp(34px,5vw,52px);margin:0 0 20px}
.hero .lead{font-size:20px;color:var(--doux)}
.eti{display:inline-block;background:var(--jaune);color:var(--encre);
  font-size:13px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;
  padding:6px 13px;border-radius:99px;margin-bottom:20px}
.hero-actions{display:flex;gap:14px;flex-wrap:wrap;margin-top:28px}
.hero-card{background:#fff;border-radius:16px;padding:28px;
  box-shadow:0 12px 34px rgba(34,48,63,.09)}
.hero-card dl{display:grid;gap:16px}
.hero-card dt{font-size:12.5px;letter-spacing:.11em;text-transform:uppercase;
  color:var(--corail-f);font-weight:700}
.hero-card dd{font-size:17px;font-weight:600}
.hero-card .note{margin-top:20px;padding-top:18px;border-top:1px solid var(--trait);
  font-size:14.5px;color:var(--doux);line-height:1.5}

/* bandeau chiffres */
.chiffres{background:var(--marine);color:var(--creme);padding:44px 0}
.chiffres .g{display:grid;grid-template-columns:repeat(4,1fr);gap:28px;text-align:center}
.chiffres b{display:block;font-size:32px;color:var(--jaune);line-height:1.1}
.chiffres span{font-size:14.5px;color:#D8C6B4}

/* modules */
.mods{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:34px}
.mod{border:1px solid var(--trait);border-radius:14px;padding:24px;
  background:var(--ivoire)}
.mod .n{display:inline-flex;align-items:center;justify-content:center;
  width:34px;height:34px;border-radius:9px;font-weight:700;color:#fff;
  margin-bottom:14px;font-size:15px}
.mod p{font-size:15.5px;color:var(--doux);margin:0}
.c1{background:var(--marine)} .c2{background:var(--corail)}
.c3{background:var(--menthe)} .c4{background:var(--orange)}
.c5{background:var(--bleu)}   .c6{background:var(--prune,#7C4B73)}

/* deux colonnes */
.duo{display:grid;grid-template-columns:1fr 1fr;gap:48px}
ul.coches{list-style:none;display:grid;gap:11px;margin-top:6px}
ul.coches li{padding-left:30px;position:relative;font-size:16.5px}
ul.coches li::before{content:"";position:absolute;left:0;top:9px;width:16px;
  height:16px;border-radius:5px;background:var(--menthe)}
ul.tirets{list-style:none;display:grid;gap:10px;margin-top:6px}
ul.tirets li{padding-left:22px;position:relative;font-size:16.5px;color:var(--doux)}
ul.tirets li::before{content:"";position:absolute;left:0;top:13px;width:11px;
  height:2px;background:var(--corail)}

/* tarifs */
.tarifs{background:var(--creme)}
table{width:100%;border-collapse:collapse;margin-top:26px;background:#fff;
  border-radius:12px;overflow:hidden;box-shadow:0 2px 14px rgba(34,48,63,.06)}
th{background:var(--marine);color:var(--creme);text-align:left;padding:15px 20px;
  font-size:15px;font-weight:600}
td{padding:15px 20px;border-bottom:1px solid var(--trait);font-size:16.5px}
tr:last-child td{border-bottom:none}
td.prix{text-align:right;font-weight:700;white-space:nowrap}
.apres-table{font-size:15px;color:var(--doux);margin-top:18px;max-width:70ch}

/* encadrés */
.note-bloc{background:var(--peche);border-left:5px solid var(--corail-f);
  border-radius:0 12px 12px 0;padding:22px 26px;margin-top:26px}
.note-bloc p:last-child{margin:0}
.note-bloc.bleu{background:#EAF1FB;border-left-color:var(--marine)}

/* délais */
.delais{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:30px}
.delai{background:#fff;border:1px solid var(--trait);border-radius:12px;padding:22px}
.delai b{display:block;font-size:26px;color:var(--corail-f);line-height:1.1;
  margin-bottom:6px}
.delai span{font-size:15px;color:var(--doux)}

/* formulaire */
.contact{background:var(--marine);color:var(--creme)}
.contact h2{color:var(--creme)}
.contact .lead{color:#D8C6B4}
form{background:#fff;border-radius:16px;padding:32px;margin-top:6px;color:var(--encre)}
.champs{display:grid;grid-template-columns:1fr 1fr;gap:18px}
label{display:block;font-size:14px;font-weight:600;margin-bottom:6px}
input,textarea,select{width:100%;padding:12px 14px;border:1px solid #D9CFC5;
  border-radius:9px;font:inherit;font-size:16px;background:var(--ivoire)}
input:focus,textarea:focus,select:focus{outline:2px solid var(--corail);
  outline-offset:1px;background:#fff}
.pleine{grid-column:1/-1}
.rgpd{font-size:13.5px;color:var(--doux);margin:18px 0 0;line-height:1.5}
form .btn{margin-top:20px;width:100%;padding:15px;font-size:17px}

/* pied */
footer{background:var(--encre);color:#B9C3CC;padding:52px 0 34px;font-size:14.5px}
footer .g{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:38px}
footer h4{color:var(--creme);font-size:15px;margin-bottom:12px;font-weight:700}
footer a{color:#B9C3CC;text-decoration:none}
footer a:hover{color:var(--jaune)}
footer ul{list-style:none;display:grid;gap:7px}
.legal{margin-top:34px;padding-top:22px;border-top:1px solid #35455699;
  font-size:13px;color:#8A99A8;line-height:1.6}
.arelire{background:#FFF3CD;color:#6B4E00;border-left:5px solid var(--jaune);
  padding:4px 10px;border-radius:4px;font-weight:600;display:inline-block}

@media(max-width:900px){
  .hero-grid,.duo,footer .g{grid-template-columns:1fr}
  .mods,.delais{grid-template-columns:1fr}
  .chiffres .g{grid-template-columns:repeat(2,1fr);gap:22px}
  .champs{grid-template-columns:1fr}
  nav{display:none}
  section{padding:56px 0}
}

/* ── pages intérieures ── */
main.etroit{max-width:840px;margin:0 auto;padding:0 24px}
.tete{background:var(--creme);padding:64px 0 52px;margin-bottom:48px}
.tete .wrap{max-width:840px;padding:0 24px}
.tete .sur{font-size:13px;letter-spacing:.16em;text-transform:uppercase;
  color:var(--corail-f);font-weight:700;margin-bottom:12px}
.tete h1{font-size:clamp(30px,4.4vw,44px);margin:0 0 14px}
main.etroit .wrap{padding:0;max-width:100%}
.corps{padding-bottom:70px}
.corps h2{font-size:24px;margin:44px 0 14px;padding-bottom:9px;
  border-bottom:2px solid var(--corail)}
.corps h2:first-child{margin-top:0}
.corps h3{font-size:18px;margin:26px 0 8px;color:var(--marine)}
.corps p,.corps li{font-size:16.5px}
.corps ul,.corps ol{margin:0 0 16px;padding-left:22px}
.corps li{margin-bottom:7px}
dl.fiche{display:grid;grid-template-columns:auto 1fr;gap:10px 22px;
  margin:0 0 20px;font-size:16.5px}
dl.fiche dt{font-weight:600;color:var(--doux)}
dl.fiche dd{margin:0}
.corps table{margin:18px 0 22px;font-size:15.5px}
.corps th{font-size:14px}
.corps td{padding:12px 16px;vertical-align:top}
.sommaire{background:var(--ivoire);border:1px solid var(--trait);
  border-radius:12px;padding:24px 28px;margin:0 0 40px}
.sommaire h2{border:none;margin:0 0 12px;padding:0;font-size:18px}
.sommaire ol{columns:2;column-gap:34px;font-size:15.5px;margin:0;
  padding-left:20px}
.sommaire li{margin-bottom:5px}
.sommaire a{text-decoration:none;color:var(--encre)}
.sommaire a:hover{color:var(--corail-f);text-decoration:underline}
.md h2{font-size:22px;margin:40px 0 12px;padding-bottom:9px;
  border-bottom:2px solid var(--corail)}
.md h3{font-size:17.5px;margin:24px 0 8px;color:var(--marine)}
.md p,.md li{font-size:16.5px}
.md blockquote{background:var(--peche);border-left:5px solid var(--corail-f);
  border-radius:0 10px 10px 0;padding:16px 22px;margin:18px 0}
.md blockquote p:last-child{margin:0}
.md hr{border:none;border-top:1px solid var(--trait);margin:30px 0}
@media(max-width:700px){ .sommaire ol{columns:1} dl.fiche{grid-template-columns:1fr;gap:2px 0}
  dl.fiche dd{margin-bottom:10px} }
