
@import url('https://fonts.googleapis.com/css2?family=Archivo:wdth,wght@62..125,400..900&family=Source+Serif+4:ital,opsz,wght@0,8..60,400..700;1,8..60,400..700&display=swap');
:root{
 --enc:#1a1a1a; --pap:#fdfcfa; --creme:#f6f2ea; --fil:#ddd7cd;
 --gain:#1f5c3a; --perte:#8a2f22; --ocre:#6b5b3e; --gris:#6d6a64;
 --rose:#fbeae7; --sable:#f7f3e8; --nuit:#16150f;
 --titre:Archivo,'Helvetica Neue',Arial,sans-serif;
 --texte:'Source Serif 4','Source Serif Pro',Georgia,'Iowan Old Style',serif;
 --chif:Archivo,'Helvetica Neue',Arial,sans-serif;
}
*{box-sizing:border-box}
body:has(.a-fond){padding:0}
body{margin:0;background:var(--nuit);color:var(--enc);padding:1.4rem 1rem;
 font:16.5px/1.52 var(--texte);-webkit-font-smoothing:antialiased}
.page{max-width:40rem;margin:0 auto 1.4rem;background:var(--pap);
 padding:0 0 1.6rem;box-shadow:0 2px 0 rgba(0,0,0,.35)}

/* --- signature Résolution ---------------------------------------------- */
.marque{display:flex;align-items:baseline;justify-content:space-between;
 gap:1rem;padding:1.1rem 1.8rem .7rem}
.marque .nom{font:700 12px/1 var(--chif);letter-spacing:.32em;
 text-transform:uppercase;color:var(--enc)}
.marque .quoi{font:400 10px/1.3 var(--chif);letter-spacing:.12em;
 text-transform:uppercase;color:var(--gris);text-align:right}
