/* Plumber Deboucheur — v4-32 (2026-09-17). Charge apres v4-31.css.
   Cartes d'article (accueil, blog, bas d'article) : l'etiquette de rubrique
   arrete de crier, le titre prend la place, l'extrait s'allege, et la carte
   reagit au survol. S'applique partout ou vit .art-carte, pour garder le meme
   composant sur tout le site. */

/* ---------- 1. La carte ---------- */
.art-carte{
  border-color:var(--line-3);
  border-radius:18px;
  transition:transform .25s ease,border-color .25s ease;
}
.art-carte:hover,
.art-carte:focus-visible{
  transform:translateY(-4px);
  border-color:var(--navy);
}

/* ---------- 2. L'etiquette de rubrique ----------
   Trois pastilles orange identiques cote a cote mangeaient les photos : on
   passe en blanc, texte bleu nuit, et l'orange reste pour les boutons. */
.art-carte .art-carte__cat{
  left:14px;
  top:14px;
  padding:7px 12px;
  background:rgba(255,255,255,.94);
  color:var(--navy-deep);
  font-size:10.5px;
  letter-spacing:.08em;
}

/* ---------- 3. Le texte ---------- */
.art-carte .art-carte__corps{gap:12px}
.art-carte .art-carte__corps h3{
  font-size:clamp(20px,1.45vw,25px);
  line-height:1.22;
  letter-spacing:-.012em;
}
.art-carte .art-carte__corps p{
  font-size:var(--t-15);
  line-height:1.62;
  color:var(--muted);
  -webkit-line-clamp:2;
}

/* ---------- 4. Le pied de carte ---------- */
.art-carte .art-carte__pied{
  padding-top:15px;
  border-top:1px solid var(--line-3);
}
.art-carte .art-carte__date{font-size:13.5px;color:var(--muted)}
.art-carte .art-carte__lire{
  display:inline-flex;
  align-items:center;
  gap:7px;
  font-size:14.5px;
  color:var(--navy);
}
.art-carte .art-carte__lire span{display:inline-block;transition:transform .25s ease}
.art-carte:hover .art-carte__lire{text-decoration:none}
.art-carte:hover .art-carte__lire span{transform:translateX(4px)}

/* ---------- 5. Surcharges responsive (toujours en dernier) ---------- */
@media (prefers-reduced-motion:reduce){
  .art-carte,
  .art-carte .art-carte__lire span{transition:none}
  .art-carte:hover{transform:none}
}
