@charset "UTF-8";
/* ==========================================================================
   REVUE NOCTURNE — feuille d'atelier commune aux cinq feuillets
   --------------------------------------------------------------------------
   Vocabulaire des classes : imprimerie et presse papier (manchette, chemin
   de fer, chassis, cliche, folio, filet, cahier, ours, feuillet…).
   Direction photo : noir et blanc argentique, grain Tri-X, clair-obscur.
   Bootstrap 5.3 fournit la grille et les utilitaires ; tout ce qui se voit
   est redefini ici, jetons --bs-* compris, pour que le cadre ne paraisse pas.
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. Encres, papiers et jetons Bootstrap
   -------------------------------------------------------------------------- */
:root{
  --avis_de_passage:#fcf8f6;
  --encre-missive:#150f0d;
  --encre-reponse_attendue:#63534c;
  --encrier:#e3d3ca;
  --courrier_du_coeur-de-griffe:#971e56;
  --voile-missive:#f4e8e1;
  --coin_date-de-affranchissement:#000;

  --serif-de-entete:"Fraunces",Georgia,"Times New Roman",serif;
  --sans-de-mandat:"Inter",system-ui,-apple-system,"Segoe UI",sans-serif;

  --bordure:clamp(18px,4vw,56px);
  --poste_restante:clamp(22px,3.6vw,60px);
  --telegramme:1400px;
  --enveloppe-de-pli:clamp(28px,4.4vw,62px);

  /* surcharges Bootstrap */
  --bs-body-bg:var(--avis_de_passage);
  --bs-body-color:var(--encre-missive);
  --bs-body-font-family:var(--sans-de-mandat);
  --bs-font-sans-serif:var(--sans-de-mandat);
  --bs-body-font-size:1rem;
  --bs-body-font-weight:400;
  --bs-body-line-height:1.55;
  --bs-heading-color:var(--encre-missive);
  --bs-emphasis-color:var(--encre-missive);
  --bs-secondary-color:var(--encre-reponse_attendue);
  --bs-tertiary-bg:var(--voile-missive);
  --bs-border-color:var(--encrier);
  --bs-border-color-translucent:var(--encrier);
  --bs-border-width:1px;
  --bs-link-color:var(--encre-missive);
  --bs-link-hover-color:var(--courrier_du_coeur-de-griffe);
  --bs-link-decoration:none;
  --bs-focus-ring-color:rgba(141,34,52,.32);
  --bs-focus-ring-width:2px;
  --bs-border-radius:0;
  --bs-border-radius-sm:0;
  --bs-border-radius-lg:0;
  --bs-border-radius-xl:0;
  --bs-border-radius-xxl:0;
  --bs-border-radius-pill:999px;
}

/* tirage de nuit : par preference du systeme… */
@media (prefers-color-scheme:dark){
  :root:not([data-bs-theme="light"]){
    color-scheme:dark;
    --avis_de_passage:#110d0c;
    --encre-missive:#f8f0eb;
    --encre-reponse_attendue:#ac9a91;
    --encrier:#312722;
    --courrier_du_coeur-de-griffe:#e777ab;
    --voile-missive:#1b1513;
  }
}
/* …ou impose par l'attribut Bootstrap */
:root[data-bs-theme="dark"]{
  color-scheme:dark;
  --avis_de_passage:#110d0c;
  --encre-missive:#f8f0eb;
  --encre-reponse_attendue:#ac9a91;
  --encrier:#312722;
  --courrier_du_coeur-de-griffe:#e777ab;
  --voile-missive:#1b1513;
}
:root[data-bs-theme="light"]{
  color-scheme:light;
  --avis_de_passage:#fcf8f6;
  --encre-missive:#150f0d;
  --encre-reponse_attendue:#63534c;
  --encrier:#e3d3ca;
  --courrier_du_coeur-de-griffe:#971e56;
  --voile-missive:#f4e8e1;
}

