:root{
  --bg:#0f1210;
  --card:#141a15;
  --text:#e9efe9;
  --muted:#b8c3b8;
  --line:#263027;
  --accent:#a6c2a6;
  --max:980px;
  --warn:#ffd18a;
}

*{box-sizing:border-box}

body{
  margin:0;
  font-family: system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  background:linear-gradient(180deg, var(--bg), #0b0d0b);
  color:var(--text);
  line-height:1.6;
}

/* Liens */
a{color:var(--accent); text-decoration:none;}
a:hover{text-decoration:underline;}
a:focus{outline:2px dotted var(--accent); outline-offset:2px;}

/* Conteneur principal */
.container,
.wrap{
  max-width:var(--max);
  margin:0 auto;
  padding:0 18px;
}

/* IMPORTANT : menu injecté */
#menu-container{
  position: sticky;
  top: 0;
  z-index: 1000;
  border-bottom:1px solid var(--line);
  background:rgba(20,26,21,.85);
  backdrop-filter:saturate(120%) blur(6px);
}

/* Menu (s’applique à ton <nav class="main-nav"> injecté) */
.main-nav{
  display:flex;
  gap:14px;
  align-items:center;
  padding:14px 18px;
  flex-wrap:wrap;
  max-width:var(--max);
  margin:0 auto;
}
.main-nav a{
  color:var(--text);
  padding:6px 10px;
  border-radius:8px;
}
.main-nav a[aria-current="page"]{
  background:rgba(255,255,255,.08);
}

/* Mise en page générale */
main{
  padding:26px 18px 64px;
  max-width:var(--max);
  margin:0 auto;
}
header, main, footer { display:block; }

h1{margin:0 0 10px; font-size:clamp(28px, 3.2vw, 40px); letter-spacing:.2px;}
h2{margin:0 0 10px; font-size:22px;}
h3{margin:14px 0 6px; font-size:16px; color:var(--accent); letter-spacing:.2px;}
p{margin:0 0 12px;}
ul{margin:0 0 12px 18px; padding:0;}
li{margin:6px 0;}

.small{font-size:14px; color:var(--muted);}
.muted{color:var(--muted);}

.card{
  background:rgba(20,26,21,.88);
  border:1px solid var(--line);
  border-radius:14px;
  padding:18px;
  margin:14px 0;
  box-shadow:0 8px 20px rgba(0,0,0,.22);
}

/* Formulaires (si présents sur tarifs/contact) */
label{display:block;font-size:13px;color:var(--text);margin:8px 0 4px}
select,input,button{
  width:100%;
  padding:10px;
  border:1px solid var(--line);
  border-radius:10px;
  background:rgba(10,14,10,.35);
  color:var(--text);
}
button{cursor:pointer; font-weight:600;}
button:hover{border-color:rgba(255,255,255,.22)}
input::placeholder{color:#7f8a92}

/* Grilles (si utilisées) */
.grid{display:grid;grid-template-columns:1fr;gap:14px}
@media(min-width:900px){.grid{grid-template-columns:1.2fr .8fr}}
.cols{display:grid;grid-template-columns:1fr;gap:14px}
@media(min-width:900px){.cols{grid-template-columns:1fr 1fr}}

.row3{display:grid;grid-template-columns:1fr;gap:10px}
@media(min-width:700px){.row3{grid-template-columns:repeat(3,1fr)}}
.row2{display:grid;grid-template-columns:1fr;gap:10px}
@media(min-width:700px){.row2{grid-template-columns:repeat(2,1fr)}}

.hint{font-size:12px;margin-top:6px;color:var(--muted)}
.hint.warn{color:var(--warn)}

/* =========================
   Ajouts sobres : accueil / FAQ (DARK)
   ========================= */

.page-header .lead,
.lead{
  font-size: 1.05rem;
  line-height: 1.6;
  max-width: 78ch;
  margin: 1rem 0 1.5rem 0;
  color: var(--muted);
}

/* CTA */
.cta-row{ margin: 1rem 0 1.5rem 0; }
.cta-row a{ display:inline-block; margin-right:.75rem; margin-bottom:.5rem; }

.btn{
  display:inline-block;
  padding:.45rem .9rem;
  border:1px solid var(--line);
  border-radius:10px;
  color:var(--text);
  background:rgba(10,14,10,.35);
  text-decoration:none;
  font-size:.95rem;
}
.btn:hover, .btn:focus{
  text-decoration:none;
  border-color:rgba(255,255,255,.22);
}
.btn-secondary{ border-style:dashed; }

/* Sommaire */
.toc{
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
  padding:.75rem 0;
  margin:1.5rem 0 2rem 0;
  max-width:78ch;
}
.toc ul{ list-style:none; padding-left:0; margin:0; }
.toc li{ margin:.25rem 0; }
.toc a{ color:var(--text); font-size:.9rem; text-decoration:none; }
.toc a:hover, .toc a:focus{ text-decoration:underline; }

/* Encadré */
.box{
  border:1px solid var(--line);
  padding:1rem 1.25rem;
  margin:2rem 0;
  background:rgba(10,14,10,.35);
  border-radius:14px;
  max-width:78ch;
}
.box h2{ margin-top:0; }

/* CTA final */
.cta-final{
  border-top:1px solid var(--line);
  margin-top:3rem;
  padding-top:1.5rem;
  max-width:78ch;
}

/* Footer */
footer{
  padding:18px;
  border-top:1px solid var(--line);
  color:var(--muted);
}