/* Sous la signature, le tricolore en dégradé, d'un bord à l'autre. */
.filet{height:3px;margin:0 1.8rem;
 background:linear-gradient(90deg,#000091,#fff 50%,#e1000f)}

/* --- tête de fiche ------------------------------------------------------ */
.tete{padding:1.5rem 1.8rem 1.1rem}
.qui{font-family:var(--titre);font-size:2.05rem;line-height:1.06;
 font-weight:700;margin:0 0 .35rem;letter-spacing:-.015em}
.propose{display:inline-block;margin-left:.5rem;font:400 9px/1.6 var(--chif);
 letter-spacing:.05em;text-transform:uppercase;color:#a8632a;
 border:1px solid #e0c7a8;background:#fbf3e7;padding:0 .3rem;vertical-align:.4em}
.sur{margin:0 0 .5rem;font:700 10px/1 var(--chif);letter-spacing:.18em;
 text-transform:uppercase;color:var(--ocre)}
.def{margin:0;color:var(--gris);font-size:.95rem}
.lib{font-weight:600}
.compte{font:700 10.5px/1 var(--chif);letter-spacing:.12em;
 text-transform:uppercase;color:var(--ocre);margin:.8rem 0 0}

.corps{padding:0 1.8rem}
.bande{font:700 10.5px/1 var(--chif);letter-spacing:.14em;text-transform:uppercase;
 padding:.55rem 1.8rem;margin:1.5rem -1.8rem .9rem;color:var(--pap)}
.bande.g{background:var(--gain)} .bande.p{background:var(--perte)}

/* --- le côté moins : une carte, jamais une ligne ------------------------ */
.perte{background:var(--rose);border-left:4px solid var(--perte);
 padding:.85rem 1rem;margin:0 0 .7rem}
.perte .n{font:700 1.15rem/1 var(--titre);color:var(--perte);display:block;
 margin-bottom:.25rem;letter-spacing:-.01em}
.perte .l{font-size:1rem}
.perte .j{display:block;margin-top:.35rem;color:#6a4a44;font-size:.89rem}
.perte .r{display:block;margin-top:.6rem;padding-top:.55rem;
 border-top:1px solid #eccfc9;color:var(--gain);font-size:.93rem}
.perte .r b{font-weight:600}
.perte .r em{font-style:normal;font-family:var(--chif);font-weight:700;
 font-variant-numeric:tabular-nums}
.perte .r.meme{color:var(--gris);font-style:italic}
.transitoire{border-bottom:1px dotted var(--gris);color:var(--gris)}
.trou{display:inline-block;margin-left:.4rem;font:400 9px/1.6 var(--chif);
 font-style:normal;letter-spacing:.05em;text-transform:uppercase;color:#a8632a;
 border:1px solid #e0c7a8;background:#fbf3e7;padding:0 .3rem;vertical-align:.1em}

/* --- le côté plus : la tête en grand, puis des lignes ------------------- */
.dom{background:var(--gain);color:var(--pap);padding:1.4rem 1.3rem;margin:0}
.dom .v{font:700 3.6rem/.94 var(--chif);letter-spacing:-.03em;display:block;
 font-variant-numeric:tabular-nums;word-spacing:-.06em}
.dom .v.mot{font:700 2.5rem/1 var(--titre);letter-spacing:-.02em;
 word-spacing:normal}
.dom .p{margin:.55rem 0 0;font-size:1.06rem;max-width:26rem}
.dom .s{margin:.45rem 0 0;font-size:.98rem;opacity:.88;max-width:26rem}
.lg{display:grid;grid-template-columns:7.2rem 1fr;gap:.55rem 1rem;
 padding:.75rem 0;border-bottom:1px solid var(--fil);align-items:baseline}
.lg .v{text-align:right;font:700 1.45rem/1 var(--chif);color:var(--gain);
 letter-spacing:-.02em;font-variant-numeric:tabular-nums;word-spacing:-.06em;
 white-space:nowrap}
.lg .v.mot{font:700 1.1rem/1.2 var(--titre);letter-spacing:0;word-spacing:normal;
 white-space:normal}
.lg .v.long{font-size:1rem}
.lg .t{font-size:1rem}
.lg .m{display:block;color:var(--gris);font-size:.84rem;margin-top:.25rem}
.suite{grid-column:2;margin:.45rem 0 0;padding-left:.85rem;
 border-left:2px solid var(--fil);list-style:none}
.suite li{color:#3a3a38;font-size:.93rem;padding:.15rem 0}
.suite li::before{content:'·';color:var(--gain);font-weight:700;
 margin-right:.45rem}

/* --- qui paie, dit une fois --------------------------------------------- */


.rappel{margin:.9rem 0 0;padding:.6rem 0 0;border-top:1px solid var(--fil);
 color:var(--gris);font-size:.92rem;line-height:1.9}
.rappel span{display:block;font:700 9.5px/1 var(--chif);letter-spacing:.14em;
 text-transform:uppercase;color:var(--ocre);margin-bottom:.35rem}
.rappel b{font-weight:700;color:var(--gain);font-family:var(--chif);
 font-size:.92em;font-variant-numeric:tabular-nums;word-spacing:-.05em}
.pied{margin:1.4rem 1.8rem 0;padding-top:.8rem;border-top:1px solid var(--fil);
 color:var(--gris);font-size:.78rem}
.interne{font:400 10px/1.5 var(--chif);color:#9a958c;margin-top:.5rem}
@media(max-width:600px){
 body{padding:.8rem .5rem}
 .corps,.tete{padding-left:1.1rem;padding-right:1.1rem}
 .bande{padding-left:1.1rem;padding-right:1.1rem;margin-left:-1.1rem;
  margin-right:-1.1rem}
 .marque{padding:.9rem 1.1rem .6rem}.filet{margin:0 1.1rem}
 .qui{font-size:1.65rem}.dom .v{font-size:2.8rem}
 .lg{grid-template-columns:5.6rem 1fr}.lg .v{font-size:1.2rem}
}

/* --- la page de garde -----------------------------------------------------
   Projection de `ResolutionD1a`. Elle a sa propre langue typographique — un
   sans condensé très gras sur fond brique — et elle ne partage avec la fiche
   que sa famille de titre, la fiche restant sur papier crème. Les deux se suivent sans se
   mélanger : la garde annonce, la fiche démontre. */
@import url('https://fonts.googleapis.com/css2?family=Archivo:wdth,wght@62..125,400..900&display=swap');

.a-fond{
 --briq:#b23a10; --briqc:#b84923; --dor:#ffd24a; --crm:#fffdf2;
 margin:0;padding:1.5rem clamp(1.2rem,4vw,3.2rem) .9rem;
 /* La photo des auteurs sous un voile brique uniforme (calque ::after),
    couvrant toute la largeur, fondue dans le brique en haut si elle descend. Échelle et position sont calculées dans la page
    (script de la garde) pour que les visages évitent les textes ; à défaut,
    cadrage centré. */
 --voile:rgba(178,58,16,.74);
 background:var(--briq);position:relative;isolation:isolate;overflow:hidden;
 min-height:100vh;min-height:100svh;display:flex;flex-direction:column;
 font-family:Archivo,'Archivo Narrow','Arial Narrow','Helvetica Neue',
   Arial,sans-serif;color:var(--crm)}
.a-cond{font-weight:900;font-stretch:66%;
 font-variation-settings:'wdth' 66,'wght' 900;
 text-transform:uppercase;line-height:.88;letter-spacing:-.008em}

.a-haut{display:flex;flex-wrap:wrap;gap:.9rem 2rem;
 justify-content:space-between;align-items:flex-start}
.a-sig{margin:0;font-size:clamp(1.05rem,2.4vw,1.5rem);line-height:1.32;
 color:var(--dor)}
.a-sig b{color:var(--crm);font-weight:700}
.a-marque{display:block;margin-top:.6rem;font-size:.9rem;font-weight:700;
 letter-spacing:.42em;text-transform:uppercase;color:var(--dor)}

.a-appels{display:flex;flex-wrap:wrap;gap:.55rem;align-items:center}
/* Le bloc du livre, en haut à droite : le nom de la page, la précommande, la
   date. Une seule ligne ; sous la marque sur mobile. */
.a-livre{display:flex;flex-wrap:wrap;align-items:center;gap:.55rem 1rem}
.a-livre-nom,.a-livre .a-appel{padding:.85rem 1.25rem;border:1px solid var(--dor);font-size:1.1rem}
.a-livre-nom,.a-livre .a-bientot{font:700 1.1rem/1 Archivo,'Arial Narrow',Arial,sans-serif;
 letter-spacing:0;text-transform:none;margin:0}
.a-livre-nom{color:var(--dor);text-decoration:none;background:rgba(255,210,74,.1)}
.a-livre-nom:hover{background:rgba(255,210,74,.2)}
.a-livre .a-bientot{font-weight:400;color:var(--crm);opacity:.72}
.a-livre-nom:focus-visible{outline:2px solid var(--crm);outline-offset:3px}
@media(max-width:600px){
 .s-livre,.s-classeur{padding-left:1.1rem;padding-right:1.1rem}
 .s-classeur{grid-template-columns:2.2rem 1fr;column-gap:.9rem}.s-xls{width:2.2rem}
 .s-classeur .s-dl{padding:.75rem .9rem;font-size:.72rem}
 .s-compte{padding:0 1.1rem}
 .s-trame{padding-top:9rem;background-size:auto,auto 100%}}
.a-appel{position:relative;font:700 .95rem/1 Archivo,'Arial Narrow',Arial,sans-serif;
 padding:.85rem 1.25rem;border:1px solid var(--dor);background:none;
 color:var(--dor);cursor:not-allowed}
.a-appel.a-plein{background:var(--crm);border-color:var(--crm);
 color:var(--briq)}
.a-promesse .a-parici{font-size:1.4rem;font-weight:800}
.a-appel.a-lien{cursor:pointer;text-decoration:none;display:inline-block}
.a-appel.a-lien:hover{background:rgba(255,210,74,.16)}
.a-appel.a-lien.a-plein:hover{background:var(--dor);border-color:var(--dor)}
.a-appel.a-lien:focus-visible{outline:2px solid var(--crm);outline-offset:3px}
/* La précommande en or plein : c'est le seul appel qui vend le livre, et il se
   distingue des deux autres. Arbitrage de l'auteur. */
.a-appel.a-vif{background:var(--dor);border-color:var(--dor);
 color:var(--briq)}
.a-appel.a-vif:hover{background:var(--crm);border-color:var(--crm)}
.a-bientot{display:block;margin-top:.3rem;font:400 .6rem/1 Archivo,'Arial Narrow',Arial,sans-serif;
 letter-spacing:.14em;text-transform:uppercase;opacity:.72}

.a-corps{flex:1;display:flex;flex-direction:column;justify-content:flex-end;
 padding:1.2rem 0 .8rem}
.a-titre.a-cond{font-weight:700;font-variation-settings:'wdth' 66,'wght' 700}
.a-titre{font-size:clamp(2.4rem,min(9.6vw,13vh),7rem);margin:0;color:var(--crm);
 text-wrap:balance}
.a-titre span{display:block;color:var(--dor)}
.a-promesse{display:flex;flex-wrap:wrap;align-items:baseline;
 gap:.5rem 1.8rem;margin:1.3rem 0 0}
.a-promesse p{margin:0;font-size:clamp(1.3rem,min(4.4vw,5vh),2.5rem);font-weight:800;
 font-variation-settings:'wdth' 84,'wght' 800;line-height:1.04;
 color:var(--crm)}
.a-promesse b{color:var(--dor);font-weight:800}
.a-parici{font:700 1.05rem/1 Archivo,'Arial Narrow',Arial,sans-serif;color:var(--dor);
 text-decoration:none;border-bottom:2px solid var(--dor);padding-bottom:.28rem}
.a-parici:hover{color:var(--crm);border-color:var(--crm)}
.a-parici:focus-visible,.a-rub a:focus-visible{outline:2px solid var(--crm);
 outline-offset:4px}

.a-filet{border:0;border-top:1px solid rgba(255,210,74,.42);margin:0}
.a-bas{display:flex;flex-wrap:wrap;gap:.7rem 2.4rem;align-items:baseline;
 justify-content:space-between;padding-top:1.1rem}
.a-rub{display:flex;flex-wrap:wrap;gap:.7rem 2.2rem;list-style:none;
 margin:0;padding:0}
.a-rub a,.a-rub span{font-size:1.05rem;font-weight:800;letter-spacing:.24em;
 text-transform:uppercase;text-decoration:none;color:var(--crm);
 border-bottom:2px solid transparent;padding-bottom:.2rem}
.a-rub a:hover{color:var(--dor)}
/* Les onglets de la garde portent l'accent de la navigation : le corps de
   l'ancienne date. Aucun souligné : seul « par ici » en porte un. */
.a-bas .a-rub a{font-size:1.3rem;letter-spacing:.2em}
.a-rub span{color:rgba(255,253,242,.44)}
.a-rub span::after{content:' · à venir';letter-spacing:.1em;
 text-transform:none;font-weight:400}
.a-date{margin:0;font-size:1.2rem;color:var(--dor)}
.a-date b{color:var(--crm);font-weight:700}

/* --- couche du site -------------------------------------------------------
   Sélecteurs de classe uniquement : la feuille de la galerie garde la main sur
   les éléments nus, et les deux couches ne se disputent rien. */
.s-page{max-width:40rem;margin:0 auto;box-shadow:0 2px 0 rgba(0,0,0,.35)}
.s-tete{background:var(--pap);padding:0 0 1.6rem}
.s-h1{font:700 2.4rem/1.06 var(--titre);margin:1.2rem 0 0;padding:0 1.8rem;
 color:var(--enc)}
.s-chapeau{margin:.8rem 0 0;padding:0 1.8rem;font-size:1rem;line-height:1.45;
 color:var(--gris)}

.s-groupe{background:var(--pap);padding:0 0 .9rem;
 border-top:1px solid var(--fil)}
.s-gt{font:700 12px/1 var(--chif);letter-spacing:.22em;text-transform:uppercase;
 color:var(--ocre);margin:0;padding:1.2rem 1.8rem .5rem}
.s-gc{margin:0;padding:0 1.8rem .9rem;font-size:.9rem;color:var(--gris);
 border-bottom:1px solid var(--fil)}
.s-liste{list-style:none;margin:0;padding:0}
.s-liste li{border-bottom:1px solid var(--fil)}
.s-liste li:last-child{border-bottom:0}
.s-liste a{display:block;padding:.95rem 1.8rem;text-decoration:none;
 color:var(--enc)}
.s-liste a:hover{background:var(--sable)}
.s-liste a:focus-visible{outline:2px solid var(--gain);outline-offset:-2px}
.s-qui{display:block;font-weight:700;font-size:1.12rem;line-height:1.2}
.s-axe{display:block;margin-top:.2rem;font-size:.9rem;color:var(--gris);
 line-height:1.35}

.s-retour{--dor:#ffd24a; --crm:#fffdf2;max-width:40rem;margin:0 auto .5rem;display:flex;
 flex-wrap:wrap;gap:.5rem 1.2rem;justify-content:space-between;
 align-items:baseline}
.s-retour>a{font:700 11px/1.4 var(--chif);letter-spacing:.16em;
 text-transform:uppercase;text-decoration:none;color:var(--sable);
 border-bottom:1px solid rgba(246,242,234,.32);padding-bottom:.15rem}
.s-retour>a:hover{color:var(--pap);border-bottom-color:var(--pap)}
.s-retour>a:focus-visible{outline:2px solid var(--sable);outline-offset:3px}
.s-retour .s-marque{letter-spacing:.32em;border-bottom-color:transparent}
/* Les rubriques de l'accueil, reprises telles quelles dans le bandeau ; la
   rubrique courante garde le filet or de leur survol. */
.s-retour .a-rub{font-family:var(--chif);gap:.5rem 1.2rem}
/* Cinq onglets sur la colonne de 40rem : ils prennent le corps et l'espacement
   de la marque, pour tenir sur la même ligne qu'elle. */
.s-retour .a-rub a{font-size:11px;letter-spacing:.16em}
.a-rub a[aria-current]{color:var(--dor)}

.s-nav{max-width:40rem;margin:0 auto;background:var(--pap);display:flex;gap:1px;
 border-bottom:1px solid var(--fil)}
.s-nav a,.s-nav span{flex:1;padding:.8rem 1rem;font:700 11px/1.3 var(--chif);
 letter-spacing:.1em;text-transform:uppercase;text-decoration:none;
 color:var(--enc)}
.s-nav span{color:var(--fil)}
.s-nav a:hover{background:var(--sable)}
.s-nav .s-suiv{text-align:right}
.s-nav .s-idx{flex:0 0 auto;text-align:center;color:var(--ocre)}

.s-voisins{max-width:40rem;margin:0 auto;background:var(--pap);
 padding:0 0 .9rem;box-shadow:0 2px 0 rgba(0,0,0,.35)}
.s-pied{--dor:#ffd24a; --crm:#fffdf2;max-width:40rem;margin:1.8rem auto .9rem;
 display:flex;flex-wrap:wrap;gap:.7rem 2.2rem;align-items:baseline;
 font-family:var(--chif)}
.a-fond .s-pied{max-width:none;margin:1.8rem 0 0}
/* Service : Je m'exprime et J'adhère à l'identique ; les mentions légales en
   retrait. */
/* Même corps que le bloc du livre : une seule taille pour les liens de service. */
.s-pied .a-parici{border-bottom:0;padding-bottom:0;font-size:1.1rem}
.s-pied .s-ml{font:400 .78rem/1 var(--chif);color:var(--crm);opacity:.72;
 text-decoration:none}
.s-pied .s-ml:hover{color:var(--crm);opacity:1}
.s-pied a:focus-visible{outline:2px solid var(--crm);outline-offset:4px}
.s-classeur{padding:1.3rem 1.8rem 1.4rem;border-bottom:1px solid var(--fil);
 display:grid;grid-template-columns:2.75rem 1fr;gap:0 1.2rem;align-items:start}
/* Une icône de classeur par fichier : on voit d'emblée qu'on télécharge un Excel. */
.s-xls{width:2.75rem;height:auto;display:block;margin-top:.15rem}
.s-compte{margin:.9rem 0 0;padding:0 1.8rem;font:700 10.5px/1 var(--chif);
 letter-spacing:.16em;text-transform:uppercase;color:#1d6f42}
.s-classeur .s-dl{border-color:#1d6f42;color:#1d6f42;margin-top:.7rem}
.s-classeur .s-dl:hover{background:#1d6f42;color:#fff}
.s-classeur .s-dl span{margin-right:.35rem}
.s-classeur:last-child{border-bottom:0}
.s-classeur h2{font:700 1.12rem/1.2 var(--titre);margin:0;color:var(--enc)}
.s-classeur .s-meta{margin:.35rem 0 .7rem;font:400 10px/1.3 var(--chif);
 letter-spacing:.12em;text-transform:uppercase;color:var(--gris)}
.s-classeur p{margin:0 0 .45rem;font-size:.95rem;line-height:1.45}
.s-classeur p b{font:700 10px/1 var(--chif);letter-spacing:.14em;
 text-transform:uppercase;color:var(--ocre);margin-right:.4rem}
.s-sous{font-size:1.12rem;color:var(--enc)}
/* Le livre, les auteurs, les mentions : la carte du sommaire, du texte suivi. */
.s-livre{--briq:#b23a10; --dor:#ffd24a; --crm:#fffdf2;padding:1.2rem 1.8rem 1.6rem}
.s-livre .qui{margin:1.4rem 0 .8rem}
.s-livre p{margin:0 0 .35rem}
.s-livre .a-appel{margin:.9rem 0 1.4rem}
.s-livre .s-bloc{margin:1.1rem 0 0}
.s-image{display:block;width:100%;height:auto}
.s-trame{background:linear-gradient(rgba(253,252,250,.74),rgba(253,252,250,.74)),
 url(img/auteurs-2.jpg) center 20%/cover;padding-top:14rem}
.s-livre .s-bloc a{color:var(--gain);text-decoration-thickness:1px;
 text-underline-offset:2px}
.s-livre .s-bloc a:hover{color:var(--enc)}
.s-livre .s-image[src$="couverture.png"],.s-livre .s-image[src$="quatrieme.png"]{
 max-width:22rem}

/* --- manifeste et adhésion ------------------------------------------------
   Même papier crème que la fiche, colonne de lecture plus étroite : c'est du
   texte suivi, pas une carte. */
.m-page{max-width:44rem;margin:0 auto 1.4rem;background:var(--pap);
 box-shadow:0 2px 0 rgba(0,0,0,.35)}

/* Le manifeste porte la charte du livre, non celle de la fiche : fond brique
   strié, Archivo, or et crème. C'est le produit phare, il parle la langue de
   la couverture. Arbitrage de l'auteur du 20260828. */
.g-page{--briq:#b23a10; --briqc:#b84923; --dor:#ffd24a; --crm:#fffdf2;
 max-width:46rem;margin:0 auto 1.4rem;background:var(--briq);
 background-image:repeating-linear-gradient(90deg,
   var(--briqc) 0 2px, transparent 2px 22px);
 color:var(--crm);
 font-family:Archivo,'Archivo Narrow','Arial Narrow',Arial,sans-serif}
.g-page .g-corps{padding:1.6rem clamp(1.3rem,4.4vw,3rem) 1.8rem}
.g-marque{display:flex;align-items:baseline;justify-content:space-between;
 gap:1rem;font:700 11px/1 Archivo,'Arial Narrow',sans-serif;
 letter-spacing:.34em;text-transform:uppercase;color:var(--crm)}
.g-marque em{font-style:normal;letter-spacing:.1em;text-transform:none;
 font-weight:400}
.g-filet{display:flex;height:4px;margin:.9rem 0 1.6rem}
.g-filet i{flex:1;background:var(--dor)}
.g-filet i:nth-child(2){flex:.45;background:rgba(255,253,242,.5)}
.g-filet i:nth-child(3){flex:.2;background:rgba(255,253,242,.22)}
.g-page.m-page .m-titre{font-size:clamp(1.9rem,6.4vw,3.3rem);font-weight:900;
 font-stretch:66%;font-variation-settings:'wdth' 66,'wght' 900;
 text-transform:uppercase;line-height:.92;letter-spacing:-.008em;
 color:var(--crm);margin:0 0 1.4rem}
.g-page.m-page .m-titre.g-titre{font-size:clamp(1.6rem,4.2vw,2.3rem);
 margin:0 0 .9rem;letter-spacing:.03em;word-spacing:.18em;line-height:1.05}
/* Le livre, sous le titre du manifeste : la langue de la couverture, un cran
   en dessous du titre ; la date à côté, en texte. */
.g-livre{margin:0;font-size:clamp(1.2rem,3.2vw,1.7rem);color:var(--dor)}
.g-livre em{font-style:normal;font-size:.95rem;font-weight:400;text-transform:none;
 font-stretch:100%;font-variation-settings:normal;letter-spacing:0;
 color:var(--crm);white-space:nowrap}
.g-tagline{margin:-1rem 0 1.4rem;font-size:clamp(1.2rem,3.2vw,1.7rem);
 font-weight:800;font-variation-settings:'wdth' 84,'wght' 800;
 line-height:1.2;color:var(--dor)}
.g-adresse{margin:1.8rem 0 0;font:700 .95rem/1 Archivo,'Arial Narrow',sans-serif;
 color:var(--crm)}
/* L'or sur le brique ne dépasse pas 3:1 de contraste : il tient pour un filet
   ou une vedette, pas pour du texte. Les intertitres passent donc en crème, et
   l'or reste à la ligne qui les souligne. */
.g-page.m-page h2{font:600 10.5px/1 Archivo,'Arial Narrow',sans-serif;
 letter-spacing:.28em;text-transform:uppercase;color:var(--crm);
 margin:1.7rem 0 .8rem;padding-bottom:.5rem;
 border-bottom:1px solid rgba(255,210,74,.55)}
.g-page.m-page #P1-constat h2{margin-top:0}
.g-page.m-page .bloc{margin:0 0 .9rem;text-align:justify}
/* Un peu plus petit, un peu plus aéré, un peu moins gras : le texte suivi se
   lit, il ne s'affiche pas. Le gras reste sur l'affirmation seule. */
.g-page.m-page .affirmation{display:inline;margin:0;font-weight:700;
 font-variation-settings:'wdth' 94,'wght' 700;font-size:1rem;line-height:1.4;
 color:var(--crm)}
/* Aucune transparence sur le fond strié : elle laissait un gris illisible.
   L'appui se distingue de l'affirmation par le poids, pas par l'opacité. */
.g-page.m-page .appui{display:inline;margin:0;font-size:.97rem;
 line-height:1.42;color:var(--crm);font-weight:400}
.g-page.m-page ul.mesures{list-style:none;margin:0 0 .9rem;padding:0;
 display:grid;gap:.75rem}
.g-page.m-page li.mesure{padding-left:1.15rem;
 border-left:2px solid var(--dor);text-align:justify}
.g-outils{display:flex;flex-wrap:wrap;gap:.6rem;margin:2.6rem 0 0;
 padding-top:1.5rem;border-top:1px solid rgba(255,210,74,.38)}
.g-bouton{font:700 .9rem/1 Archivo,'Arial Narrow',Arial,sans-serif;
 cursor:pointer;text-decoration:none;padding:.85rem 1.25rem;
 border:1px solid var(--dor);background:none;color:var(--dor);
 display:inline-block}
.g-bouton.g-plein{background:var(--crm);border-color:var(--crm);
 color:var(--briq)}
.g-bouton:hover{background:rgba(255,210,74,.16)}
.g-bouton.g-plein:hover{background:var(--dor);border-color:var(--dor)}
.g-bouton:focus-visible{outline:2px solid var(--crm);outline-offset:3px}
/* Ces règles sont celles de la fiche — Archivo en titre, Source Serif en
   texte courant, sur papier crème. Le
   manifeste partage les mêmes classes de contenu et porte une autre
   charte : il est exclu ici, une fois, au lieu de surenchérir en
   spécificité à chaque règle (A-215, A-220). */
.m-page:not(.g-page) .m-corps{padding:1.6rem clamp(1.2rem,4vw,2.6rem) 2.2rem}
.m-titre{font-size:clamp(1.9rem,5.4vw,3rem);line-height:1.04;font-weight:700;
 margin:.2rem 0 1.4rem;color:var(--enc);text-wrap:balance}
.m-page:not(.g-page) .m-corps h2{font:700 11px/1 var(--chif);letter-spacing:.22em;
 text-transform:uppercase;color:var(--ocre);margin:2.2rem 0 .7rem;
 padding-bottom:.5rem;border-bottom:1px solid var(--fil)}
.m-page:not(.g-page) .m-corps .bloc{margin:0 0 1.1rem}
.m-page:not(.g-page) .m-corps .affirmation{margin:0;font-weight:700;font-size:1.06rem;
 line-height:1.4;color:var(--enc)}
.m-page:not(.g-page) .m-corps .appui{margin:.2rem 0 0;font-size:1rem;line-height:1.5;
 color:var(--gris)}
.m-page:not(.g-page) .m-corps .bloc .appui{display:inline}
.m-page:not(.g-page) .m-corps .bloc .affirmation{display:inline}
.m-page:not(.g-page) .m-corps ul.mesures{list-style:none;margin:0;padding:0;display:grid;
 gap:.85rem}
.m-page:not(.g-page) .m-corps li.mesure{padding-left:1rem;border-left:3px solid var(--gain)}
.m-page:not(.g-page) .m-corps li.mesure .affirmation{font-weight:700}
.m-page:not(.g-page) .m-corps li.mesure .appui{color:var(--gris)}
.m-outils{display:flex;flex-wrap:wrap;gap:.6rem;margin:2.4rem 0 0;
 padding-top:1.4rem;border-top:1px solid var(--fil)}
.m-bouton{font:700 .78rem/1 var(--chif);letter-spacing:.08em;
 text-transform:uppercase;cursor:pointer;text-decoration:none;
 padding:.85rem 1.3rem;border:1px solid var(--enc);background:none;
 color:var(--enc);display:inline-block}
.m-bouton.m-plein{background:var(--enc);border-color:var(--enc);
 color:var(--pap)}
.m-bouton:hover{background:var(--enc);color:var(--pap)}
.m-bouton.m-plein:hover{background:none;color:var(--enc)}
.m-bouton:focus-visible{outline:2px solid var(--enc);outline-offset:3px}

.m-rgpd{margin:2rem 0 0;padding:1.4rem 0 0;border-top:1px solid var(--fil)}
.m-rgpd h3{font:700 11px/1 var(--chif);letter-spacing:.18em;
 text-transform:uppercase;color:var(--ocre);margin:0 0 .6rem}
.m-rgpd p{margin:0 0 .5rem;font-size:.88rem;line-height:1.5;color:var(--gris)}
.m-rgpd p:last-child{margin-bottom:0}
.m-rgpd a{color:var(--gain);text-decoration-thickness:1px;
 text-underline-offset:2px}
.m-rgpd a:hover{color:var(--enc)}
.m-partage{display:flex;flex-wrap:wrap;gap:.5rem;margin:1rem 0 0}
.m-chapeau{margin:.5rem 0 0;font-size:1rem;line-height:1.5;color:var(--gris);
 max-width:38rem}
.m-note{margin:.9rem 0 0;font-size:.92rem;line-height:1.5;color:var(--gris)}
.m-note a{color:var(--gain)}
.m-adresse{margin:1.4rem 0 0;padding:0 0 1.3rem;
 border-bottom:1px solid var(--fil)}
.m-adr-lab{margin:0;font:700 10px/1 var(--chif);letter-spacing:.2em;
 text-transform:uppercase;color:var(--ocre)}
.m-adr{margin:.4rem 0 0;font:700 clamp(1.05rem,3.4vw,1.5rem)/1.2 var(--chif);
 color:var(--enc);word-break:break-all;user-select:all}
.f-outils{margin:1.6rem 0 0;padding:1.3rem 1.8rem 0;border-top:1px solid var(--fil)}
.f-outils .m-bouton{font-size:.86rem}
.m-part{font:700 .8rem/1 var(--chif);letter-spacing:.06em;text-decoration:none;
 padding:.65rem .95rem;border:1px solid var(--fil);color:var(--enc)}
.m-part:hover{background:var(--sable);border-color:var(--enc)}
.m-part-off{color:var(--gris);border-color:var(--fil);opacity:.55;
 cursor:default;user-select:none}
.m-etape{font:700 11px/1 var(--chif);letter-spacing:.18em;
 text-transform:uppercase;color:var(--ocre);margin:1.8rem 0 .5rem}

@media print{
 @page{margin:0}
 body{background:#fff;padding:0;-webkit-print-color-adjust:exact;
  print-color-adjust:exact}
 /* Le corps reste brique même sous le contenu, sur les pages qui portent le
    manifeste : sinon la dernière page finit sur une bande blanche là où le
    texte s'arrête avant le bas de la feuille. Sans effet sur les autres
    pages (fiches, contact...), qui n'ont pas de .g-page. */
 body:has(.g-page){background:#b23a10}
 .page,.m-page,.g-page{box-shadow:none;max-width:none;margin:0}
 .s-nav,.s-retour,.m-outils,.g-outils,.f-outils,.s-pied{display:none}
 /* Le téléchargement doit rendre la charte du site, pas une version à
    l'encre économisée : le fond brique et l'or sont conservés à
    l'impression comme à l'écran. */
 .g-page{-webkit-print-color-adjust:exact;print-color-adjust:exact;
  padding:1.6rem clamp(1.3rem,4.4vw,3rem) 1.8rem}
 /* Une coupure en plein milieu d'une phrase est illisible : chaque bloc et
    chaque mesure reste entier sur une page, quitte à pousser la suivante. */
 .g-page.m-page .bloc,.g-page.m-page li.mesure{break-inside:avoid;
  page-break-inside:avoid}
 .g-page.m-page h2{break-after:avoid;page-break-after:avoid}
 .g-page.m-page .m-titre,.g-tagline{break-after:avoid;page-break-after:avoid}
}

.m-video{position:relative;padding-bottom:56.25%;height:0;overflow:hidden;
 margin:1.4rem 0 0;background:#000}
.m-video iframe{position:absolute;top:0;left:0;width:100%;height:100%;
 border:0}
.m-video-item{margin:1.6rem 0 0;padding:1.6rem 0 0;border-top:1px solid var(--fil)}
.m-video-item:first-child{margin-top:1.4rem;padding-top:1.4rem}
.m-video-titre{margin:.4rem 0 0;font:700 1.1rem/1.35 var(--chif);color:var(--enc)}
.m-video-titre a{color:inherit;text-decoration:none;border-bottom:2px solid var(--fil)}
.m-video-titre a:hover{border-color:var(--enc)}
.s-video{padding:1.2rem 1.8rem 1.4rem}
.s-video .m-etape{margin-top:0}
.s-video .m-video{margin-top:0}
.m-video-vignette{display:block;margin:.8rem 0 0;background:#000}
.m-video-vignette img{width:100%;display:block}
.m-video-vignette:hover img{opacity:.9}

/* Sur mobile, un visage à la fois : le script calcule la position de chacun,
   la photo passe de l'un à l'autre. Immobile si moins de mouvement demandé. */
.a-fond.a-defile::after{animation:a-defile 21s ease-in-out infinite alternate}
@keyframes a-defile{
 0%,28%{background-position:0 0,0 0,var(--x1) var(--y1);--b1:var(--f1);--b2:var(--g1)}
 38%,62%{background-position:0 0,0 0,var(--x2) var(--y2);--b1:var(--f2);--b2:var(--g2)}
 72%,100%{background-position:0 0,0 0,var(--x3) var(--y3);--b1:var(--f3);--b2:var(--g3)}}
/* Le fondu du haut suit chaque arrêt : ses bornes s'animent comme des longueurs. */
@property --b1{syntax:'<length>';inherits:true;initial-value:0px}
@property --b2{syntax:'<length>';inherits:true;initial-value:0px}
@media(max-width:380px){
 .a-livre{column-gap:.6rem}
 .a-livre-nom,.a-livre .a-appel{padding:.75rem .7rem}}
@media(prefers-reduced-motion:reduce){.a-fond::after{animation:none}}
@media(max-width:600px){
 .a-fond{padding:1.1rem 1.1rem .8rem}
 .a-bas{padding-top:.8rem}
 .a-bas .a-rub{gap:.55rem 1.4rem}
 .a-bas .a-rub a{font-size:.95rem;letter-spacing:.16em}
 .a-fond .s-pied{margin-top:1rem}
 .a-livre-nom,.a-livre .a-appel{padding:.8rem .95rem}
 .a-corps{padding:.8rem 0 .6rem}
 .a-promesse{margin-top:.9rem}}

/* Titres des cartes et des fiches : la lettre condensée de la garde et du
   manifeste, au lieu de l'Archivo large. */
.s-h1,.qui{font-weight:700;font-stretch:66%;
 font-variation-settings:'wdth' 66,'wght' 700;text-transform:uppercase;
 letter-spacing:-.005em}

/* Auteurs : la photo glisse lentement d'un bord à l'autre, en aller-retour ;
   sur mobile, d'un auteur à l'autre. Immobile si moins de mouvement est demandé. */
.s-trame{background-size:auto,125% auto;
 animation:s-defile 24s ease-in-out infinite alternate}
@keyframes s-defile{
 0%,20%{background-position:0 0,0% 20%}
 80%,100%{background-position:0 0,100% 20%}}
@media(max-width:600px){.s-trame{background-size:auto,auto 100%;
 animation-name:a-defile-auteurs;animation-duration:21s}}
@keyframes a-defile-auteurs{
 0%,28%{background-position:0 0,0% 0}
 38%,62%{background-position:0 0,50% 0}
 72%,100%{background-position:0 0,100% 0}}
@media(prefers-reduced-motion:reduce){.s-trame{animation:none}}

.a-fond::after{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;
 background:linear-gradient(180deg,var(--briq) 0,var(--briq) var(--b1,0px),
   transparent var(--b2,0px)),linear-gradient(var(--voile),var(--voile)),url(img/auteurs.jpg);
 background-repeat:no-repeat;background-size:auto,auto,var(--ps,cover);
 background-position:0 0,0 0,var(--px,50%) var(--py,30%)}