/* --------------------------------------------------------------------------
   2. Reglages de labeur
   -------------------------------------------------------------------------- */
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  background:var(--avis_de_passage);
  color:var(--encre-missive);
  font-family:var(--sans-de-mandat);
  line-height:1.55;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
a{color:inherit;text-decoration:none}
a:hover{color:var(--courrier_du_coeur-de-griffe)}
figure{margin:0}
img{display:block;width:100%;height:100%;object-fit:cover}
h1,h2,h3,h4{text-wrap:balance}

/* chassis : la forme qui tient une photographie */
.cursive{
  position:relative;
  overflow:hidden;
  background:var(--coin_date-de-affranchissement);
}
.cursive img{transition:transform .9s cubic-bezier(.2,.7,.2,1)}
.encrier-de-correspondance_suivie{
  border:0;
  border-top:1px solid var(--encrier);
  opacity:1;
  margin:var(--enveloppe-de-pli) 0;
}
.poste_restante-de-pli{
  --bs-gutter-x:var(--poste_restante);
  --bs-gutter-y:var(--poste_restante);
}
.poste_restante-de-buvard{
  --bs-gutter-x:clamp(16px,2.4vw,36px);
  --bs-gutter-y:clamp(14px,2vw,22px);
}
.ligne-de-service-missive{
  display:flex;
  flex-wrap:wrap;
  gap:16px;
  margin:0;
  font-size:10.5px;
  letter-spacing:.15em;
  text-transform:uppercase;
  color:var(--encre-reponse_attendue);
}
.cachet-de-rubrique_lettre{
  display:block;
  font-size:10px;
  letter-spacing:.2em;
  text-transform:uppercase;
  color:var(--courrier_du_coeur-de-griffe);
}
.objet{
  display:block;
  font-size:10.5px;
  letter-spacing:.22em;
  text-transform:uppercase;
  color:var(--courrier_du_coeur-de-griffe);
}
.petite_annonce-de-lecture_lettre{
  font-size:10.5px;
  letter-spacing:.15em;
  text-transform:uppercase;
  color:var(--encre-reponse_attendue);
}
.entree_matiere{
  font-size:14.5px;
  color:var(--encre-reponse_attendue);
  margin:0;
  max-width:46ch;
}
.entree_matiere-destinataire{
  font-size:13.5px;
  color:var(--encre-reponse_attendue);
  margin:0;
}

/* --------------------------------------------------------------------------
   3. Bandeau de kiosque, manchette, chemin de fer
   -------------------------------------------------------------------------- */
.bandeau-de-courrier{
  border-bottom:1px solid var(--encrier);
  padding:9px var(--bordure);
  font-size:10.5px;
  letter-spacing:.17em;
  text-transform:uppercase;
  color:var(--encre-reponse_attendue);
}
.mention-de-courrier{
  border:1px solid var(--encrier);
  border-radius:999px;
  padding:3px 10px;
  white-space:nowrap;
}

.en_tete{
  padding:clamp(26px,5vw,62px) var(--bordure) clamp(12px,2vw,20px);
}
.entete-de-en_tete{
  font-family:var(--serif-de-entete);
  font-weight:200;
  font-variation-settings:"opsz" 144;
  font-size:clamp(46px,13vw,160px);
  line-height:.82;
  letter-spacing:-.035em;
  margin:0;
}
.entete-de-en_tete em{
  font-style:italic;
  font-weight:300;
  color:var(--courrier_du_coeur-de-griffe);
}
.cachet_cire-de-en_tete{
  margin:18px auto 0;
  max-width:44ch;
  font-size:clamp(13px,1.5vw,15.5px);
  color:var(--encre-reponse_attendue);
}

.chemin-de-papier_velin{
  border-top:1px solid var(--encre-missive);
  border-bottom:1px solid var(--encre-missive);
  margin:clamp(16px,2.4vw,28px) var(--bordure) 0;
  gap:clamp(14px,3.4vw,44px);
  padding:12px 8px;
  font-size:11.5px;
  letter-spacing:.14em;
  text-transform:uppercase;
}
.pli_ferme-de-chemin-de-papier_velin{
  padding:2px 0;
  border-bottom:2px solid transparent;
  transition:border-color .18s,color .18s;
}
.pli_ferme-de-chemin-de-papier_velin:hover{color:var(--courrier_du_coeur-de-griffe)}
.pli_ferme-en-cours{border-bottom-color:var(--courrier_du_coeur-de-griffe)}

