/* Pallier — app/legal.css — V133 : les quatre pages légales (mentions légales, confidentialité, confidentialité des artisans, conditions
   d’utilisation) au gabarit commun de la vitrine (app/vitrine.css, app/vitrine.js), comme « Reconnaître un vrai dépanneur » en V130.
   LE TEXTE DE CES PAGES NE CHANGE PAS : cette feuille ne fait que le mettre en page (une colonne de 760 px, la police et les couleurs de
   la charte, les cartes à plat : style A, l’ombre dure seulement sur ce qu’on touche). Les classes du texte (maj, acompleter, carte,
   pilote, jamais, note, chapo, reglage-mesure…) sont celles d’avant, pour que rien de ce que lisent les recettes ni app/mesure-reglage.js
   ne bouge. À charger après app/vitrine.css, et seulement par ces quatre pages (et, depuis la V138, par « Ce qu’on se promet »,
   kit-artisan.html, avec app/kit.css après elle ; depuis la V148, par « Conditions », conditions.html : voir la fin de la feuille).
   « Dernière mise à jour », la version de la politique : ce que cette feuille ne doit jamais effacer ni rendre discret.
   V147 : les emplacements d’une information à venir (.acompleter) se lisent comme le texte qui les entoure (voir plus bas). */

.page{max-width:760px;padding:4px 0 44px;overflow-wrap:break-word}
@media (min-width:900px){.page{padding:24px 0 80px}}
/* un lien d’ancre (« Ne pas être compté », « Crédits photos »…) : la partie où l’on arrive ne se cache pas sous l’en-tête collant.
   V133 (testeur, C2 : WCAG 2.4.11) : la place de l’en-tête et de la barre est réservée à toute la page (scroll-padding), pour que le
   lien qui a le focus du clavier ne passe jamais dessous ; la marge des ancres baisse d’autant : elles arrivent au même endroit
   qu’avant (74 + 10 = 84 px au téléphone, 94 + 10 = 104 px sur ordinateur). */
.page [id]{scroll-margin-top:84px}   /* V139 : plus de scroll-padding (il faisait sauter la page à l’ouverture du menu) ; le focus est protégé dans app/vitrine.css */
@media (min-width:900px){.page [id]{scroll-margin-top:104px}}

.page h1{margin:4px 0 8px}
.page h2{font-size:1.32rem;margin:34px 0 10px;letter-spacing:-.025em}
@media (min-width:900px){.page h2{font-size:1.6rem;margin:44px 0 12px}}
.page p,.page li{font-size:.97rem;color:var(--foret-doux);font-weight:600;line-height:1.55}
.page p{margin:0 0 12px}
.page b{color:var(--foret)}
.page a{color:var(--foret);font-weight:800;text-underline-offset:3px}
.page ul,.page ol{margin:0 0 14px;padding-left:22px}
.page li{margin:0 0 6px}
.page li:last-child{margin-bottom:0}
.page .ariane{padding:16px 0 6px}

/* « Dernière mise à jour : … (version …) » et la ligne de date des conditions */
.page .maj{font-size:.88rem;font-weight:700;color:var(--foret-doux);margin:0 0 24px;text-wrap:balance}   /* sur un écran étroit, la coupure tombe avant « (version… », jamais dans le numéro 2026-10-20 */

/* un emplacement d’une information à venir (V87 ; V147, HB, 22/10 : « Mets “à venir” ou “en cours” dès qu’il y a une information à compléter »).
   Il dit « à venir » ou « en cours » : c’est une information, pas une tâche (décidé par le CEO) ; il se lit donc comme le texte autour, sans
   fond, sans bord, sans graisse à part. La classe et l’id restent : ce sont eux qu’on remplira (nom, adresse, téléphone, durée des copies). */
.acompleter{background:none;border:0;border-radius:0;padding:0;color:inherit;font:inherit}

/* les cartes, à plat : la liste de ce que nous collectons (confidentialité), « Ce que Pallier ne fait jamais » et la phase pilote (conditions) */
.page .carte,.page .jamais,.page .pilote{border:var(--trait);border-radius:var(--r);margin:14px 0 18px}
.page .carte{background:var(--blanc);padding:16px 18px}
.page .jamais{background:var(--abricot-doux);padding:16px 18px;margin:14px 0 18px}
.page .jamais p{margin-bottom:6px}
.page .pilote{background:var(--ciel-doux);padding:14px 18px;font-size:.92rem;font-weight:700;margin:0 0 26px}
.page .carte>:last-child,.page .jamais>:last-child{margin-bottom:0}
.page .carte li,.page .jamais li{margin-bottom:8px}
.page .carte li:last-child,.page .jamais li:last-child{margin-bottom:0}

