/* Plumber Deboucheur — v4-20 (2026-09-16). Charge APRES v4-18.css.
   Reprend v4-19 avec des titres un cran plus bas (64 px etait trop gros).
   Un NOUVEAU nom de fichier a chaque retouche : sur o2switch le cache statique
   et les navigateurs ignorent le ?ver=. */

/* ---------- 1. Respiration verticale des sections ---------- */
:root{--sec:clamp(72px,7vw,164px);--sec-sm:clamp(60px,5.8vw,136px)}

/* ---------- 2. Titres de section ----------
   52 px paraissait petit, 64 px ecrasait la page : on se cale a 56 px, et un
   cran en dessous dans les sections a deux colonnes. */
.a4-h2{font-size:clamp(30px,3.9vw,56px);letter-spacing:-.018em}
.a4-split .a4-h2,.a4-zone .a4-h2,.a4-faq__col .a4-h2,.a4-devis .a4-h2,.a4-avis__tete .a4-h2{font-size:clamp(28px,3.3vw,48px)}

/* ---------- 3. Qui paie : photo, puis verdict en pastille ---------- */
.a4-payeurs .a4-payeur__photo{position:relative;display:block;aspect-ratio:16/11;overflow:hidden;background:var(--navy-deep)}
.a4-payeurs .a4-payeur__photo img{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;max-width:none!important;object-fit:cover!important;display:block;transition:transform .5s ease}
.a4-payeurs li:hover .a4-payeur__photo img{transform:scale(1.05)}
.a4-payeurs .a4-payeur__photo::after{content:"";position:absolute;left:0;right:0;bottom:0;height:62%;background:linear-gradient(to top,rgba(9,29,55,.9) 0%,rgba(9,29,55,.45) 45%,rgba(9,29,55,0) 100%)}
.a4-payeurs .a4-payeur__verdict{position:absolute;left:13px;right:13px;bottom:13px;z-index:2;display:inline-flex;align-items:center;justify-content:center;padding:9px 13px;border-radius:999px;background:var(--navy-deep);color:#fff;font-family:"Archivo",sans-serif;font-size:11px;font-weight:800;letter-spacing:.03em;line-height:1.2;text-align:center;text-transform:uppercase;white-space:nowrap}
.a4-payeurs .a4-payeur--vous .a4-payeur__verdict{background:var(--orange)}
.a4-payeurs .a4-payeur--bleu .a4-payeur__verdict{background:var(--navy)}

/* ---------- 4. Cartes d'articles : photo, sujet, titre, pied ---------- */
.art-grid{grid-template-columns:repeat(auto-fill,minmax(min(320px,100%),1fr));gap:clamp(14px,1.4vw,24px)}
.art-carte{display:flex;flex-direction:column;background:#fff;border:1px solid var(--line);border-radius:16px;overflow:hidden;text-decoration:none}
.art-carte__img{position:relative;display:block;aspect-ratio:16/10;overflow:hidden;background:var(--navy-deep)}
.art-carte__img img{position:absolute;inset:0;width:100%;height:100%;aspect-ratio:auto;object-fit:cover;border:0;display:block;transition:transform .5s ease}
.art-carte:hover .art-carte__img img{transform:scale(1.05)}
.art-carte__cat{position:absolute;left:12px;top:12px;z-index:2;padding:7px 13px;border-radius:999px;background:var(--orange);color:#fff;font-family:"Archivo",sans-serif;font-size:11.5px;font-weight:800;letter-spacing:.06em;line-height:1;text-transform:uppercase}
.art-carte__corps{display:flex;flex-direction:column;gap:11px;flex:1;padding:clamp(18px,1.7vw,26px)}
.art-carte h3{margin:0;font-family:"Archivo",sans-serif;font-size:clamp(19px,1.35vw,23px);line-height:1.26;color:var(--navy-deep);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.art-carte p{margin:0;font-size:var(--t-16);line-height:1.6;color:var(--body);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.art-carte__pied{display:flex;flex-wrap:wrap;align-items:center;gap:6px 14px;margin-top:auto;padding-top:14px;border-top:1px solid var(--line)}
.art-carte__date{font-size:14px;line-height:1.4;color:var(--muted)}
.art-carte__lire{margin-left:auto;font-family:"Archivo",sans-serif;font-size:15px;font-weight:800;color:var(--navy);white-space:nowrap}
.art-carte:hover .art-carte__lire{text-decoration:underline;text-underline-offset:3px}

/* ---------- 5. Pages services : photo a la place de la video, bloc
   « qui vient chez vous » en bas de page ---------- */
.a4-video--photo img{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;max-width:none!important;object-fit:cover!important;display:block}
.a4-cas__carte:not(a){cursor:default}
.a4-mot{display:grid;grid-template-columns:minmax(0,.34fr) minmax(0,1fr);gap:clamp(20px,2.4vw,44px);align-items:center;padding:clamp(20px,2vw,30px);border:1px solid var(--line);border-radius:18px;background:#fff}
.a4-mot__photo{position:relative;overflow:hidden;border-radius:14px;aspect-ratio:4/3}
.a4-mot__photo img{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;max-width:none!important;object-fit:cover!important;display:block}
.a4-mot__titre{margin:0;font-family:"Archivo",sans-serif;font-size:clamp(20px,1.5vw,26px);line-height:1.2;color:var(--navy-deep)}
.a4-mot__sign{font-size:15px;color:var(--muted)}

/* ---------- 6. Surcharges responsive (toujours en dernier) ---------- */
@media (max-width:900px){
  .a4-mot{grid-template-columns:minmax(0,1fr)}
  .a4-mot__photo{aspect-ratio:16/9}
}