/* ---------- cartes applications : la photo domine ---------- */
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:28px}
.card{background:#fff;border:1px solid var(--line);display:flex;flex-direction:column;
  transition:border-color .18s,box-shadow .18s}
.card:hover{border-color:var(--blue);box-shadow:var(--sh-2)}
/* Toute la carte est cliquable : le lien du titre s'étend à sa surface. Un seul lien par carte, pour le clavier et les
   lecteurs d'écran ; la photo, l'accroche et « Découvrir » mènent donc à la même page que le titre. */
.card{position:relative}
.card__bd h2 a::after,.card__bd h3 a::after{content:"";position:absolute;inset:0;z-index:1}
.card__ph{position:relative}
.card__zo{display:block;aspect-ratio:4/3;overflow:hidden;background:var(--steel2)}
.card__zo img{width:100%;height:100%;object-fit:cover;transition:transform .6s ease}
.card:hover .card__zo img{transform:scale(1.045)}
.card__ic{position:absolute;left:0;bottom:0;width:52px;height:52px;
  background:var(--blue);color:#fff;display:grid;place-items:center;font-size:1.12rem}
.card__bd{padding:22px 22px 20px;display:flex;flex-direction:column;gap:11px;flex:1}
.card__bd h3 a{color:var(--navy)}
.card__bd h3 a:hover{color:var(--blue);text-decoration:none}
.card__bd p{font-size:.92rem}
.chips{display:flex;flex-wrap:wrap;gap:6px;margin-top:2px}
.chip{font-family:var(--ui);font-size:.68rem;font-weight:700;letter-spacing:.07em;
  text-transform:uppercase;color:var(--navy);border:1px solid var(--line);
  padding:4px 9px;white-space:nowrap}
.card .more{margin-top:auto;padding-top:14px;border-top:1px solid var(--line-s)}
.card:hover .more .ic{transform:translateX(3px)}
@media (max-width:1000px){.cards{grid-template-columns:repeat(2,1fr);gap:22px}}
@media (max-width:640px){.cards{grid-template-columns:1fr}}