/* Essai de polices (10/10/2026, plan d'octobre §1). Chargée seulement avec
   ?police=… : sans le paramètre, la page reste celle d'avant (règle 12).
   Une paire titre + corps par classe pe-* posée sur <html>. Licences OFL à
   côté des fichiers, dans fonts/essai/ et fonts/. */

@font-face { font-family: "Newsreader"; font-style: normal; font-weight: 200 800; font-display: swap;
  src: url(/assets/v2/fonts/essai/newsreader-latin-opsz-normal.woff2) format("woff2"); }
@font-face { font-family: "Newsreader"; font-style: italic; font-weight: 200 800; font-display: swap;
  src: url(/assets/v2/fonts/essai/newsreader-latin-opsz-italic.woff2) format("woff2"); }
@font-face { font-family: "Bodoni Moda"; font-style: normal; font-weight: 400 900; font-display: swap;
  src: url(/assets/v2/fonts/essai/bodoni-moda-latin-opsz-normal.woff2) format("woff2"); }
@font-face { font-family: "Bodoni Moda"; font-style: italic; font-weight: 400 900; font-display: swap;
  src: url(/assets/v2/fonts/essai/bodoni-moda-latin-opsz-italic.woff2) format("woff2"); }
@font-face { font-family: "Inter Tight"; font-style: normal; font-weight: 100 900; font-display: swap;
  src: url(/assets/v2/fonts/essai/inter-tight-latin-wght-normal.woff2) format("woff2"); }
@font-face { font-family: "Inter Tight"; font-style: italic; font-weight: 100 900; font-display: swap;
  src: url(/assets/v2/fonts/essai/inter-tight-latin-wght-italic.woff2) format("woff2"); }
@font-face { font-family: "Inter Essai"; font-style: normal; font-weight: 100 900; font-display: swap;
  src: url(/assets/v2/fonts/inter-var.woff2) format("woff2"); }
@font-face { font-family: "Geist"; font-style: normal; font-weight: 100 900; font-display: swap;
  src: url(/assets/v2/fonts/geist-var.woff2) format("woff2"); }

html[class*="pe-"] { --pe-inter: "Inter Essai", -apple-system, "Helvetica Neue", Arial, sans-serif; }

/* A. Newsreader + Inter : serif éditorial à tailles optiques, tient au téléphone. */
html.pe-newsreader {
  --f-titre: "Newsreader", Georgia, serif; --titre-w: 400;
  --font-body: var(--pe-inter); --font-display: var(--pe-inter);
  --d1-ls: -.02em; --d2-ls: -.015em;
}
/* B. Bodoni Moda + Inter : registre magazine de mode. */
html.pe-bodoni {
  --f-titre: "Bodoni Moda", Didot, serif; --titre-w: 500;
  --font-body: var(--pe-inter); --font-display: var(--pe-inter);
  --d1-ls: -.02em; --d2-ls: -.015em;
}
/* C. Inter Tight + Inter : la voie Apple, une grotesque nette partout. */
html.pe-intertight {
  --f-titre: "Inter Tight", -apple-system, sans-serif; --titre-w: 600;
  --font-body: var(--pe-inter); --font-display: var(--pe-inter);
  --d1-lh: .98; --d1-ls: -.04em; --d2-lh: 1.04; --d2-ls: -.03em;
}
/* D. Geist + Geist : la voie Resend / 21st.dev, une seule famille. */
html.pe-geist {
  --f-titre: "Geist", -apple-system, sans-serif; --titre-w: 600;
  --font-body: "Geist", -apple-system, sans-serif; --font-display: "Geist", -apple-system, sans-serif;
  --d1-lh: .98; --d1-ls: -.045em; --d2-lh: 1.04; --d2-ls: -.035em;
}
/* E. Archivo élargie + Inter : la famille du logo en titre, un corps neutre. */
html.pe-archivo {
  --f-titre: "Archivo", -apple-system, sans-serif; --titre-w: 800;
  --font-body: var(--pe-inter); --font-display: var(--pe-inter);
  --d1: clamp(36px, 5.4vw, 78px); --d2: clamp(28px, 3.6vw, 52px);
  --d1-lh: .96; --d1-ls: -.03em; --d2-lh: 1.04; --d2-ls: -.02em;
}
html.pe-archivo :is(.d1, .d2, .carte-nom, .etape-t, .manif-p) { font-stretch: 125%; }
/* Revue du 11/10 : quatre titres sortaient de la paire (le ruban des
   promesses et la marque du pied en Inter, la garantie en Inter 600 façon
   SaaS, la question du contact en Archivo étroite). Ils passent dans la
   famille des titres, élargie. Au téléphone, le ruban garde la largeur
   normale : à 125 %, « NO PAID APP » sortait de sa colonne de 100vw. */
html.pe-archivo :is(.p12-garantie-t, .contact-q, .foot-brand .mark) { font-family: var(--f-titre); font-stretch: 125%; }
html.pe-archivo .promesse b { font-family: var(--f-titre); font-stretch: 125%; letter-spacing: -.02em; }
html.pe-archivo .p12-garantie-t { font-weight: var(--titre-w); letter-spacing: -.02em; }
@media (max-width: 720px) { html.pe-archivo .promesse b { font-stretch: 100%; } }
/* Le mot en italique reste en serif : Caslon italique dans un titre en
   Archivo élargie (choix de Théo sur la page de test, 10/10). */
html.pe-archivo :is(.d1, .d2) em { font-family: "Libre Caslon Text", "Libre Caslon repli", Georgia, serif;
  font-style: italic; font-weight: 400; font-stretch: 100%; letter-spacing: -.01em; }
/* Les sans-serif n'ont pas d'italique de titre convaincant : les mots en
   italique gardent l'accent par la graisse. */
html:is(.pe-intertight, .pe-geist) :is(.d1, .d2) em { font-style: normal; font-weight: 400; }

/* Le grand titre du haut de page garde le Caslon d'avant (Théo, 11/10 :
   « une petite touche de fraîcheur ») ; le reste du site passe en E. */
html.pe-archivo .hero .d1 {
  font-family: "Libre Caslon Text", "Libre Caslon repli", Georgia, serif; font-weight: 400; font-stretch: 100%;
  font-size: clamp(42px, 6.11vw, 88px); line-height: 1.02; letter-spacing: -.01em;
}
html.pe-archivo .hero .d1 em { letter-spacing: inherit; }