/* ==========================================================================
   COUCHE 4 — Pour les professionnels
   La page n'a que deux contenus : deux portes à choisir, puis la sortie vers
   l'appel découverte pour ceux qui se sont trompés de porte. Les cartes sont
   donc l'élément principal de la page, pas une grille secondaire : elles
   prennent la place, le repère chiffré et la hiérarchie qui vont avec.
   Cette feuille n'est chargée que sur cette page, d'où l'absence de préfixe.
   ========================================================================== */

.specialites__grille {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 26rem), 1fr));
  gap: 1.5rem;
  margin-top: 0;
}

.carte {
  position: relative;
  padding: clamp(2rem, 4vw, 3rem);
  background: var(--papier);
  border-color: var(--trait-encre);
}

/* Un filet vert au-dessus de la carte : le même repère visuel que la barre
   d'accent des titres, transposé à un objet cliquable. */
.carte::before {
  content: "";
  position: absolute;
  inset: -1px -1px auto -1px;
  height: 3px;
  background: var(--vert-signal);
  border-radius: var(--radius) var(--radius) 0 0;
  opacity: 0;
  transition: opacity 0.18s ease;
}
.carte:hover::before,
.carte:focus-within::before { opacity: 1; }

.carte .dossier__ref {
  margin-bottom: 1.25rem;
  padding-bottom: 1.25rem;
  border-bottom: 1px solid var(--trait-encre);
}

.carte h3 {
  font-size: clamp(1.375rem, 2.6vw, 1.75rem);
  letter-spacing: -0.015em;
  margin-bottom: 1.125rem;
}

.carte p { flex-grow: 0; }
.carte p + p { margin-top: 0.875rem; }

/* Le lien de la carte se pose en bas, aligné d'une carte à l'autre quelle que
   soit la longueur des deux textes. */
.carte__lien {
  margin-top: auto;
  padding-top: 1.75rem;
}