/* Niveau Praticien — corrections pour téléphone (moins de 640 px).
   Rien ne s'applique au-delà : le rendu ordinateur est inchangé. */
@media (max-width: 640px) {
  /* Bloc « Conseiller immobilier » (même bloc que sur La Vente Inversée) :
     la deuxième carte était décalée de 26 px et son étiquette ne pouvait
     pas rétrécir. Le bloc imposait 404 px de large à toute la section
     « Public visé », texte compris. */
  .persona-card.mid { margin-left: 0; }
  .persona-card .badge { flex: 0 1 auto; }
  .split > * { min-width: 0; }

  /* Halo décoratif du bloc tarif : posé à 12 % au-delà du bloc, de chaque
     côté, il élargissait la page. Ramené à 16 px, il reste dans la marge. */
  .pe::before { inset: -8% -16px 4% -16px; }

  /* Pastilles flottantes du visuel du haut (« 8 sem. d'entraînement », « 5 visios », « Exercices ») : la colonne du visuel
     ne pouvait pas devenir plus étroite que son image, et les pastilles,
     posées à 26–30 px au-delà, sortaient de l'écran (constaté par Céline sur
     son téléphone). La colonne peut rétrécir, et les pastilles restent en
     débord de 12 px, donc dans la marge de 20 px de l'écran. */
  .hero-grid > * { min-width: 0; }
  .hero .chip-tl { left: -12px; }
  .hero .chip-br,
  .hero .chip-mr { right: -12px; }
}

/* Très petits écrans (moins de 380 px) : titre « Un accompagnement de haut
   niveau » en 40 px, le mot « accompagnement » (environ 310 px) dépassait de
   l'écran entre 320 et 340 px de large. Les grands titres de la page
   (section, bloc, appel final), tous à la même taille d'origine, passent
   ensemble à 34 px. */
@media (max-width: 380px) {
  .section-head h2,
  .block h2,
  .final-cta h2 { font-size: 34px; }
}

/* Bloc final (appel à l'action et photo), sur téléphone : le bouton, écrit
   sur une seule ligne, élargissait la colonne au-delà du bloc ; titre, texte
   et bouton étaient coupés à droite (4 px à 360 px de large). La colonne ne dépasse plus le
   bloc, et le texte du bouton passe à la ligne s'il ne tient pas. Marges
   intérieures du texte ramenées de 56 à 28 px, comme ce même bloc sur Duo
   Leads, Estim'Lead, Acquisition, Maître Praticien et La Vente Inversée
   (la maquette de cette page n'avait pas cette règle) : le bouton tient
   alors sur une ligne dès 420 px de large environ.
   Demande de Céline, 22 septembre 2026. */
@media (max-width: 640px) {
  .final-cta { grid-template-columns: minmax(0, 1fr); }
  .final-cta-text { padding: 40px 28px; }
  .final-actions .btn { max-width: 100%; white-space: normal; text-align: center; }
}
/* Interligne pour deux lignes, seulement là où le bouton ne tient plus sur
   une (moins de 370 px de large environ). */
@media (max-width: 380px) {
  .final-actions .btn { line-height: 1.3; }
}