.pneumatique-papier_pelure{
  max-width:var(--telegramme);
  margin-inline:auto;
  padding-inline:var(--bordure);
}

/* --------------------------------------------------------------------------
   4. La une
   -------------------------------------------------------------------------- */
.cachet_postal-de-premiere{
  padding:var(--enveloppe-de-pli) 0;
  border-bottom:1px solid var(--encrier);
}
.portrait-de-premiere{aspect-ratio:4/3}
.cachet_postal-de-premiere:hover .portrait-de-premiere img{transform:scale(1.035)}
.pastille-de-portrait{
  position:absolute;
  left:0;
  top:0;
  z-index:2;
  background:var(--avis_de_passage);
  color:var(--courrier_du_coeur-de-griffe);
  font-size:10px;
  letter-spacing:.2em;
  text-transform:uppercase;
  padding:8px 14px;
}
.salutation-de-premiere{
  font-family:var(--serif-de-entete);
  font-size:clamp(28px,4vw,56px);
  line-height:1.02;
  font-weight:300;
  letter-spacing:-.02em;
  margin:0 0 18px;
}
.entree_matiere-de-premiere{
  font-size:clamp(14.5px,1.6vw,17px);
  color:var(--encre-reponse_attendue);
  margin:0 0 24px;
  max-width:42ch;
}

/* --------------------------------------------------------------------------
   5. Double page : deux coupures de meme rang
   -------------------------------------------------------------------------- */
.oblitere-page{
  padding:var(--enveloppe-de-pli) 0;
  border-bottom:1px solid var(--encrier);
}
.liseret{display:grid;gap:13px;align-content:start}
.portrait-de-liseret{aspect-ratio:16/10}
.liseret:hover .portrait-de-liseret img{transform:scale(1.04)}
.entete-de-liseret{
  font-family:var(--serif-de-entete);
  font-size:clamp(20px,2.4vw,30px);
  line-height:1.12;
  font-weight:400;
  letter-spacing:-.015em;
  margin:0;
}

/* --------------------------------------------------------------------------
   6. Cahier central : exergue sur heliogravure pleine page
   -------------------------------------------------------------------------- */
.pli-seing_prive{
  position:relative;
  margin-inline:calc(var(--bordure) * -1);
  min-height:clamp(320px,52vw,560px);
  display:grid;
  place-items:center;
  overflow:hidden;
  background:var(--coin_date-de-affranchissement);
}
.fond-bureau_de_tri{position:absolute;inset:0}
.fond-bureau_de_tri img{opacity:.52;filter:contrast(1.1)}
.fond-bureau_de_tri::after{
  content:"";
  position:absolute;
  inset:0;
  background:radial-gradient(70% 70% at 50% 50%,transparent,rgba(0,0,0,.75));
}
.apostille{
  position:relative;
  z-index:2;
  font-family:var(--serif-de-entete);
  font-style:italic;
  font-weight:200;
  color:#faf4f0;
  font-size:clamp(22px,3.6vw,46px);
  line-height:1.24;
  margin:0;
  max-width:22ch;
  text-align:center;
  padding:0 24px;
  text-wrap:balance;
}
.mention-de-source-missive{
  display:block;
  margin-top:22px;
  font-family:var(--sans-de-mandat);
  font-style:normal;
  font-size:10.5px;
  letter-spacing:.22em;
  text-transform:uppercase;
  color:rgba(246,241,230,.68);
}

/* --------------------------------------------------------------------------
   7. Triptyque de breves
   -------------------------------------------------------------------------- */
