/* Page d'accueil : le choix entre les outils */
.intro{
  color:var(--gris);font-size:1.1rem;max-width:60ch;
  margin:12px auto 24px;text-align:center;
}
.cartes{
  display:grid;gap:20px;
  grid-template-columns:repeat(auto-fit,minmax(320px,1fr));
}
.carte-outil{
  display:flex;flex-direction:column;
  background:var(--carte);border-radius:var(--radius);box-shadow:var(--ombre);
  border:2px solid transparent;
  padding:28px;text-decoration:none;color:inherit;
  transition:border-color .15s, transform .15s;
}
.carte-outil:hover,.carte-outil:focus-visible{
  border-color:var(--orange);transform:translateY(-2px);outline:none;
}
.carte-emoji{font-size:2.6rem;line-height:1;display:block;color:var(--orange)}
.logo-grille,.logo-geo{width:1em;height:1em;display:block}
/* la couleur est posée sur les tracés : currentColor n'est pas hérité partout */
.logo-grille rect,.logo-grille path{stroke:var(--orange)}
.carte-outil h2{margin:14px 0 8px;font-size:1.5rem;color:var(--orange)}
.carte-accroche{font-size:1.05rem;font-weight:600;margin:0 0 10px}
.carte-detail{color:var(--gris);margin:0 0 20px}
.carte-lien{margin-top:auto;font-weight:700;color:var(--orange)}

@media (prefers-reduced-motion:reduce){
  .carte-outil{transition:none}
  .carte-outil:hover,.carte-outil:focus-visible{transform:none}
}

/* L'appel aux retours, sous les outils */
.retours{
  max-width:1000px;margin:8px auto 0;padding:24px 28px;
  background:var(--carte);border-radius:var(--radius);box-shadow:var(--ombre);
  border-left:6px solid var(--orange);
}
.retours h2{margin:0 0 8px;font-size:1.25rem;color:var(--orange)}
.retours p{margin:0 0 12px;color:var(--gris);max-width:70ch}
.retours a.btn{display:inline-block;text-decoration:none}