/* ————————————————————————————————————————————————
   H EVENTS — complément de legal.css pour les pages conseils
   (chargée après legal.css, qui porte la base commune)
   ———————————————————————————————————————————————— */

/* ——— fil d'Ariane, dans la tête de page ——— */
.fil{
  font-size:var(--lab);font-weight:500;text-transform:uppercase;
  letter-spacing:var(--ls-lab);display:flex;flex-wrap:wrap;gap:12px;align-items:baseline;
  color:rgba(245,241,229,.45);
}
.fil a{color:var(--sable);text-decoration:none;transition:color .4s var(--ease)}
.fil a:hover{color:var(--creme)}
.tete .fil + h1{margin-top:34px}

/* ——— chapo : la réponse d'abord, mise en avant ——— */
.corps .chapo{
  font-size:clamp(1.08rem,1.35vw,1.24rem);line-height:1.6;
  color:var(--encre);max-width:64ch;
}
.corps .chapo strong{font-weight:500}

/* la première section d'un article suit le chapo sans filet */
.corps .chapo + section h2{border-top:0;padding-top:clamp(36px,4.5vw,56px)}

/* ——— tableaux : garder l'intitulé de colonne en mobile ——— */
@media (max-width:620px){
  .tableau td[data-th]::before{
    content:attr(data-th) " : ";
    font-weight:500;color:var(--encre);
  }
}

/* ——— note de bas d'article (portée des chiffres) ——— */
.portee{
  margin-top:clamp(40px,5vw,64px);padding-top:22px;
  border-top:1px solid rgba(44,39,32,.14);
  color:var(--brume);font-size:.88em;
}

/* ——— appel final ——— */
.cta-fin{
  margin-top:clamp(48px,6vw,80px);
  background:var(--nuit);color:var(--creme);
  padding:clamp(30px,4.2vw,52px);
}
.cta-fin p{margin-top:16px;color:rgba(245,241,229,.78);max-width:52ch}
.btn-devis{
  display:inline-block;margin-top:26px;
  background:var(--sable);color:var(--nuit);text-decoration:none;
  font-size:var(--lab);font-weight:500;text-transform:uppercase;letter-spacing:var(--ls-lab);
  padding:17px 30px;transition:background-color .4s var(--ease);
}
.btn-devis:hover{background:var(--creme)}
.cta-fin .cta-alt{margin-top:20px;font-size:.92em}
.cta-fin .cta-alt a{color:var(--sable);text-decoration:none}
.cta-fin .cta-alt a:hover{text-decoration:underline;text-underline-offset:3px}

/* ——— à lire ensuite ——— */
.suite{margin-top:clamp(44px,5.5vw,72px)}
.suite ul{margin-top:6px}
.suite li{border-bottom:1px solid rgba(44,39,32,.1)}
.suite a{
  display:block;padding:18px 0;text-decoration:none;color:var(--encre);
  transition:color .4s var(--ease);
}
.suite a:hover{color:var(--bronze)}
.suite .ou{display:block;font-size:var(--lab);font-weight:500;text-transform:uppercase;
  letter-spacing:var(--ls-lab);color:var(--bronze);margin-bottom:7px}

/* ——— index des conseils ——— */
.liste-articles li{border-bottom:1px solid rgba(44,39,32,.12)}
.liste-articles a{
  display:block;padding:clamp(26px,3.4vw,40px) 0;text-decoration:none;
}
.liste-articles .theme{
  font-size:var(--lab);font-weight:500;text-transform:uppercase;
  letter-spacing:var(--ls-lab);color:var(--bronze);
}
.liste-articles h2{
  border-top:0;padding-top:0;margin-top:12px;display:block;
  font-weight:400;font-size:var(--d-s);line-height:1.3;letter-spacing:-.008em;
  color:var(--encre);transition:color .4s var(--ease);
}
.liste-articles a:hover h2{color:var(--bronze)}
.liste-articles p{margin-top:10px;color:var(--brume);max-width:62ch}