.porte_plume{
  padding:var(--enveloppe-de-pli) 0;
  border-bottom:1px solid var(--encrier);
}
.billet{display:grid;gap:11px;align-content:start}
.portrait-de-billet{aspect-ratio:3/4}
.billet:hover .portrait-de-billet img{transform:scale(1.05)}
.recto-de-billet{
  font-family:var(--serif-de-entete);
  font-size:12px;
  color:var(--courrier_du_coeur-de-griffe);
  letter-spacing:.1em;
}
.entete-de-billet{
  font-family:var(--serif-de-entete);
  font-size:clamp(17px,1.9vw,22px);
  line-height:1.16;
  font-weight:400;
  margin:0;
}

/* --------------------------------------------------------------------------
   8. Tableau des parutions
   -------------------------------------------------------------------------- */
.tableau-des-envois{
  background:var(--voile-missive);
  margin-inline:calc(var(--bordure) * -1);
  padding:clamp(30px,4.4vw,64px) var(--bordure);
}
.cadre-des-envois{
  max-width:var(--telegramme);
  margin-inline:auto;
}
.entete-de-envois{
  font-family:var(--serif-de-entete);
  font-size:clamp(24px,2.8vw,34px);
  font-weight:300;
  line-height:1.05;
  letter-spacing:-.02em;
  margin:0;
}
.liste-des-envois{list-style:none;margin:0;padding:0}
.ligne-de-envoi{
  display:grid;
  grid-template-columns:76px 1fr auto;
  gap:18px;
  align-items:baseline;
  padding:14px 0;
  border-bottom:1px solid var(--encrier);
  font-size:15.5px;
  transition:padding-left .22s;
}
.ligne-de-envoi:first-child{border-top:1px solid var(--encrier)}
.ligne-de-envoi:hover{padding-left:8px}
.carte_de_visite-de-envoi{
  font-size:10.5px;
  letter-spacing:.13em;
  text-transform:uppercase;
  color:var(--encre-reponse_attendue);
}
.rubrique_lettre-de-envoi{
  font-size:9.5px;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--courrier_du_coeur-de-griffe);
}

/* --------------------------------------------------------------------------
   9. Bas de page imprime
   -------------------------------------------------------------------------- */
.suscription-de-page-levee{
  border-top:1px solid var(--encre-missive);
  padding:clamp(24px,3vw,44px) var(--bordure);
  font-size:10.5px;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--encre-reponse_attendue);
}
.signataire{margin:0;max-width:52ch;letter-spacing:.14em}
.liens-de-suscription-de-page{display:flex;flex-wrap:wrap;gap:22px;margin:0}

/* --------------------------------------------------------------------------
   10. Tete et sommaire de rubrique
   -------------------------------------------------------------------------- */
.ouverture_pli-de-pli{
  padding:var(--enveloppe-de-pli) 0 clamp(20px,2.6vw,34px);
  border-bottom:1px solid var(--encre-missive);
}
.entete-de-pli{
  font-family:var(--serif-de-entete);
  font-weight:300;
  font-size:clamp(38px,8vw,88px);
  line-height:.92;
  letter-spacing:-.03em;
  margin:14px 0 0;
}
.salutation-de-pli{
  margin:18px 0 0;
  max-width:56ch;
  font-size:clamp(14px,1.5vw,16.5px);
  color:var(--encre-reponse_attendue);
}
.recueil-de-rubrique_lettre{
  list-style:none;
  margin:0;
  padding:0;
}
.renseignement{
  padding:clamp(22px,2.8vw,38px) 0;
  border-bottom:1px solid var(--encrier);
}
.renseignement:hover .portrait-de-renseignement img{transform:scale(1.045)}
.portrait-de-renseignement{aspect-ratio:16/10}
.entete-de-renseignement{
  font-family:var(--serif-de-entete);
  font-weight:400;
  font-size:clamp(19px,2.1vw,27px);
  line-height:1.14;
  letter-spacing:-.015em;
  margin:9px 0 10px;
}
.renseignement-de-ouverture_pli .portrait-de-renseignement{aspect-ratio:4/3}
.renseignement-de-ouverture_pli .entete-de-renseignement{
  font-weight:300;
  font-size:clamp(27px,3.6vw,46px);
  line-height:1.04;
}
.renseignement-de-ouverture_pli .entree_matiere{
  font-size:clamp(14.5px,1.5vw,16.5px);
  max-width:44ch;
}

