/* tp.css - la passe typographique du 28/09, sortie des 73 pages.
   Elle y etait en 73 copies identiques au bloc <style id="tp">.
   Posee par un <link> a la place exacte du bloc, donc au meme rang
   de cascade. Sortie le 2026-10-04 par _nuit/purge_tp.py. */
/* --- typographie, passe du 28/09 -----------------------------------------
   Trois reglages ecrits pour le telephone restaient actifs sur ordinateur et
   cassaient les titres bien avant le bord de leur colonne :
     .sec-head          bride la colonne a 760px dans un conteneur de 1032 ;
     .sec-head h2       bride le titre a 26ch, soit 546px sur 1032 ;
     text-wrap:balance  repartit les mots en lignes egales au lieu de remplir
                        la ligne. C'est lui qui rend le defaut invisible : il
                        n'y a aucune marge apparente, le texte s'arrete.
   Au-dessus de 860px le titre prend la largeur de sa colonne et le remplissage
   redevient normal. Le corps de texte garde sa mesure de lecture : l'ecart
   entre un titre large et un paragraphe etroit devient une mise en page, plus
   un bridage. Sous 860px, rien ne change. */
@media(min-width:860px){
 /* text-wrap:wrap est compris partout ; pretty l'affine la ou il existe et
    evite le mot seul en derniere ligne. Si pretty n'est pas compris, la
    declaration est ignoree et wrap reste : la ligne se remplit quand meme. */
 main h1,main h2,main h3,main h4{text-wrap:wrap;text-wrap:pretty}

 /* la colonne de tete de section, et son titre */
 main .sec-head{max-width:none!important}
 main .sec-head>h2{max-width:none!important}

 /* deux titres de la page toit terrasse sont brides par un selecteur
    d'identifiant en !important : il faut les nommer pour passer devant */
 main #reparer h2,main #types h2{max-width:none!important}

 /* le titre du formulaire : colonne de 477px, bridage a 380px */
 main .form-sec .form-txt h2,main .form2 .form-l h2{max-width:none!important}

 /* les deux niveaux de titre des pages retravaillees, la ou le bridage
    en ch n'a pas encore ete retire du style de la page */
 main h2.pz-xl,main h2.pz-l{max-width:none!important}
}

/* --- le chapeau long passe sur deux colonnes ------------------------------
   Un chapeau de 300 caracteres et plus tenait sur 8 ou 9 lignes dans une
   demi-largeur, avec le reste de la ligne vide a droite. Deux colonnes lui
   rendent la largeur sans allonger la ligne de lecture : la mesure reste
   autour de 55 caracteres, la colonne de texte occupe le conteneur.
   Wilson : "a la limite, il y aurait une photo a cote, je comprends. Mais
   quand c'est pas necessaire, pourquoi redescendre ?"
   En dessous de 1100px les colonnes seraient trop etroites : une seule. */
@media(min-width:1100px){
 main p.tp-2col{
  max-width:none!important;
  column-count:2;column-gap:clamp(40px,4vw,64px);
  orphans:2;widows:2
 }
}

/* --- le resume de page, sous la barre de chapitres ------------------------
   Wilson : "on dirait une sorte de texte qui ne doit pas etre la, qui se
   retrouve la un peu par defaut. Je trouve que ce n'est pas esthetique."
   Il avait raison, et l'historique de la feuille l'explique : ce paragraphe a
   ete restyle treize fois, chaque passe annulant la precedente, jusqu'a ne
   plus rien porter du tout.
   Il reprend la forme deja en place sur la page Hauts-de-Seine : le resume se
   decoupe a ses propres phrases, chaque partie recoit un libelle mono et son
   filet, et l'ensemble occupe la largeur. Aucun mot n'est reecrit : on coupe
   aux points qui existaient deja. */
main .enbref{padding:clamp(28px,3.4vw,48px) 0 0!important}
main .enbref .wrap{display:block!important}
main .enbref .eb-g{display:grid!important;gap:18px}
main .enbref .eb-g>.enbref-p{
 margin:0!important;padding:16px 0 0!important;
 max-width:none!important;
 border:0!important;border-top:1px solid var(--stroke-med)!important;
 background:transparent!important;box-shadow:none!important;outline:0!important;
 font-size:15.5px!important;line-height:1.62!important
}
main .enbref .eb-g>.enbref-p::before,
main .enbref .eb-g>.enbref-p::after{display:none!important}
main .enbref .eb-k{
 display:block!important;margin:0 0 8px!important;
 font:400 10.5px/1 var(--fm)!important;letter-spacing:.12em!important;
 text-transform:uppercase!important;color:var(--ink-faint)!important
}
@media(min-width:860px){
 main .enbref .eb-g{grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:clamp(24px,2.6vw,44px)}
}
