/* Charte MAEF v3 : ajustements propres aux pages « forum-legal ».
 * Pages : /forum (recherche fsrch-*, bloc « Posez votre question » fa-section), /forum/poser (fa-*),
 * /forum/[slug] (fq-*, styles inline de src/lib/forumRender.ts), /mentions-legales et
 * /politique-de-confidentialite (lp-*, src/lib/legalRender.ts).
 * Habillage seulement : même HTML, mêmes textes. Tout est préfixé .maef-v3 pour passer devant les
 * <style> inline des rendus (spécificité) ; !important seulement contre les attributs style="".
 */

/* ---------- Héros des pages intérieures : bande verte, sous la barre de navigation ---------- */
/* La navbar Webflow est en position absolue (≈ 80 px) par-dessus le haut du héros : on dégage
   le fil d'Ariane, qui était caché dessous (déjà le cas sur l'ancien site). */
.maef-v3 .fq-hero,
.maef-v3 .lp-hero,
.maef-v3 .fa-hero {
  background: var(--v3-green);
  background-image: none;
  border-radius: 0 0 36px 36px;
  padding-top: 148px;
  padding-bottom: 64px;
}
.maef-v3 .fq-bc,
.maef-v3 .lp-bc,
.maef-v3 .fa-crumbs { color: rgba(255, 255, 255, 0.55); font-size: 13px; font-weight: 500; }
.maef-v3 .fq-bc a,
.maef-v3 .lp-bc a,
.maef-v3 .fa-crumbs a { color: rgba(255, 255, 255, 0.78); }
.maef-v3 .fq-bc a:hover,
.maef-v3 .lp-bc a:hover,
.maef-v3 .fa-crumbs a:hover { color: #fff; text-decoration: underline; text-underline-offset: 3px; }
.maef-v3 .fq-h1,
.maef-v3 .lp-h1,
.maef-v3 .fa-hero h1 {
  color: #fff;
  font-weight: 800;
  letter-spacing: -0.035em;
  line-height: 1.08;
}
.maef-v3 .fq-h1,
.maef-v3 .lp-h1 { font-size: clamp(30px, 3.6vw, 44px); }
.maef-v3 .fq-hmeta { color: rgba(255, 255, 255, 0.7); font-size: 14px; }
.maef-v3 .lp-sub,
.maef-v3 .fa-hero p { color: rgba(255, 255, 255, 0.82); }
.maef-v3 .fq-pill {
  color: var(--v3-green);
  background: var(--v3-sage);
  border: 0;
  font-weight: 700;
  letter-spacing: 0;
  padding: 6px 14px;
}

/* ---------- Corps : bande crème arrondie, cartes blanches ---------- */
.maef-v3 .fq-section,
.maef-v3 .lp-section,
.maef-v3 .fa-page {
  background: var(--v3-cream);
  border-radius: 36px;
  margin: 12px;
}
.maef-v3 .fq-section,
.maef-v3 .lp-section { padding: 56px 0 72px; }
.maef-v3 .fa-page { padding: 48px 20px 72px; color: var(--v3-ink); }

.maef-v3 .fq-card,
.maef-v3 .fq-widget,
.maef-v3 .lp-card,
.maef-v3 .fa-card,
.maef-v3 .fq-ask {
  background: #fff;
  border: 0;
  border-radius: 24px;
  box-shadow: 0 1px 0 var(--v3-line), 0 24px 50px -30px rgba(16, 65, 59, 0.45);
}

/* ---------- Mentions légales / politique de confidentialité ---------- */
.maef-v3 .lp-prose { color: var(--v3-ink); font-size: 16px; line-height: 1.7; }
.maef-v3 .lp-prose p,
.maef-v3 .lp-prose li { color: #3d4441; }
.maef-v3 .lp-prose h2 {
  color: var(--v3-ink);
  font-size: 1.4rem;
  font-weight: 800;
  letter-spacing: -0.03em;
  border-top-color: var(--v3-line);
}
.maef-v3 .lp-prose h3 { color: var(--v3-green); font-weight: 700; letter-spacing: -0.015em; }
.maef-v3 .lp-prose strong { color: var(--v3-ink); font-weight: 700; }
.maef-v3 .lp-prose a { color: var(--v3-green); font-weight: 600; text-decoration-color: rgba(16, 65, 59, 0.35); }
.maef-v3 .lp-prose a:hover { color: var(--v3-green-deep); text-decoration-color: var(--v3-green); }
.maef-v3 .lp-prose ul li::marker { color: var(--v3-green); }
.maef-v3 .lp-updated { color: var(--v3-grey); }

/* ---------- Question du forum (/forum/[slug]) ---------- */
.maef-v3 .fq-resolved { background: var(--v3-sage); color: var(--v3-green); font-weight: 700; }
.maef-v3 .fq-a { border: 0; border-top: 4px solid var(--v3-green); }
.maef-v3 .fq-a .fq-head[style] { border-top-color: var(--v3-line) !important; }
.maef-v3 .fq-card[style*="dashed"] {
  border: 1.5px dashed var(--v3-line) !important;
  box-shadow: none;
  color: var(--v3-grey) !important;
}
.maef-v3 .fq-av-citizen { background: var(--v3-sage); color: var(--v3-green); border: 0; font-weight: 800; }
/* L'icône de l'ancien logo (bleu-rouge) cède la place à un monogramme vert, comme le logo texte. */
.maef-v3 .fq-av-brand { background: var(--v3-green); border: 0; box-shadow: none; }
.maef-v3 .fq-av-brand img { display: none; }
.maef-v3 .fq-av-brand::after { content: "M"; color: #fff; font: 800 19px/1 var(--v3-sans); letter-spacing: -0.04em; }
.maef-v3 .fq-badge { background: var(--v3-cta); }
.maef-v3 .fq-badge svg { stroke: var(--v3-ink); }
.maef-v3 .fq-author { color: var(--v3-ink); }
.maef-v3 .fq-role { color: var(--v3-green); }
.maef-v3 .fq-date { color: var(--v3-grey); }
.maef-v3 .fq-verified { color: var(--v3-green); background: var(--v3-sage); letter-spacing: 0.04em; }
.maef-v3 .fq-text { color: #3d4441; font-size: 16px; }
.maef-v3 .fq-text.fq-ans { color: var(--v3-ink); font-size: 16.5px; }
.maef-v3 .fq-wt { color: var(--v3-ink); font-weight: 800; letter-spacing: -0.02em; font-size: 17px; }
.maef-v3 .fq-wt-w { color: #fff; }
.maef-v3 .fq-wp { color: var(--v3-grey); font-size: 14px; }
.maef-v3 .fq-wp-w { color: rgba(255, 255, 255, 0.78); }
.maef-v3 .fq-widget,
.maef-v3 .fq-widget-dark { padding: 24px; }
.maef-v3 .fq-widget-dark { background: var(--v3-green); background-image: none; border-radius: 24px; }

/* Boutons : action principale en jaune d'or, pilule, texte encre */
.maef-v3 .fq-btn,
.maef-v3 .fq-ask .fq-askbtn,
.maef-v3 .fa-submit,
.maef-v3 .fa-btn,
.maef-v3 .fsrch-go,
.maef-v3 .fsrch-ask-btn {
  background: var(--v3-cta);
  color: var(--v3-ink);
  border-radius: 999px;
  font-weight: 700;
  box-shadow: 0 8px 20px -10px rgba(253, 183, 42, 0.9);
  transition: box-shadow 0.15s ease, transform 0.15s ease, background-color 0.15s ease;
}
.maef-v3 .fq-btn:hover,
.maef-v3 .fq-ask .fq-askbtn:hover,
.maef-v3 .fa-submit:hover,
.maef-v3 .fa-btn:hover,
.maef-v3 .fsrch-go:hover,
.maef-v3 .fsrch-ask-btn:hover {
  background: var(--v3-cta);
  color: var(--v3-ink);
  box-shadow: 0 10px 24px -8px rgba(253, 183, 42, 0.95);
}
/* Bouton secondaire sur la carte verte : blanc, texte vert */
.maef-v3 .fq-btn.fq-btn-light { background: #fff; color: var(--v3-green); box-shadow: none; }
.maef-v3 .fq-btn.fq-btn-light:hover { background: var(--v3-sage); color: var(--v3-green); box-shadow: none; }
.maef-v3 .fq-btn { padding: 13px 16px; }

.maef-v3 .fq-rt { color: var(--v3-ink); font-weight: 800; letter-spacing: -0.03em; font-size: 1.45rem; }
.maef-v3 .fq-rcard {
  color: var(--v3-ink);
  border: 1px solid var(--v3-line);
  border-radius: 20px;
}
.maef-v3 .fq-rcard:hover {
  border-color: var(--v3-green);
  box-shadow: 0 18px 36px -24px rgba(16, 65, 59, 0.5);
}
.maef-v3 .fq-rcat { color: var(--v3-green); }
.maef-v3 .fq-rtitle { color: var(--v3-ink); font-weight: 700; font-size: 15px; }
.maef-v3 .fq-ask p { color: var(--v3-grey); font-size: 16px; }
.maef-v3 .fq-ask .fq-askbtn { padding: 14px 26px; }

/* ---------- Recherche du forum (héros de /forum) ---------- */
.maef-v3 .fsrch-box {
  border-radius: 999px;
  padding: 6px 6px 6px 20px;
  box-shadow: 0 18px 44px -18px rgba(11, 46, 42, 0.55);
}
.maef-v3 .fsrch-box svg { color: var(--v3-green); }
.maef-v3 .fsrch-input { color: var(--v3-ink); }
.maef-v3 .fsrch-input::placeholder { color: #7d8581; }
.maef-v3 .fsrch-go { padding: 12px 22px; }
.maef-v3 .fsrch-panel { border-radius: 24px; box-shadow: 0 24px 50px -24px rgba(11, 46, 42, 0.55); }
.maef-v3 .fsrch-lbl { color: var(--v3-grey); }
.maef-v3 .fsrch-item { border-top-color: var(--v3-line); }
.maef-v3 .fsrch-item:hover { background: var(--v3-sage); }
.maef-v3 .fsrch-item-cat { color: var(--v3-green); }
.maef-v3 .fsrch-item-title { color: var(--v3-ink); }
.maef-v3 .fsrch-ask { background: var(--v3-sage); border-top-color: var(--v3-line); }
.maef-v3 .fsrch-ask-txt { color: var(--v3-ink); }

/* ---------- Formulaire « Poser une question » (/forum/poser et bas de /forum) ---------- */
.maef-v3 .fa-hero p { font-size: 18px; }
.maef-v3 .fa-hero h1 { font-size: clamp(36px, 4.6vw, 56px); }
/* Sur /forum, ce bloc suit la bande crème de la liste : il passe en sauge pour s'en détacher. */
.maef-v3 .fa-section {
  background: var(--v3-sage);
  border-top: 0;
  border-radius: 36px;
  margin: 12px;
  color: var(--v3-ink);
}
.maef-v3 .fa-section-lead { color: var(--v3-grey); }
.maef-v3 .fa-aside h2,
.maef-v3 .fa-success h2 { color: var(--v3-ink); }
.maef-v3 .fa-form label,
.maef-v3 .fa-legend { color: var(--v3-ink); font-weight: 700; }
.maef-v3 .fa-form label small,
.maef-v3 .fa-legend small,
.maef-v3 .fa-hint { color: var(--v3-grey); }
.maef-v3 .fa-form input,
.maef-v3 .fa-form textarea {
  border: 1.5px solid var(--v3-line);
  border-radius: 14px;
  color: var(--v3-ink);
}
.maef-v3 .fa-form input::placeholder,
.maef-v3 .fa-form textarea::placeholder { color: #7d8581; }
.maef-v3 .fa-form input:focus,
.maef-v3 .fa-form textarea:focus {
  border-color: var(--v3-green);
  box-shadow: 0 0 0 3px rgba(16, 65, 59, 0.14);
}
.maef-v3 .fa-chip span {
  border: 1.5px solid var(--v3-line);
  color: var(--v3-ink);
  font-weight: 600;
}
.maef-v3 .fa-chip:hover span { border-color: var(--v3-green); }
.maef-v3 .fa-chip input:checked + span {
  background: var(--v3-green);
  border-color: var(--v3-green);
  color: #fff;
}
.maef-v3 .fa-chip input:focus-visible + span { outline-color: var(--v3-green); }
.maef-v3 .fa-submit { padding: 16px 20px; }
.maef-v3 .fa-submit:active { transform: scale(0.99); }
.maef-v3 .fa-error { background: #FFF4E5; color: var(--v3-ink); border-radius: 12px; }
.maef-v3 .fa-legal { color: var(--v3-grey); }
.maef-v3 .fa-reassure { color: var(--v3-grey); }
.maef-v3 .fa-reassure svg { color: var(--v3-green); }
.maef-v3 .fa-success-icon { background: var(--v3-sage); color: var(--v3-green); }
.maef-v3 .fa-success p { color: var(--v3-grey); }
.maef-v3 .fa-success p strong { color: var(--v3-ink); }
.maef-v3 .fa-btn { padding: 13px 22px; }
.maef-v3 .fa-btn.is-light { background: var(--v3-sage); color: var(--v3-green); box-shadow: none; }
.maef-v3 .fa-btn.is-light:hover { background: #dfeedb; color: var(--v3-green); box-shadow: none; }
.maef-v3 .fa-steps li { color: var(--v3-grey); }
.maef-v3 .fa-steps li strong { color: var(--v3-ink); }
.maef-v3 .fa-steps li span { background: var(--v3-green); color: #fff; font-weight: 800; }
.maef-v3 .fa-examples li { background: var(--v3-cream); color: var(--v3-ink); border-radius: 14px; }

/* ---------- Tablette et mobile ---------- */
@media (max-width: 991px) {
  .maef-v3 .fq-hero,
  .maef-v3 .lp-hero,
  .maef-v3 .fa-hero { padding-top: 104px; padding-bottom: 48px; }
}
@media (max-width: 860px) {
  .maef-v3 .fq-hero,
  .maef-v3 .lp-hero,
  .maef-v3 .fa-hero { border-radius: 0; }
  .maef-v3 .fq-section,
  .maef-v3 .lp-section,
  .maef-v3 .fa-page,
  .maef-v3 .fa-section { border-radius: 0; margin: 0; }
  .maef-v3 .fq-section,
  .maef-v3 .lp-section { padding: 36px 0 56px; }
  .maef-v3 .fa-page { padding: 32px 16px 56px; }
  .maef-v3 .fq-card,
  .maef-v3 .fq-ask { padding: 22px 20px; }
}
@media (max-width: 600px) {
  .maef-v3 .fsrch-box { padding-left: 16px; }
  .maef-v3 .fsrch-go { padding: 11px 16px; }
  .maef-v3 .fq-wrap,
  .maef-v3 .lp-wrap { padding: 0 16px; }
}