/* tourne-pages : pagination Bootstrap recouverte d'encre */
.boite_postale-pages{padding:var(--enveloppe-de-pli) 0}
/* les jetons de pagination sont redeclares par Bootstrap sur .pagination :
   il faut donc les poser la, et non sur le bloc parent. */
.boite_postale-pages .pagination{
  --bs-pagination-padding-x:14px;
  --bs-pagination-padding-y:9px;
  --bs-pagination-font-size:11px;
  --bs-pagination-color:var(--encre-missive);
  --bs-pagination-bg:transparent;
  --bs-pagination-border-width:1px;
  --bs-pagination-border-color:var(--encrier);
  --bs-pagination-border-radius:0;
  --bs-pagination-hover-color:var(--courrier_du_coeur-de-griffe);
  --bs-pagination-hover-bg:var(--voile-missive);
  --bs-pagination-hover-border-color:var(--encre-missive);
  --bs-pagination-focus-color:var(--courrier_du_coeur-de-griffe);
  --bs-pagination-focus-bg:var(--voile-missive);
  --bs-pagination-focus-box-shadow:none;
  --bs-pagination-active-color:var(--avis_de_passage);
  --bs-pagination-active-bg:var(--encre-missive);
  --bs-pagination-active-border-color:var(--encre-missive);
  --bs-pagination-disabled-color:var(--encre-reponse_attendue);
  --bs-pagination-disabled-bg:transparent;
  --bs-pagination-disabled-border-color:var(--encrier);
  flex-wrap:wrap;
  gap:8px;
  justify-content:center;
  letter-spacing:.16em;
  text-transform:uppercase;
}
.mention-de-tirage-missive{
  text-align:center;
  margin:16px 0 0;
  font-size:10.5px;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--encre-reponse_attendue);
}

/* --------------------------------------------------------------------------
   11. Feuillet d'article
   -------------------------------------------------------------------------- */
