/* ──────────────────────────────────────────────────────────────────────────
   Pages de contenu VisualCall (promo-rayon, horaires-fermeture,
   annonces-multilingues, vs-callbot, faq).
   Reprend la charte de index.html : mêmes variables, même nav, même pied de
   page. Aucune dépendance, aucun framework — une seule feuille partagée pour
   éviter de recopier le style dans chaque page.
   ────────────────────────────────────────────────────────────────────────── */

* { margin:0; padding:0; box-sizing:border-box; }
:root { --blue:#2563eb; --blue-dark:#1e40af; --ink:#0f172a; --line:#e2e8f0; --muted:#64748b; --bg:#f8fafc; }
html { scroll-behavior:smooth; }
body { font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif; color:var(--ink); background:#fff; line-height:1.6; }

/* ── NAV (identique à la landing) ── */
.topnav { position:sticky; top:0; z-index:50; background:#fff; border-bottom:1px solid var(--line); display:flex; align-items:center; justify-content:space-between; padding:12px 28px; gap:16px; }
.topnav .nav-logo { height:30px; }
.nav-links { display:flex; align-items:center; gap:22px; }
.nav-links a { color:var(--ink); text-decoration:none; font-size:15px; font-weight:600; white-space:nowrap; }
.nav-links a:hover { color:var(--blue); }
.nav-links .nav-login { border:1px solid var(--blue); color:var(--blue); padding:8px 16px; border-radius:9px; }
.nav-links .nav-login:hover { background:var(--blue); color:#fff; }
@media (max-width:680px){
  .nav-links a:not(.nav-login){ display:none; }
  .topnav { padding:12px 14px; gap:10px; }
  .nav-links { gap:10px; }
  .topnav .nav-logo { height:26px; }
  .nav-links .nav-login { padding:8px 12px; font-size:14px; }
}

/* ── Fil d'Ariane ── */
.crumb { max-width:820px; margin:0 auto; padding:18px 24px 0; font-size:13px; color:var(--muted); }
.crumb a { color:var(--muted); text-decoration:none; }
.crumb a:hover { color:var(--blue); }

/* ── Corps de page ── */
main { max-width:820px; margin:0 auto; padding:14px 24px 64px; }
main h1 { font-size:clamp(26px,4vw,38px); font-weight:800; letter-spacing:-0.02em; line-height:1.25; margin:10px 0 0; }
main h2 { font-size:clamp(20px,2.6vw,25px); font-weight:800; letter-spacing:-0.01em; margin:44px 0 12px; }
main h3 { font-size:17px; font-weight:700; margin:26px 0 8px; }
main p { color:#334155; margin:12px 0; }
main ul, main ol { margin:12px 0 12px 22px; color:#334155; }
main li { margin:6px 0; }
main a { color:var(--blue); }

/* Réponse directe d'ouverture — le bloc que les assistants extraient. */
.answer { background:var(--bg); border-left:3px solid var(--blue); border-radius:0 12px 12px 0; padding:20px 22px; margin:22px 0 8px; }
.answer p { margin:0; color:var(--ink); font-size:17px; }

/* Encadré neutre (mise en garde, précision, limite) */
.note { background:#fff; border:1px solid var(--line); border-radius:12px; padding:18px 20px; margin:20px 0; }
.note p:first-child { margin-top:0; }
.note p:last-child { margin-bottom:0; }

/* Marqueur des données qui restent à trancher côté VisualCom */
.todo { background:#fef3c7; border:1px dashed #d97706; color:#78350f; border-radius:8px; padding:3px 8px; font-size:14px; font-weight:600; }

/* Tableau comparatif (vs-callbot) */
.cmp { width:100%; border-collapse:collapse; margin:20px 0; font-size:15px; }
.cmp th, .cmp td { border:1px solid var(--line); padding:11px 13px; text-align:left; vertical-align:top; }
.cmp thead th { background:var(--bg); font-weight:700; }
.cmp td:first-child { color:var(--muted); width:30%; }
@media (max-width:600px){ .cmp, .cmp thead, .cmp tbody, .cmp tr, .cmp th, .cmp td { display:block; } .cmp thead { display:none; } .cmp tr { margin-bottom:14px; border:1px solid var(--line); border-radius:10px; overflow:hidden; } .cmp td { border:none; border-bottom:1px solid var(--line); } .cmp td:first-child { width:auto; background:var(--bg); font-weight:700; color:var(--ink); } }

/* FAQ */
.qa { border-bottom:1px solid var(--line); padding:22px 0; }
.qa:last-child { border-bottom:none; }
.qa h2 { font-size:19px; margin:0 0 8px; }
.qa p:last-child { margin-bottom:0; }

/* Appel à l'action de bas de page */
.cta-box { background:var(--bg); border-radius:16px; padding:26px; margin:44px 0 0; text-align:center; }
.cta-box p { margin:0 0 16px; color:var(--muted); }
.cta-box .cta { display:inline-block; background:var(--blue); color:#fff; text-decoration:none; font-weight:700; padding:13px 26px; border-radius:11px; }
.cta-box .cta:hover { background:var(--blue-dark); }

/* Pages soeurs */
.siblings { display:grid; grid-template-columns:repeat(2,1fr); gap:12px; margin-top:20px; }
@media (max-width:600px){ .siblings { grid-template-columns:1fr; } }
.siblings a { display:block; border:1px solid var(--line); border-radius:12px; padding:14px 16px; text-decoration:none; color:var(--ink); font-weight:600; font-size:15px; }
.siblings a:hover { border-color:var(--blue); color:var(--blue); }

/* ── Pied de page (identique à la landing) ── */
footer { background:#0f172a; color:rgba(255,255,255,.65); padding:30px 24px; text-align:center; font-size:13px; }
footer a { color:rgba(255,255,255,.85); text-decoration:none; }
footer a:hover { text-decoration:underline; }