/* NIDUM · texte justifié sur tout le site (retour YNqfzdXy, 22/09)

   Césure des mots longs seulement, depuis le 07/10 : 8 lettres au moins,
   4 de chaque côté de la coupure. Les mots courts ne sont jamais coupés
   (Oliver : « début » coupé en « dé-but », c'était non) ; les mots longs le
   sont, sinon le navigateur étire les espaces de toute la ligne et creuse
   des trous (essayé sans césure du tout le 07/10, refusé).

   Paragraphes de lecture seulement : les titres, libellés et boutons restent
   comme ils sont, un titre justifié se lit mal. Les avis clients aussi (cartes
   Google, citation des fiches projets) : ce sont leurs mots, laissés tels quels,
   et dans les cartes étroites la ligne coupée par « … » s'étirait.

   À partir de 600 px seulement. Mesuré le 23/09 sur les 17 pages : sur
   ordinateur et tablette, une seule ligne du site dépasse 3 espaces d'écart ;
   sur téléphone, la colonne ne tient qu'une quarantaine de caractères et
   18 blocs dépassaient 3 espaces (jusqu'à 5,6), quel que soit le réglage de
   césure. Le téléphone garde donc l'alignement d'origine de chaque bloc.
   « text-wrap: pretty » a été essayé : il creuse davantage, écarté. */

@media (min-width: 600px) {

  .equipe-texte .texte p,
  .vitrine-intro,
  .syna-texte p,
  .syna-corps .fin,
  .citation p,
  .bloc-intro,
  .mf-infos .texte p,
  .ag-bandeau-texte p,
  .ag-citation p,
  .ag-metiers-texte > p:not(.ag-partielle),
  .lg-corps p,
  .lg-corps li,
  /* pages créées après le 23/09 et cartes, ajoutées le 07/10 (Christophe :
     « il faut que tous les textes soient justifiés ») ; les avis clients
     restent exclus, comme plus haut */
  .ag-eng p,
  .ag-trio li,
  .mt-texte > p:not(.k),
  .mt-liste li,
  .mt-rep,
  .syna-corps p:not(.syna-q):not(.syna-lien),
  .syna-liste li,
  .pr-chapo,
  .etape .carte p,
  .pr-type p,
  /* oubliés jusqu'au 13/10 (Oliver : « justifier tous les textes ») :
     encarts Synamome et décennale, dates du Synamome */
  .garant p,
  .syna-dates li > span,
  .mf-k {
    text-align: justify;
    text-align-last: left;
    -webkit-hyphens: auto;
    hyphens: auto;
    hyphenate-limit-chars: 8 4 4;
    -webkit-hyphenate-limit-before: 4;
    -webkit-hyphenate-limit-after: 4;
  }

  /* Paragraphes centrés (chapeau du contact, intros de la page agence, texte
     du sélecteur de Prestations) : le bloc est justifié, la dernière ligne
     reste centrée, la mise en page ne bouge pas. */
  .contact-intro,
  .ag-eng-tete p,
  .pr-choix-texte,
  .tuile .bloc span {
    text-align: justify;
    text-align-last: center;
    -webkit-hyphens: auto;
    hyphens: auto;
    hyphenate-limit-chars: 8 4 4;
    -webkit-hyphenate-limit-before: 4;
    -webkit-hyphenate-limit-after: 4;
  }
}

/* ─── téléphone : tailles minimales (Oliver, 08/10, audit mobile du 30/09) ───
   Mesuré à 375 px : des libellés de 9,5 à 11,5 px et des liens de 7 à 34 px
   de haut. Les textes passent à 12 px au moins, sauf deux libellés qui
   passaient sur plusieurs lignes à 12 px : la mention « obligatoire » du
   formulaire de contact et le sous-titre de la carte Instagram de l'accueil.
   Les liens gardent leur apparence, mais leur zone de toucher est agrandie
   par un calque invisible (::before) d'environ 44 px de haut, la taille d'un
   doigt. */
@media (max-width: 760px) {

  .rubrique,
  .duo-nom .form,
  .signature span span,
  .vt-leg span,
  .vt-leg i,
  .garant-k,
  .garant-suite .k,
  .garant-plus,
  .preuve-tete .k,
  .igw-ab,
  .igw-suivre,
  .pied-bas span,
  .pied-bas a,
  .ag-role,
  .mf-nav a,
  .mf-col h3 .l2,
  .mf-col h1 .l2,
  .gliss-tag,
  .mf-infos .k,
  .bloc-form legend,
  .coord-k,
  .tuile .kick {
    font-size: 12px
  }

  .equipe-lien a,
  .equipe-actions .tel,
  .vision-lien a,
  .garant-plus,
  .syna-lien a,
  .gav-plus,
  .gdef-dot,
  .gdef-nav,
  .pied-coord a,
  .pied-bas a,
  .ag-linkedin,
  .book-filtre,
  .mf-nav a,
  .mf-doc .lien,
  .accord-info a,
  .form-appel a,
  .coord-v,
  .coord-lien,
  .lien-google {
    position: relative
  }

  .equipe-lien a::before,
  .equipe-actions .tel::before,
  .vision-lien a::before,
  .garant-plus::before,
  .syna-lien a::before,
  .gav-plus::before,
  .gdef-dot::before,
  .gdef-nav::before,
  .pied-coord a::before,
  .pied-bas a::before,
  .ag-linkedin::before,
  .book-filtre::before,
  .mf-nav a::before,
  .mf-doc .lien::before,
  .accord-info a::before,
  .form-appel a::before,
  .coord-v::before,
  .coord-lien::before,
  .lien-google::before {
    content: "";
    position: absolute;
    inset: -12px -6px
  }

  .gdef-dot::before,
  .ag-linkedin::before {
    inset: -14px
  }
}