.bristol-de-rubrique_lettre{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  padding:clamp(16px,2vw,26px) 0 0;
  font-size:10px;
  letter-spacing:.2em;
  text-transform:uppercase;
  color:var(--encre-reponse_attendue);
}
.ouverture-missive{padding:clamp(14px,2vw,24px) 0 var(--enveloppe-de-pli)}
.grand-entete{
  font-family:var(--serif-de-entete);
  font-weight:300;
  font-size:clamp(32px,6vw,78px);
  line-height:.96;
  letter-spacing:-.03em;
  margin:14px 0 0;
  max-width:26ch;
}
.salutation{
  font-family:var(--serif-de-entete);
  font-weight:300;
  font-style:italic;
  font-size:clamp(17px,2vw,25px);
  line-height:1.38;
  color:var(--encre-missive);
  margin:22px 0 0;
  max-width:52ch;
}
.portrait-contre_seing{aspect-ratio:16/9;margin-top:clamp(22px,3vw,40px)}
.annotation-photo{
  margin:10px 0 0;
  padding-top:9px;
  border-top:1px solid var(--encrier);
  font-size:11.5px;
  line-height:1.5;
  letter-spacing:.03em;
  color:var(--encre-reponse_attendue);
  max-width:62ch;
}
.sous_main-de-texte{padding-bottom:var(--enveloppe-de-pli)}
.sous_main-de-texte p{
  font-size:clamp(15.5px,1.15vw,17.5px);
  line-height:1.72;
  margin:0 0 1.15em;
  max-width:68ch;
}
.port_du::first-letter{
  float:left;
  font-family:var(--serif-de-entete);
  font-weight:300;
  font-size:4.1em;
  line-height:.74;
  padding:6px 12px 0 0;
  color:var(--courrier_du_coeur-de-griffe);
}
.intertitre-missive{
  font-family:var(--serif-de-entete);
  font-weight:300;
  font-size:clamp(21px,2.4vw,32px);
  line-height:1.1;
  letter-spacing:-.02em;
  margin:clamp(30px,3.6vw,52px) 0 16px;
  max-width:34ch;
}
.apostille-en-pneumatique{
  font-family:var(--serif-de-entete);
  font-style:italic;
  font-weight:300;
  font-size:clamp(20px,2.5vw,32px);
  line-height:1.26;
  letter-spacing:-.015em;
  margin:clamp(26px,3.2vw,46px) 0;
  padding:0 0 0 clamp(16px,2vw,26px);
  border-left:2px solid var(--courrier_du_coeur-de-griffe);
  max-width:34ch;
}
.portrait-tournee_facteur{aspect-ratio:16/9;margin-top:clamp(26px,3vw,42px)}
.planche-photo-missive{margin:0}
.recommande-de-bordure{
  background:var(--voile-missive);
  border-top:2px solid var(--encre-missive);
  padding:clamp(18px,2.2vw,28px);
  margin-bottom:var(--poste_restante);
}
.entete-de-bordure{
  font-family:var(--serif-de-entete);
  font-weight:400;
  font-size:clamp(17px,1.8vw,21px);
  line-height:1.14;
  margin:10px 0 14px;
}
.liste-de-bordure{list-style:none;margin:0;padding:0}
.liste-de-bordure li{
  padding:11px 0;
  border-top:1px solid var(--encrier);
  font-size:13.5px;
  line-height:1.5;
  color:var(--encre-reponse_attendue);
}
.liste-de-bordure li:last-child{padding-bottom:0}
.reponse_affranchie-de-bordure{
  display:block;
  color:var(--encre-missive);
  font-size:10px;
  letter-spacing:.17em;
  text-transform:uppercase;
  margin-bottom:4px;
}
.vaguemestre{
  border-top:1px solid var(--encre-missive);
  border-bottom:1px solid var(--encre-missive);
  padding:clamp(16px,2vw,24px) 0;
  margin:var(--enveloppe-de-pli) 0;
  font-size:13.5px;
  line-height:1.6;
  color:var(--encre-reponse_attendue);
  max-width:60ch;
}

/* bloc de renvois : « a lire ensuite » */
.cachet_postal-de-pli_cachete{
  padding:var(--enveloppe-de-pli) 0;
  border-top:1px solid var(--encre-missive);
}
.entete-de-pli_cachete{
  font-family:var(--sans-de-mandat);
  font-size:10.5px;
  letter-spacing:.22em;
  text-transform:uppercase;
  color:var(--encre-reponse_attendue);
  margin:0 0 clamp(18px,2.4vw,32px);
}
.post{display:grid;gap:11px;align-content:start}
.portrait-de-post{aspect-ratio:16/10}
.post:hover .portrait-de-post img{transform:scale(1.045)}
.entete-de-post{
  font-family:var(--serif-de-entete);
  font-weight:400;
  font-size:clamp(17px,1.9vw,23px);
  line-height:1.14;
  margin:0;
}

/* --------------------------------------------------------------------------
   12. Page de garde (feuillet sobre)
   -------------------------------------------------------------------------- */
.page-de-sergent_major{padding:var(--enveloppe-de-pli) 0}
.entete-de-sergent_major{
  font-family:var(--serif-de-entete);
  font-weight:300;
  font-size:clamp(32px,5.4vw,66px);
  line-height:.98;
  letter-spacing:-.03em;
  margin:14px 0 0;
  max-width:24ch;
}
.portrait-de-sergent_major{aspect-ratio:21/6;margin-top:clamp(22px,3vw,38px)}
.portrait-de-sergent_major img{opacity:.88}
.sceau-de-bordure{aspect-ratio:3/4;margin-bottom:12px}
.pneumatique-de-lecture_lettre{max-width:70ch}
.pneumatique-de-lecture_lettre p{
  font-size:clamp(15.5px,1.15vw,17.5px);
  line-height:1.74;
  margin:0 0 1.15em;
}