/* les conditions : le chapô, la note de fin */
.page .chapo{font-size:1.06rem;font-weight:700;color:var(--foret-doux);line-height:1.45;margin:0 0 20px}
@media (min-width:900px){.page .chapo{font-size:1.22rem}}
.page .note{font-size:.84rem;font-weight:600;color:var(--foret-doux);margin-top:30px;border-top:var(--trait);padding-top:16px}

/* V112 — « Ne pas être compté » (app/mesure-reglage.js) : l’état à plat, le bouton (on le touche) avec son ombre dure ; le verrou [hidden] est
   dans app/vitrine.css (règle d’atelier n° 2) */
.reglage-mesure{display:block;background:var(--blanc);border:var(--trait);border-radius:16px;padding:11px 14px 12px;margin:8px 0 10px;
  color:var(--foret);font-weight:800;font-size:.95rem;line-height:1.5}
.reglage-mesure #mesure-etat{display:block}
.mesure-bouton{display:inline-flex;align-items:center;min-height:44px;margin-top:9px;font:inherit;font-size:.92rem;font-weight:800;line-height:1.2;
  color:var(--foret);background:var(--creme-2);border:var(--trait);border-radius:999px;padding:0 18px;box-shadow:0 3px 0 var(--foret);cursor:pointer;text-align:left}
.mesure-bouton:active{transform:translateY(2px);box-shadow:0 1px 0 var(--foret)}
.mesure-lien{display:inline-flex;align-items:center;min-height:44px;margin-top:4px;font:inherit;font-size:.92rem;font-weight:800;color:var(--foret);
  background:none;border:0;padding:0;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.mesure-bouton[disabled],.mesure-lien[disabled]{opacity:.55;cursor:default}

/* V148, partie 2 — « Conditions » (conditions.html) : trois textes l’un après l’autre (#utilisation, #abonnement, #donnees), chacun avec
   son titre de premier niveau (h1), sa date (« Version du … »), ses articles (.art : h3 sous une « Partie », h2 sinon, le même dessin).
   Les tableaux des annexes : bordés, à plat ; au téléphone, chaque ligne devient une carte (la colonne nommée au-dessus de sa valeur),
   pour que rien ne déborde à 390 px ; sur ordinateur, un vrai tableau. */
/* V149 — « Sur cette page », en tête de /conditions.html : les quatre textes, un lien chacun (44 px de haut au doigt), un filet à gauche ; à plat, sans emoji */
.conditions .sur-page{margin:6px 0 26px}
.conditions .sur-page p{font-size:.88rem;font-weight:900;color:var(--foret);margin:0 0 6px;letter-spacing:.01em}
.conditions .sur-page ul{list-style:none;margin:0;padding:0}
.conditions .sur-page li{margin:0}
.conditions .sur-page a{display:flex;align-items:center;min-height:44px;padding:4px 0 4px 14px;border-left:3px solid rgba(18,49,42,.16);font-weight:800;font-size:.97rem;line-height:1.3;color:var(--foret);text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1.5px}
.conditions .sur-page a:hover{border-left-color:var(--lime-ombre)}
@media (min-width:900px){.conditions .sur-page a{min-height:38px;padding-top:2px;padding-bottom:2px}}
.conditions .texte+.texte{margin-top:56px;padding-top:30px;border-top:var(--trait)}
.conditions .texte h1{margin:4px 0 10px}
.conditions .partie{font-size:1.32rem;margin:34px 0 10px}
@media (min-width:900px){.conditions .partie{font-size:1.6rem;margin:44px 0 12px}}
.conditions .art{font-size:1.08rem;font-weight:900;letter-spacing:-.015em;line-height:1.25;color:var(--foret);margin:28px 0 8px}
@media (min-width:900px){.conditions .art{font-size:1.2rem;margin:34px 0 10px}}
.conditions .tab{width:100%;border-collapse:collapse;margin:12px 0 20px;background:var(--blanc)}
.conditions .tab th,.conditions .tab td{border:var(--trait);padding:10px 12px;text-align:left;vertical-align:top;font-size:.92rem;line-height:1.45;color:var(--foret-doux);font-weight:600}
.conditions .tab th{color:var(--foret);font-weight:800}
.conditions .tab thead th{background:var(--creme-2)}
@media (max-width:699px){
  .conditions .tab,.conditions .tab tbody,.conditions .tab tr,.conditions .tab th,.conditions .tab td{display:block;width:auto}
  .conditions .tab{background:none;border:0}
  .conditions .tab thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}
  .conditions .tab tr{background:var(--blanc);border:var(--trait);border-radius:var(--r);padding:12px 14px;margin:0 0 12px}
  .conditions .tab th,.conditions .tab td{border:0;padding:0;margin:0 0 8px}
  .conditions .tab tr>:last-child{margin-bottom:0}
  .conditions .tab.colonnes td::before{content:attr(data-label);display:block;font-size:.8rem;font-weight:800;color:var(--foret);margin-bottom:2px}
}