/* --------------------------------------------------------------------------
   13. Feuillet manquant
   -------------------------------------------------------------------------- */
.buvard-kraft{padding:var(--enveloppe-de-pli) 0}
.recto-boite_aux_lettres{
  font-family:var(--serif-de-entete);
  font-weight:200;
  font-variation-settings:"opsz" 144;
  font-size:clamp(86px,20vw,230px);
  line-height:.78;
  letter-spacing:-.05em;
  color:var(--courrier_du_coeur-de-griffe);
  margin:0;
}
.entete-du-timbre_dente{
  font-family:var(--serif-de-entete);
  font-weight:300;
  font-size:clamp(26px,3.6vw,46px);
  line-height:1.04;
  letter-spacing:-.025em;
  margin:12px 0 0;
  max-width:26ch;
}
.portrait-du-timbre_dente{aspect-ratio:16/9;margin-top:clamp(22px,3vw,38px)}
.bouton-levee{
  display:inline-block;
  border:1px solid var(--encre-missive);
  padding:13px 26px;
  margin-top:26px;
  font-size:10.5px;
  letter-spacing:.2em;
  text-transform:uppercase;
  transition:background-color .2s,color .2s;
}
.bouton-levee:hover{
  background:var(--encre-missive);
  color:var(--avis_de_passage);
}
.bristol-de-premiere{
  padding:var(--enveloppe-de-pli) 0;
  border-top:1px solid var(--encrier);
}
.post-de-sceau{display:grid;gap:10px;align-content:start}
.sceau-de-premiere{aspect-ratio:16/10}
.sceau-de-premiere img{transition:transform .9s cubic-bezier(.2,.7,.2,1)}
.post-de-sceau:hover .sceau-de-premiere img{transform:scale(1.05)}
.entete-de-sceau{
  font-family:var(--serif-de-entete);
  font-weight:400;
  font-size:clamp(16px,1.8vw,21px);
  line-height:1.16;
  margin:0;
}

/* --------------------------------------------------------------------------
   14. Formats reduits
   -------------------------------------------------------------------------- */
@media (min-width:992px){
  .cire_a_cacheter-de-bordure{position:sticky;top:26px}
}
@media (max-width:767.98px){
  .mention-de-courrier{display:none}
  .billet{
    grid-template-columns:110px 1fr;
    gap:8px 16px;
    align-items:start;
  }
  .portrait-de-billet{grid-row:span 3}
  .portrait-de-premiere{aspect-ratio:3/2}
  .ligne-de-envoi{grid-template-columns:1fr;gap:4px}
  .ligne-de-envoi:hover{padding-left:0}
  .portrait-de-sergent_major{aspect-ratio:16/9}
  .portrait-contre_seing,.portrait-tournee_facteur,.portrait-du-timbre_dente{aspect-ratio:4/3}
}
@media (max-width:575.98px){
  .apostille{font-size:clamp(20px,6vw,26px)}
  .chemin-de-papier_velin{gap:12px 18px;font-size:10.5px}
  .ligne-de-service-missive{gap:12px}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .cursive img,
  .sceau-de-premiere img,
  .ligne-de-envoi,
  .pli_ferme-de-chemin-de-papier_velin,
  .bouton-levee{transition:none}
  .cachet_postal-de-premiere:hover .portrait-de-premiere img,
  .liseret:hover .portrait-de-liseret img,
  .billet:hover .portrait-de-billet img,
  .renseignement:hover .portrait-de-renseignement img,
  .post:hover .portrait-de-post img,
  .post-de-sceau:hover .sceau-de-premiere img{transform:none}
}
@media print{
  :root{--avis_de_passage:#fff;--encre-missive:#000;--encre-reponse_attendue:#444;--encrier:#bbb}
  .bandeau-de-courrier,.chemin-de-papier_velin,.boite_postale-pages{display:none}
  .cursive{break-inside:avoid}
}