/* Structure catégorielle
   version 2025-04-01 (suit 2025-03-20)
-------------------------------------------------------------------------------------------|
Chaque catégorie est classée par ordre alphabétique.                                       |
– pseudoclasse :    État particulier requis pour appliquer la déclaration.                 |
– Pseudoéléments :  Comportement général non associé à un élément.                         |
– @font :           Déclarations de fontes.                                                |
– @keyframe :       Animations.                                                            |
– HTML :            Uniquement la balise HTML.                                             |
– Agencement :      Organisation globale (grid-area avec body, main header, footer, etc.). |
– Éléments HTML :   Styles spécifiques aux éléments).                                      |
– Identifiants :    Styles spécifiques à une seule entité.                                 |
– Classes :         Styles pour des classes réutilisables.                                 |
– @media :          Styles adaptatifs Media Query.                                         |
------------------------------------------------------------------------------------------ |
• Classement alphabétique dans chaque catégorie.                                           |
• Classement des propriétés ordre logique : disposition, espacement, taille, typographie,  |
  aspect visuel, animation et transition, autres                                           |
-------------------------------------------------------------------------------------------|
*/

/*---------------------------------|
Pseudoclasse : Variables globales. |
-----------------------------------|
*/
:root {
  /* Sommaire :
   1. Couleurs
   2. Transparences
   3. Priorités d’affichage
   4. Dimensions
   5. Taille des polices
*/

  /* Couleurs */
  /* Référence : [https://hextoral.com/hex-to-pantone-conversion/DCC235/]
/* Les couleurs suivent le guide de formule de couleurs solides sur papier couché Pantone+
 */
  /*--------------------|---------------|---------|-----------------[----------------|
  Valeur              | RVB           | HEXA    | CMJN            | PANTONE        |
----------------------|---------------|---------|-----------------[----------------| */
  --blanc-rvb: 255, 255, 255; /* #FFFFFB |   0,  0,  1,  0 |                | */
  --blanc-casse-rvb: 246, 246, 246; /* #F6F6F6 |   2,  2,  2,  0 |                | */
  --gris-argent-rvb: 213, 213, 213; /* #D5D5D5 |  15, 12, 13,  0 |                | */
  --gris-clair-rvb: 217, 225, 226; /* #DBE0E0 |  13,  7,  9,  0 | 7541 C         | */
  --gris-moyen-rvb: 117, 120, 123; /* #78797B |  55, 46, 44, 10 | Cool Grays 9 C | */
  --gris-moyen-pale-rvb: 236, 240, 241; /* #ECF0F1 |   5,  3,  3,  0 | (Non utilisé)  | */
  --gris-sombre-rvb: 29, 37, 45; /* #1D252D |  79, 69, 58, 66 | 433 C          | */
  --noir-rvb: 16, 24, 32; /* #101820 |  80, 71, 60, 76 | Black 6 C      | */

  --rouge-rvb: 224, 60, 49; /* #E03C31 |   5, 92, 91,  0 | 179 C          | */
  --orange-rvb: 219, 107, 48; /* #DB6B30 |  10, 71, 96,  1 | 7578 C         | */
  --jaune-rvb: 252, 192, 0; /* #FCC000 |   1, 26,100,  0 |                | */
  --jaune-vif-rvb: 215, 199, 38; /* #D7C726 |  18, 15,100,  0 | 611 C          [ */
  --jaune-moutarde-rvb: 215, 185, 38; /* #D7B926 |  18, 23,100,  0 |                | */
  --jaune-orange-rvb: 218, 168, 3; /* #DAA803 |   7, 23, 95,  0 |                | */
  --jaune-serin-rvb: 255, 232, 29; /* #FFE81D |   2,  4, 96,  0 |                | */
  --vert-rvb: 80, 158, 47; /* #509E2F |  73, 15,100,  2 | 362 C          | */
  --vert-academie-rvb: 64, 115, 54; /* #3C7336 |  78, 73,100, 20 |                | */
  --bleu-vert-rvb: 66, 152, 181; /* #4298B5 |  72, 27, 21,  0 | 7459 C         | */
  --bleu-clair-rvb: 123, 164, 219; /* #7BA4DB |  51, 27,  0,  0 | 659 C          [ */
  --bleu-sombre-rvb: 30, 34, 170; /* #1E22AA |  96, 94,  0,  0 | 2736 C         | */
  --violet-rvb: 117, 59, 189; /* #753BBD |  67, 84,  0,  0 | 2736 C         | */
  --pourpre-rvb: 187, 41, 187; /* #BB29BB |  37, 88,  0,  0 | Purple C       | */
  --rose-rvb: 255, 37, 108; /* #FF256C |   0, 95, 35,  0 | 812 C          [ */

  /* Transparence */
  --alpha-100: 1;
  --alpha-90: 0.9;
  --alpha-70: 0.7;
  --alpha-50: 0.5;
  --alpha-30: 0.3;
  --alpha-10: 0.1;

  /* Priorité d’affichage */
  --z-index-navbar: 10; /* Barre de navigation */
  --z-index-dropdown: 20; /* Liste déroulante */
  --z-index-modal: 30; /* Fenêtre d’erreur ou de publicité */
  --z-index-tooltip: 40; /* Infobulle */

  /* Dimensions */
  --taille-fonte: 12px; /* Taille du texte en pixels (équivalent à 9 pt, car 100 px = 75 pt) */

  /* Dépendance directe à la taille de la fonte de l’élément parent  pour lequel ils sont appliqués.
 * L’unité EM provient d’une erreur historique des Anglais, qui ont confondu le cadratin avec la lettre M.
 */
  --courbure: 0.5em; /* Courbure de la bordure */
  --intermot: 0.5em; /* Espacement intermot */
  --interligne: 1.5em; /* Interligne basé sur la taille de la fonte de l’élément parent */
  --approche: 0.025em; /* Espacement entre les lettres incluant l'approche initiale et finale */
  --lisere: 1px; /* Épaisseur du liseré */

  /* Cohérence et adaptabilité de la hiérarchie visuelle (relative à la taille de la fonte de l'élément racine) */
  --interbloc: 0.75rem; /* Marge verticale entre deux blocs de contenu */
  --gouttiere: 1rem; /* Intervalle entre deux colonnes */
  --intermenu: 0.5rem; /* Intervalle entre les deux lignes */
  --rembourrage: 1rem; /* Rembourrage */
  --retrait: 2rem; /* Retrait */
  --alinea: -1rem; /* Retrait */

  /* Taille des polices */
  --taille-m: 1.5rem; /* Taille de la fonte du menu primaire */
  --taille-h1: 2rem; /* h1 2.000rem (32px) margin (16 px) */
  --taille-h2: 1.625rem; /* h2 1.625rem (26px) margin (13 px) */
  --taille-h3: 1.25rem; /* h3 1.500rem (24px) margin (12 px) */
  --taille-h4: 1.25rem; /* h4 1.375rem (22px) margin (11 px) */
  --taille-h5: 1.25rem; /* h5 1.250rem (20px) margin (10 px) */
  --taille-h6: 1.125rem; /* h6 1.125rem (18px) margin ( 9 px) */
  --taille-p: 1rem; /* p  1.000rem (16px) margin ( 8 px) */

  /* Navigation */
  --navigation-hauteur: 4rem; /* Hauteur de la barre de navigation */
  --navigation-largeur: 100%; /* Largeur de la barre de navigation */
  --navigation-rembourrage-vertical: 0em; /* Espace de rembourrage vertical */
  --navigation-rembourrage-horizontal: 18.5%; /* Espace de rembourrage horizontal */
  --menu-hauteur: 4rem; /* Hauteur du bloc de menu */
  --menu-secondaire-taille: 1rem; /* Taille de la police de menu */

  /* Adaptation de la largeur des menus selon la résolution de l’écran */
  --ecran-minimal: 1200;
  --ecran-maximal: 3840;
  --resolution-initiale: 77;
  --resolution-finale: 35;
  --resolution-difference: calc(
    var(--resolution-initiale) - var(--resolution-finale)
  );
  --ecran-minimal-largeur: calc(var(--ecran-minimal) * 1px);
  --ecran-maximal-largeur: calc(var(--ecran-maximal) * 1px);
  --menu-ecran-minimal-largeur: calc(var(--resolution-initiale) * 1vw);
  --menu-ecran-maximal-largeur: calc(var(--resolution-finale) * 1vw);
  --difference-largeur: calc(var(--ecran-maximal) - var(--ecran-minimal));
  --difference-menu-largeur: calc(
    (var(--resolution-initiale) - var(--resolution-finale)) *
      var(--ecran-maximal) / 100
  );
  --menu-largeur: clamp(
    var(--menu-ecran-maximal-largeur),
    calc(
      var(--menu-ecran-minimal-largeur) - var(--resolution-difference) *
        ((100vw - var(--ecran-minimal-largeur)) / var(--difference-largeur))
    ),
    var(--menu-ecran-minimal-largeur)
  );

  /* Miniatures */
  --livre-nombre: 2; /* Nombre de livres par rangée */
  --vignette-nombre: 3; /* Nombre de vignettes par rangée */
}

:focus-visible {
  /* Espacement */
  padding: calc(var(--rembourrage) * 0.5);
  /* Aspect visuel */
  background-color: rgba(var(--bleu-clair-rvb), var(--alpha-70));
}

:target {
  /* Marge interne supérieure pour éviter que l’élément soit caché */
  scroll-margin-top: 100px;
}

/*---------------------------------------------------------------|
Pseudoéléments : comportements généraux non associé à un élément |
-----------------------------------------------------------------|
*/
::placeholder {
  /* Typographie */
  color: rgba(var(-gris-sombre-rvb), var(--alpha-100));
  font-size: small;
}

::selection {
  /* Typographie */
  color: rgba(var(--blanc-rvb), var(--alpha-100));
  /* Aspect visuel */
  background-color: rgba(var(--bleu-vert-rvb), var(--alpha-100));
  outline: 2px solid transparent;
}

/*-------------------------------|
@font : déclarations des fontes. |
---------------------------------|
/* Arial Regular */
@font-face {
  font-family: "Arial";
  font-weight: 400;
  font-style: normal;
  font-display: swap;
  src: url("../fonts/arial-regular.woff2") format("woff2"),
       url("../fonts/arial-regular.woff") format("woff"),
       url("../fonts/arial-regular.ttf") format("truetype"),
       url("../fonts/arial-regular.otf") format("opentype");
}

/* Arial Italic */
@font-face {
  font-family: "Arial";
  font-weight: 400;
  font-style: italic;
  font-display: swap;
  src: url("../fonts/ArialVariable.woff2") format("woff2"),
       url("../fonts/ArialVariable.woff") format("woff"),
       url("../fonts/ariali.ttf") format("truetype"),
       url("../fonts/ariali.otf") format("opentype");
}

/* Font Awesome 6 Regular */
@font-face {
  font-family: "Font Awesome 6 Regular";
  font-weight: 400;
  font-style: normal;
  font-display: block;
  src: url("../fonts/fa-regular-400.woff2") format("woff2"),
       url("../fonts/fa-regular-400.woff") format("woff"),
       url("../fonts/fa-regular-400.ttf") format("truetype");
}

/* Font Awesome 6 Solid */
@font-face {
  font-family: "Font Awesome 6 Solid";
  font-weight: 900;
  font-style: normal;
  font-display: block;
  src: url("../fonts/fa-solid-900.woff2") format("woff2"),
       url("../fonts/fa-solid-900.woff") format("woff"),
       url("../fonts/fa-solid-900.ttf") format("truetype");
}

/* Font Awesome 6 Brands */
@font-face {
  font-family: "Font Awesome 6 Brands";
  font-weight: 400;
  font-style: normal;
  font-display: block;
  src: url("../fonts/fa-brands-400.woff2") format("woff2"),
       url("../fonts/fa-brands-400.woff") format("woff"),
       url("../fonts/fa-brands-400.ttf") format("truetype");
}

/* Hack */
@font-face {
  font-family: "Hack";
  font-weight: 400;
  font-style: normal;
  font-display: swap;
  src: url("../fonts/hack-regular.woff2") format("woff2"),
       url("../fonts/hack-regular.woff") format("woff"),
       url("../fonts/hack-regular.ttf") format("truetype");
}

/* Simply Mono */
@font-face {
  font-family: "Simply Mono";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../fonts/SimplyMono-Book.woff2") format("woff2"),
       url("../fonts/SimplyMono-Book.woff") format("woff"),
       url("../fonts/SimplyMono-Book.ttf") format("truetype");
}

/* Simply Sans */
@font-face {
  font-family: "Simply Sans";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../fonts/SimplySans-Book.woff2") format("woff2"),
       url("../fonts/SimplySans-Book.woff") format("woff"),
       url("../fonts/SimplySans-Book.ttf") format("truetype");
}



/*----------------------|
@keyframe : animations. |
------------------------|
*/
@keyframes explosion {
  0% {
    /* Animation et transition */
    transform: scale(1);
    /* Aspect visuel */
    opacity: 1;
  }

  50% {
    /* Animation et transition */
    transform: scale(1.5);
    /* Aspect visuel */
    opacity: 0.5;
  }

  100% {
    /* Animation et transition */
    transform: scale(2);
    /* Aspect visuel */
    opacity: 0;
  }
}

@keyframes implosion {
  0% {
    /* Animation et transition */
    transform: scale(0.5);
    /* Aspect visuel */
    opacity: 0;
  }

  100% {
    /* Animation et transition */
    transform: scale(1);
    /* Aspect visuel */
    opacity: 1;
  }
}

@keyframes focalisation {
  0% {
    /* Animation et transition */
    transform: scale(0.5) translate(0, 0);
  }

  5% {
    /* Animation et transition */
    transform: scale(1.1) translate(20px, 20px);
  }

  7% {
    /* Animation et transition */
    transform: scale(1) translate(0, 0);
  }

  100% {
    /* Animation et transition */
    transform: scale(1) translate(0, 0);
  }
}

@keyframes scanneur {
  0% {
    /* Disposition */
    left: -100%;
  }

  50% {
    /* Disposition */
    left: 100%;
  }

  100% {
    /* Disposition */
    left: -100%;
  }
}

/*-------------------------------|
HTML : uniquement la balise HTML |
---------------------------------|
*/
html {
  /* Typographie fonte */
  font-family: "Simply Sans", Arial, sans-serif;
  /* Typographie dimension */
  font-size: var(--taille-fonte);
  line-height: var(--interligne);
  /* Typographie espacement */
  letter-spacing: normal;
  word-spacing: normal;
  /* Typographie couleur */
  color: rgba(var(--noir-rvb), var(--alpha-100));
}

/*---------|
Agencement |
-----------|
*/
body {
  /* Disposition */
  display: grid;
  grid-template-areas:
    "entete"
    "principal"
    "pied";
  gap: var(--gouttiere);
  /* Espacement */
  margin: 0;
  padding: 0;
  /* Aspect visuel */
  background-color: rgba(var(--blanc-casse-rvb), var(--alpha-100));
}

/* Menu superposé */
aside {
  /* Disposition et positionnement */
  grid-area: superposition;
  position: fixed; /* Pour occuper toute la fenêtre de visualisation */
  top: 4.1rem;
  left: 0;
  right: 0;
  bottom: 0; /* Étend l'élément jusqu'en bas */
  z-index: calc(var(--z-index-navbar) + 1);
  overflow: auto; /* Ajoute un défilement si le contenu dépasse */
  /* Espacement */
  padding: var(--rembourrage); /* Rembourrage sur la verticale */
  /* Aspect visuel */
  background-color: rgba(var(--gris-sombre-rvb), var(--alpha-100));
}

/* display flex pour utiliser flexbox
   justify-content pour centrer les éléments horizontalement
   padding pour rembourrer sur la verticale */
header {
  /* Disposition et positionnement */
  grid-area: entete;
  position: sticky;
  top: 0;
  z-index: var(--z-index-navbar);
  display: flex;
  flex-direction: column;
  justify-content: center;
  /* Espacement */
  padding: 0;
  /* Aspect visuel */
  background-color: rgba(var(--gris-moyen-rvb), var(--alpha-100));
}

header nav {
  /* Disposition */
  display: flex;
  align-items: center;
}

header nav ul {
  /* Disposition */
  display: flex;
  list-style-type: none;
  /* Espacement */
  margin: 0;
  padding: 0;
}

header nav li {
  /* Disposition */
  display: inline-block;
  /* Espacement */
  margin-inline-end: 10px;
}

header nav a {
  /* Disposition */
  display: inline-block;
  /* Aspect visuel */
  text-decoration: none;
}

main {
  /* Disposition */
  grid-area: principal;
  /* Espacement */
  padding: var(--rembourrage) 0; /* Rembourrage vertical */
}

footer {
  /* Disposition */
  grid-area: pied;
  /* Espacement */
  padding: var(--rembourrage); /* Rembourrage vertical */
  /* Aspect visuel */
  background-color: rgba(var(--gris-sombre-rvb), var(--alpha-100));
  color: rgba(var(--jaune-vif-rvb), var(--alpha-100));
}

main,
footer,
aside {
  /* Disposition */
  display: grid;
  grid-template-columns: auto var(--menu-largeur) auto;
  gap: var(--gouttiere);
}

main > div,
footer > div,
aside > div {
  /* Aspect visuel */
  box-sizing: border-box;
}

/*-----------------------------------------------|
Éléments HTML : styles spécifiques aux éléments. |
-------------------------------------------------|
*/
a {
  /* Typographie couleur */
  color: rgba(var(--bleu-vert-rvb));
}

/* link : menu non visités */
/* visited : menu visités */
a:link,
a:visited {
  /* Typographie couleur */
  text-decoration: none;
}

/* active: menu en cours */
/* hover: menu survolé */
a:active,
a:hover {
  /* Typographie couleur */
  text-decoration: underline;
}

/* Réinitialisation de la position et du fond des entêtes des vignettes */
article.vignette > header {
  /* Disposition */
  position: static;
  /* Aspect visuel */
  background-color: transparent;
}

article h3,
.pied-menu h3 {
  /* Disposition */
  text-align: left;
  /* Typographie fonte */
  font-weight: normal;
  /* Typograpraphie dimension */
  font-size: var(--taille-p3);
}

blockquote,
.presentation {
  /* Disposition */
  display: block;
  /* Espacement */
  margin-block-start: var(--interligne);
  margin-block-end: var(--interligne);
  margin-inline-start: 40px;
  margin-inline-end: var(--intermot);
  padding: var(--rembourrage);
  /* Aspect visuel */
  background-color: rgba(var(--gris-clair-rvb), var(--alpha-50));
  border-radius: var(--courbure);
}

button {
  /* Aspect visuel */
  border-width: 0;
}

caption {
  /* Disposition */
  caption-side: bottom;
  /* Espacement */
  padding: var(--rembourrage);
  /* Typographie fonte */
  font-weight: bold;
}

/* Préparation de l’extension de la couleur d’arrière-plan à gauche avec les pseudo-éléments */
dd {
  /* Disposition */
  position: relative;
  /* Espacement */
  margin-inline-start: var(--retrait);
  margin-inline-end: var(--intermot);
  text-indent: var(--alinea);
}

dd:before {
  /* Contenu */
  content: "";
  /* Positionnement */
  position: absolute;
  top: 0;
  bottom: 0;
  left: var(--alinea);
  /* Taille */
  inline-size: var(--retrait);
  /* Aspect visuel */
  background-color: inherit;
}

dd:hover {
  /* Aspect visuel */
  background-color: rgba(var(--gris-clair-rvb), var(--alpha-30));
}

dd > b {
  /* Espacement (extérieur et intérieur) */
  padding: 0.28em 1.2em 0.35em;
  /* Typographie fonte */
  font-weight: normal;
  font-variant: small-caps;
  /* Typographie couleur */
  color: rgba(var(--gris-moyen-rvb), var(--alpha-100));
  /* Aspect visuel */
  background-color: rgba(var(--gris-clair-rvb), var(--alpha-50));
}

dd:hover > b {
  /* Typographie couleur */
  color: rgba(var(--noir-rvb), var(--alpha-100));
  /* Aspect visuel */
  background-color: rgba(var(--gris-clair-rvb), var(--alpha-90));
}

dd.drapeau {
  /* Espacement */
  text-indent: 0;
}

del {
  /* Typographie couleur */
  color: rgba(var(--rouge-rvb), var(--alpha-100));
}

details[open] {
  /* Espacement */
  margin-block-end: calc(var(--interligne) * 1.25);
  /* Aspect visuel */
  border-block-end: var(--lisere) solid
    rgba(var(--gris-sombre-rvb), var(--alpha-50));
}

details[open] .question-reponse:marker {
  /* Typographie contenu */
  content: "▼";
}

details img {
  /* Taille */
  inline-size: 3rem;
}

details.categorie-anomalie dt,
details.categorie-anomalie dt + dd,
details.categorie-anomalie dt + dd + dd,
details.categorie-anomalie dt + dd + dd + dd {
  /* Aspect visuel */
  background-color: transparent;
}

details.categorie-anomalie dt em,
details.categorie-anomalie dt + dd em,
details.categorie-anomalie dt + dd + dd em,
details.categorie-anomalie dt + dd + dd + dd em,
details.categorie-anomalie dt strong,
details.categorie-anomalie dt + dd strong,
details.categorie-anomalie dt + dd + dd strong,
details.categorie-anomalie dt + dd + dd + dd strong {
  /* Typographie couleur */
  color: rgba(var(--pourpre-rvb), var(--alpha-100));
}

div.image-normale {
  /* Aspect visuel */
  background-color: rgba(var(--gris-clair-rvb), var(--alpha-70));
}

/* Terme */
dt {
  /* Disposition */
  position: relative;
  /* Espacement */
  margin: var(--interligne) 0;
  /* Typographie fonte */
  text-transform: uppercase;
  font-weight: bold;
  /* typographie couleur */
  color: rgba(var(--bleu-clair-rvb), var(--alpha-100));
}

/* Ajout des 9 catégories grammaticales et des 2 genres du mot */
dt.categorie-adjectif::after {
  content: "adjectif";
}
dt.categorie-adverbe::after {
  content: "adverbe";
}
dt.categorie-conjonction::after {
  content: "conjonction";
}
dt.categorie-determinant::after {
  content: "déterminant";
}
dt.categorie-interjection::after {
  content: "interjection";
}
dt.categorie-nom-feminin::after {
  content: "nom féminin";
}
dt.categorie-nom-masculin::after {
  content: "nom masculin";
}
dt.categorie-preposition::after {
  content: "préposition";
}
dt.categorie-pronom-masculin::after {
  content: "pronom masculin";
}
dt.categorie-pronom-feminin::after {
  content: "pronom féminin";
}
dt.categorie-preposition-::after {
  content: "nom féminin";
}
dt.categorie-verbe::after {
  content: "verbe";
}
dt.categorie-nom-feminin-pluriel::after {
  content: "nom féminin pluriel";
  color: rgba(var(--rose-rvb), var(--alpha-100));
}
dt.categorie-nom-masculin-pluriel::after {
  content: "nom masculin pluriel";
  color: rgba(var(--bleu-rvb), var(--alpha-100));
}

dt.langue-anglais::after {
  content: "(version en anglais)";
  font-weight: normal;
}

/* Catégorie grammaticale */
dt::after {
  /* Disposition */
  position: absolute;
  top: 0;
  /* Espacement */
  margin-inline-start: var(--intermot);
  /* Typographie fonte */
  font-weight: bold;
  text-transform: none;
  /* Typographie espacement */
  white-space: nowrap;
  /* Typographie couleur */
  color: rgba(var(--noir-rvb), var(--alpha-100));
}

dt:nth-of-type(2n + 1),
dt:nth-of-type(2n + 1) + dd,
dt:nth-of-type(2n + 1) + dd + dd,
dt:nth-of-type(2n + 1) + dd + dd + dd {
  /* Disposition */
  position: relative;
  /* Aspect visuel */
  background-color: rgba(var(--blanc-rvb), var(--alpha-100));
}

dt:nth-of-type(2n),
dt:nth-of-type(2n) + dd,
dt:nth-of-type(2n) + dd + dd,
dt:nth-of-type(2n) + dd + dd + dd {
  /* Disposition */
  position: relative;
  /* Aspect visuel */
  background-color: rgba(var(--blanc-rvb), var(--alpha-100));
}

/* Surcharge pour tout ce qui est dans <dl class="branche"> */
dl.branche dt,
dl.branche dd {
  background-color: transparent;
  text-indent: 0;
}

/* Cette règle aura priorité sur les règles générales précédentes car elle est plus spécifique */
dt svg {
  /* Espacement */
  margin-inline-end: var(--intermot);
}

em {
  /* Typographie fonte */
  font-style: normal;
  /* Typographie couleur */
  color: rgba(var(--gris-moyen-rvb));
}

em span {
  /* Typographie couleur */
  color: rgba(var(--noir-rvb), var(--alpha-100));
}

fieldset {
  /* Disposition */
  position: relative;
  /* Espacement */
  padding-block-start: var(--interligne);
}

figcaption {
  /* Disposition */
  text-align: center;
  /* Typographie fonte */
  font-style: normal;
}

/* Suppression des marges du navigateur Brave */
figure {
  /* Espacement */
  margin-block-start: 0;
  margin-block-end: 0;
  margin-inline-start: 0;
  margin-inline-end: 0;
}

figure.etymologie figcaption {
  /* Disposition */
  display: inline;
}

h1 {
  font-size: var(--taille-h1);
}
h2 {
  font-size: var(--taille-h2);
}
h3 {
  font-size: var(--taille-h3);
}
h4 {
  font-size: var(--taille-h4);
}
h5 {
  font-size: var(--taille-h5);
}
h6 {
  font-size: var(--taille-h6);
}

h1,
h2,
h3,
h4,
h5,
h6 {
  /* Disposition */
  text-align: center;
  /* Espacement */
  margin: var(--interbloc) 0 var(--interbloc) 0;
  /* Typographie fonte */
  font-family: "Arial", sans-serif;
  /* Typographie dimension */
  line-height: var(--interligne);
}

h3.image-normale {
  /* Typographie couleur */
  color: rgba(var(--rouge-rvb), var(--alpha-100));
}

h3.image-survol {
  /* Typographie couleur */
  color: rgba(var(--vert-rvb), var(--alpha-100));
}

hr {
  /* Taille */
  block-size: 1px;
  /* Aspect visuel */
  background-color: rgba(var(--noir-rvb), var(--alpha-100));
  border: none;
}

input {
  /* Typographie espacement */
  white-space: nowrap;
  /* Typographie débordement et troncature */
  overflow: auto;
  text-overflow: ellipsis;
}

input,
textarea {
  /* Disposition */
  display: inline-block;
  text-align: left;
  /* Espacement */
  padding: var(--rembourrage);
  padding-inline-end: 3.5ch;
  /* Taille */
  min-inline-size: auto;
  /* Typographie fonte */
  font-family: "Simply Mono", monospace;
  font-variant: normal;
  /* Typographie dimension */
  font-size: larger;
  line-height: var(--interligne);
  /* Typographie couleur */
  color: rgba(var(--gris-moyen-rvb), var(--alpha-100));
  /* Aspect visuel */
  background-color: rgba(var(--gris-clair-rvb), var(--alpha-70));
  border: none;
  border-radius: var(--courbure);
}

/* Augmenter la taille de la boite à cocher */
input[type="checkbox"] {
  transform: scale(1.2);
  margin-block-end,: var(--interbloc);
}

/* Couleur de l’indication par défaut */
input[type="date"] {
  color: rgba(var(--blanc-rvb), var(--alpha-100));
}

/* Maintenir la couleur pour le label lorsque son bouton radio associé est sélectionné */
input[type="radio"]:checked + label {
  /* Typographie */
  color: rgba(var(--bleu-sombre-rvb), var(--alpha-100));
  /* Aspect visuel */
  background-color: rgba(var(--bleu-sombre-rvb), var(--alpha-30));
}

input[type="radio"]:checked + label.couleur-violet,
input[type="radio"]:checked ~ label.couleur-violet {
  /* Typographie */
  color: rgba(var(--violet-rvb), var(--alpha-100));
  /* Aspect visuel */
  background-color: rgba(var(--violet-rvb), var(--alpha-30));
}

input.either {
  /* Aspect visuel */
  background-image: linear-gradient(
    45deg,
    transparent,
    transparent 50%,
    rgba(var(--jaune-rvb), var(--alpha-100)) 50%,
    rgba(var(--jaune-rvb), var(--alpha-100)) 100%
  );
  background-position: top right;
  background-size: 0.8em 0.8em;
  background-repeat: no-repeat;
}

input.either {
  /* Disposition */
  background-position: top right;
  background-repeat: no-repeat;
  /* Taille */
  background-size: 0.8em 0.8em;
  /* Aspect visuel */
  background-image: linear-gradient(
    45deg,
    transparent,
    transparent 50%,
    rgba(var(--jaune-rvb), var(--alpha-100)) 50%,
    rgba(var(--jaune-rvb), var(--alpha-100)) 100%
  );
}

input.either:focus:invalid {
  /* Typographie couleur */
  color: rgba(var(--rouge-rvb), var(--alpha-100));
  /* Aspect visuel */
  background-color: rgba(var(--jaune-rvb), var(--alpha-30));
}

input.either:focus:valid {
  /* Typographie couleur */
  color: rgba(var(--bleu-sombre-rvb), var(--alpha-100));
  /* Aspect visuel */
  background-color: rgba(var(--bleu-clair-rvb), var(--alpha-30));
}

input:focus:invalid,
textarea:focus:invalid,
.ligne-debordante {
  /* Typographie couleur */
  color: rgba(var(--rouge-rvb), var(--alpha-100));
  /* Aspect visuel */
  background-color: rgba(var(--rouge-rvb), var(--alpha-30));
}

input:focus:invalid,
textarea:focus:invalid {
  /* Disposition */
  background-repeat: no-repeat;
  background-position: right 0.5em top;
  /* Taille */
  background-size: 2em 2em;
  /* Espacement */
  padding-right: 2.1em;
  /* Aspect visuel */
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><circle cx="12" cy="12" r="11.6" fill="white" stroke="black" stroke-width="0.12"/><circle cx="12" cy="12" r="9.6" fill="%23FF0000"/><rect x="2.4" y="10.4" width="19.2" height="3.2" fill="white"/></svg>');
}

input:focus:valid,
textarea:focus:valid {
  /* Disposition */
  background-repeat: no-repeat;
  background-position: right 0.5em top;
  /* Taille */
  background-size: 2em 2em;
  /* Espacement */
  padding-right: 2.1em;
  /* Typographie couleur */
  color: rgba(var(--bleu-sombre-rvb), var(--alpha-100));
  /* Aspect visuel */
  background-color: rgba(var(--bleu-clair-rvb), var(--alpha-30));
  background-image: url('data:image/svg+xml;utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M1.73,23.6h20.54c0.454,0 0.89,-0.18 1.21,-0.5 0.32,-0.32 0.5,-0.76 0.5,-1.22V1.73c0,-0.46 -0.18,-0.89 -0.5,-1.21C23.16,0.18 22.72,0 22.27,0H1.73C1.28,0 0.84,0.18 0.52,0.52 0.2,0.84 0.02,1.28 0.02,1.73v20.54c0,0.46 0.18,0.89 0.5,1.21 0.32,0.3 0.76,0.48 1.21,0.48Z" fill="%23FFFFFB" stroke="%2300000" stroke-width="0.12"/><path d="M22.74,21.76c0,0.29 -0.24,0.53 -0.53,0.53H1.79c-0.29,0 -0.53,-0.24 -0.53,-0.53V1.79c0,-0.29 0.24,-0.53 0.53,-0.53h20.42c0.29,0 0.53,0.24 0.53,0.53V21.76Z" fill="%230056a4" stroke="%2300000" stroke-width="0.12"/><path d="M8.64,12.7c-0.09,-4.82 3.5,-7.85 8.08,-7 -0.72,0.16 -1.46,0.47 -2.21,0.89l-1.05,0.11 0.53,0.19c-0.53,0.37 -1.02,0.78 -1.48,1.23l-1.79,0.39 1.19,0.24 -1.41,1.75 -1,0.36 0.67,0.06c-0.41,0.63 -0.89,1.22 -1.46,1.75Z" fill="url(%23Linear2)"/><path d="M8.75,15.09l-0.09,0.01c-0.62,-0.89 -1.09,-2 -1.26,-3.58l0.43,0.16 -0.44,-0.42c-0.03,-0.83 0.12,-1.66 0.43,-2.47l0.54,0.38 -0.41,-0.71c0.35,-0.78 0.85,-1.46 1.48,-2.02l0.22,0.31 -0.08,-0.45 0.44,-0.32 0.16,0.69 0.16,-0.89c2,-1.08 4.08,-0.96 6.21,0 -1.24,-0.22 -2.53,-0.24 -3.94,0.3 -3.54,1.48 -5.22,4.79 -3.9,8.9Z" fill="url(%23Linear3)"/><text x="2.54" y="20.55" font-family="Arial-Black, Arial, sans-serif" font-weight="900" font-size="3.5" fill="%23FFFFFB">CORRECT</text><defs><linearGradient id="Linear2" x1="0" y1="0" x2="1" y2="0" gradientUnits="userSpaceOnUse" gradientTransform="matrix(8.08,0,0,8.08,8.64,9.11)"><stop offset="0" stop-color="%23FCC000"/><stop offset="1" stop-color="%23DB6B30"/></linearGradient><linearGradient id="Linear3" x1="0" y1="0" x2="1" y2="0" gradientUnits="userSpaceOnUse" gradientTransform="matrix(6.28,-8.08,8.08,6.28,7.91,15.09)"><stop offset="0" stop-color="%23509E2F"/><stop offset="1" stop-color="%234298B5"/></linearGradient></defs></svg>');
}

input:required,
textarea:required {
  /* Disposition */
  background-position: top right;
  background-repeat: no-repeat;
  /* Taille */
  background-size: 0.8em 0.8em;
  /* Aspect visuel */
  background-color: rgba(var(--gris-sombre-rvb), var(--alpha-30));
  background-image: linear-gradient(
    45deg,
    transparent,
    transparent 50%,
    rgba(var(--orange-rvb), var(--alpha-100)) 50%,
    rgba(var(--orange-rvb), var(--alpha-100)) 100%
  );
}

/* hover: menu survolé */
input:hover,
textarea:hover {
  /* Typographie couleur */
  color: rgba(var(--gris-moyen-rvb), var(--alpha-100));
}

ins {
  /* Typographie couleur */
  color: rgba(var(--vert-rvb), var(--alpha-100));
}

kbd {
  /* Espacement */
  padding: 0.17rem;
  /* Typographie fonte */
  font-family: "Hack";
  /* Typographie dimension */
  font-size: 0.84em;
  /* Typographie couleur */
  color: rgba(var(--bleu-vert-rvb), var(--alpha-100));
  /* Aspect visuel */
  background-color: rgba(var(--gris-sombre-rvb), var(--alpha-100));
  border: var(--lisere) solid rgba(var(--gris-sombre-rvb), var(--alpha-50));
  border-radius: var(--courbure);
}

legend {
  /* Disposition */
  position: absolute;
  top: 0;
  left: 0;
  /* Taille */
  inline-size: 100%;
  /* Espacement */
  padding: 1rem var(--rembourrage);
  /* Typographie dimension */
  font-size: xx-large;
  /* Autres */
  box-sizing: border-box;
}

ol.cesure-brute {
  /* Typographie débordement et troncature */
  overflow-wrap: anywhere;
}

ol.style-francais a:link {
  /* Typographie couleur */
  text-decoration: none;
}

ol.style-francais li {
  /* Espacement */
  margin-inline-start: var(--approche);
  padding-inline-start: 1em;
  text-indent: calc(-1 * var(--approche));
}

ol.style-francais li::after {
  /* Typographie contenu */
  content: ".";
}

/*
Numérotation en chiffre romain
extérieure à la Liste
sans retrait
avec une espace d’un intermot
*/
ol.style-romain {
  /* Disposition */
  list-style: upper-roman;
  list-style-position: outside;
  /* Espacement */
  margin-inline-start: 0;
  padding-inline-start: var(--rembourrage);
}

p {
  /* Espacement */
  margin-block-end: var(--interbloc);
  /* Typographie dimension */
  font-size: var(--taille-p);
}

p.image-normale,
span.image-normale,
.presentation td.image-normale {
  /* Espacement */
  padding: var(--rembourrage);
  /* Typographie approche */
  letter-spacing: 0.03em;
  /* Typographie couleur */
  color: rgba(var(--noir-rvb), var(--alpha-100));
  /* Aspect visuel */
  background-color: rgba(var(--rouge-rvb), var(--alpha-70));
}

p.acheter {
  /* Typographie fonte */
  text-transform: uppercase;
  /* Typographie couleur */
  color: rgba(var(--violet-rvb), var(--alpha-100));
}

p.corriger {
  /* Typographie fonte */
  text-transform: uppercase;
  /* Typographie couleur */
  color: rgba(var(--rouge-rvb), var(--alpha-100));
}

p.image-survol,
span.image-survol,
.presentation td.image-survol {
  /* Espacement */
  padding: var(--rembourrage);
  /* Typographie approche */
  letter-spacing: 0.03em;
  /* Typographie couleur */
  color: rgba(var(--noir-rvb), var(--alpha-100));
  /* Aspect visuel */
  background-color: rgba(var(--vert-rvb), var(--alpha-70));
}

pre {
  /* Typographie fonte */
  font-family: inherit;
  /* Typographie dimension */
  font-size: 1.45vw;
  line-height: var(--interligne);
  /* Typographie espacement */
  letter-spacing: normal;
  word-spacing: normal;
  white-space: pre-wrap;
}

q {
  /* Typographie contenu */
  quotes: "«\202F""\202F»";
}

q::before {
  /* Typographie contenu */
  content: open-quote;
}

q::after {
  /* Typographie contenu */
  content: close-quote;
}

span.image-normale {
  /* Disposition */
  display: inline-block;
  /* Espacement */
  margin-block-end: var(--interbloc);
}

/* Réglage de l’indice selon les normes typographiques de Prolexis
 une échelle verticale de 70%
 une échelle horizontale de 70 %
 un décalage vertical de 20 %
 */
sub {
  /* Disposition */
  position: relative;
  bottom: -0.2rem; /* Décalage vertical de 20 % */
  vertical-align: baseline;
  /* Typographie fonte */
  font-size: 70%; /* Échelle horizontale et verticale */
}

/* Réglage de l’exposant selon les normes typographique de Prolexis
 un décalage vertical de 30 %
 une échelle verticale de 60%
 une échelle horiznontale de 60 %
 */
sup {
  /* Disposition */
  vertical-align: 30%;
  /* Typographie dimension */
  font-size: 60%;
  line-height: var(--interligne);
  /* Autres */
  transform: none;
}

table {
  /* Disposition */
  display: table;
  table-layout: fixed;
  /* Taille */
  inline-size: 100%;
  /* Typographie fonte */
  font-family: "Hack";
  /* Typographie dimension */
  font-size: 0.8rem;
  /* Typographie espacement */
  letter-spacing: 1px;
  /* Aspect visuel */
  border-collapse: collapse;
  margin-block-start: var(--interligne);
  margin-block-end: var(--interligne);
}

table kbd {
  /* Disposition */
  display: inline-block;
  vertical-align: middle;
  text-align: center;
  /*/ Taille */
  inline-size: var(--taille-h1);
  block-size: var(--taille-h1);
  /* Typographie fonte */
  font-size: 1.4em;
  /* Typographie couleur */
  color: rgba(var(--gris-moyen-rvb), var(--alpha-100));
  /* Aspect visuel */
  background-color: rgba(var(--gris-clair-rvb), var(--alpha-100));
  border-radius: 0;
}

table kbd:hover {
  /* Typographie couleur */
  color: rgba(var(--bleu-clair-rvb), var(--alpha-100));
  /* Aspect visuel */
  background-color: rgba(var(--bleu-vert-rvb), var(--alpha-100));
}

tbody > tr:nth-of-type(even) {
  /* Aspect visuel */
  background-color: rgba(var(--gris-argent-rvb), var(--alpha-100));
}

tbody > tr:nth-of-type(odd) {
  /* Aspect visuel */
  background-color: rgba(var(--blanc-casse-rvb), var(--alpha-100));
}

tbody,
tfoot,
thead {
  /* Disposition */
  display: table-row-group;
}

td,
th {
  /* Disposition */
  display: table-cell;
  text-align: center;
  /* Taille */
  inline-size: 10vw;
  /* Espacement */
  padding: 1em;
  /* Typographie débordement et troncature */
  word-break: normal;
  overflow-wrap: break-word;
  /* Aspect visuel */
  border: var(--lisere) solid rgb(var(--gris-moyen-rvb));
}

th,
td {
  /* Taille */
  block-size: var(--taille-m);
  /* Typographie dimension */
  line-height: var(--taille-m);
}

td:last-of-type {
  /* Disposition */
  text-align: center;
}

td tfoot {
  /* Typographie fonte */
  font-weight: bold;
  /* Aspect visuel */
  background-color: rgb(var(--gris-clair-rvb));
}

td a {
  display: inline-block;
}

tfoot,
thead {
  /* Aspect visuel */
  background-color: rgba(var(--gris-clair-rvb), var(--alpha-100));
}

tfoot th {
  /* disponsition */
  text-align: right;
  /* Aspect visuel */
  background-color: rgb(var(--gris-clair-rvb));
}

thead th {
  /* Aspect visuel */
  background-color: rgb(var(--gris-sombre-rvb));
  /* Typographie fonte */
  font-weight: bold;
  /* Typographie couleur */
  color: rgb(var(--jaune-rvb));
}

tr {
  /* Disposition */
  display: table-row;
}

tr:nth-child(2n) td {
  /* Aspect visuel */
  border-block-end: var(--lisere) solid rgb(var(--noir-rvb));
}

table#definition,
.presentation > table {
  /* Disposition */
  table-layout: fixed;
  /* Taille */
  inline-size: 100%;
}

table#definition thead th:first-of-type,
table#definition tbody th,
.presentation > table thead th:first-of-type,
.presentation > table tbody th {
  /* Taille */
  inline-size: auto;
}

table#definition thead th:last-of-type,
table#definition tbody td,
.presentation > table thead th:last-of-type,
.presentation > table tbody td {
  /* Taille */
  inline-size: 70%;
}

table#definition th,
table#definition td,
.presentation > table th,
.presentation > table td  {
  /* Disposition */
  text-align: left;
}

textarea {
  /* Disposition */
  resize: none;
  /* Typographie débordement et troncature*/
  white-space: pre-wrap;
  /* Taille */
  max-inline-size: 100%;
}

ul li {
  /* Aspect visuel */
  list-style-type: none;
}

/* link : style pour les éléments de menu non visités */
/* visited : style pour les éléments de menu visités */
ul li a:link,
ul li a:visited {
  /* Typographie fonte */
  text-decoration: none;
  /* Typographie couleur */
  color: rgba(var(--gris-clair-rvb));
}

/* active: style pour les éléments de menu lorsqu'ils sont cliqués */
/* hover: style pour les éléments de menu lorsqu'ils sont survolé */
ul li a:hover,
ul li a:active {
  /* Typographie fonte */
  text-decoration: none;
  /* Typographie couleur */
  color: rgba(var(--blanc-rvb));
}

ul.cesure-brute {
  /* Typographie débordement et troncature */
  overflow-wrap: anywhere;
}

ul.style-francais {
  /* Espacement */
  padding-inline-start: 0;
  /* Typographie dimension */
  line-height: calc(var(--interligne) * 1.2);
  /* Aspect visuel */
  list-style-type: none;
}

ul.style-francais a:link {
  /* Typographie fonte */
  text-decoration: none;
}

ul.style-francais li {
  /* Espacement */
  padding-inline-start: 2.5em;
  text-indent: -1.5em;
}

ul.style-francais li::before {
  /* Typographie contenu */
  content: "–\2009";
}

ul.style-francais li::after {
  /* Typographie contenu */
  content: "\00A0;";
}

ul.style-francais li:last-child::after {
  /* Typographie contenu */
  content: ".";
}

video {
  /* Disposition */
  display: block;
  /* Taille */
  inline-size: 100%;
  block-size: auto;
  /* Espacement */
  margin: 0;
  padding: 0;
  /* Aspect visuel */
  object-fit: cover;
}

[itemprop="headline"] {
  /* Typographie fonte */
  font-style: italic;
}

/*----------------------------------------------------|
Identifiants : styles spécifiques à une seule entité. |
------------------------------------------------------|
*/
#academie-francaise {
  /* Disposition */
  text-align: left;
}

#chercher-formulaire {
  /* Aspect visuel */
  background-color: rgba(var(--blanc-rvb), var(--alpha-100));
}

/* Réinitialisation de la saisie */
#chercher-saisie:focus:valid {
  /* Typographie couleur */
  color: inherit;
  /* Aspect visuel */
  background-color: inherit;
}

#commenter,
#connecter,
#connecter-envoyer,
#connecter-genere,
#connecter-recevoir,
#connecter-selection {
  /* Disposition */
  display: block;
  /* Espacement */
  margin-block-start: var(--interbloc);
}

/* Contacter Le Corrigeur */
#contact {
  /* Espacement */
  padding: 0;
  /* Aspect visuel */
  background-color: transparent;
  /* Animation et transition */
  transition: background-color 0.3s ease-in-out, padding 0.3s ease-in-out;
}

#contact:hover.fond-rouge-30 {
  background-color: rgba(var(--rouge-rvb), var(--alpha-30));
}
#contact:hover.fond-orange-30 {
  background-color: rgba(var(--orange-rvb), var(--alpha-30));
}
#contact:hover.fond-jaune-30 {
  background-color: rgba(var(--jaune-rvb), var(--alpha-30));
}
#contact:hover.fond-vert-30 {
  background-color: rgba(var(--vert-rvb), var(--alpha-30));
}
#contact:hover.fond-bleu-vert-30 {
  background-color: rgba(var(--bleu-vert-rvb), var(--alpha-30));
}
#contact:hover.fond-bleu-clair-30 {
  background-color: rgba(var(--bleu-clair-rvb), var(--alpha-30));
}
#contact:hover.fond-bleu-sombre-30 {
  background-color: rgba(var(--bleu-sombre-rvb), var(--alpha-30));
}
#contact:hover.fond-violet-30 {
  background-color: rgba(var(--violet-rvb), var(--alpha-30));
}
#contact:hover.fond-rose-30 {
  background-color: rgba(var(--rose-rvb), var(--alpha-30));
}
#contact:hover.fond-pourpre-30 {
  background-color: rgba(var(--pourpre-rvb), var(--alpha-30));
}

#contact:hover.fond-rouge-30,
#contact:hover.fond-orange-30,
#contact:hover.fond-jaune-30,
#contact:hover.fond-vert-30,
#contact:hover.fond-bleu-vert-30,
#contact:hover.fond-rose-30,
#contact:hover.fond-bleu-clair-30,
#contact:hover.fond-bleu-sombre-30,
#contact:hover.fond-violet-30,
#contact:hover.fond-pourpre-30 {
  /* Espacement */
  padding: var(--rembourrage);
  /* Taille */
  inline-size: 100%;
}

/* Texte Blanc cassé alpha 100 Fond spécifique alpha 90 */
#commenter {
  color: rgba(var(--blanc-casse-rvb), var(--alpha-100));
  background-color: rgba(var(--bleu-clair-rvb), var(--alpha-90));
}
#connecter {
  color: rgba(var(--blanc-casse-rvb), var(--alpha-100));
  background-color: rgba(var(--bleu-sombre-rvb), var(--alpha-90));
}

/* Texte blanc hover alpha 100 Fond spécifique hover alpha 100 */
#commenter:hover {
  color: rgba(var(--blanc-rvb), var(--alpha-100));
  background-color: rgba(var(--bleu-clair-rvb), var(--alpha-100));
}
#connecter:hover {
  color: rgba(var(--blanc-rvb), var(--alpha-100));
  background-color: rgba(var(--bleu-sombre-rvb), var(--alpha-100));
}

/* Texte blanc active alpha 100 Fond spécifique active alpha 100 */
#commenter:active {
  color: rgba(var(--blanc-rvb), var(--alpha-100));
  background-color: rgba(var(--bleu-clair-rvb), var(--alpha-100));
}
#connecter:active {
  color: rgba(var(--blanc-rvb), var(--alpha-100));
  background-color: rgba(var(--bleu-sombre-rvb), var(--alpha-100));
}

/* Texte Blanc cassé alpha 100 */
#acheter .bouton,
#acheter-panier .bouton,
#corriger .bouton,
#composer .bouton,
#editer .bouton,
#illustrer .bouton,
#publier .bouton,
#sublimer .bouton,
#transfert-panier .bouton {
  /* Typographie couleur */
  color: rgba(var(--blanc-casse-rvb), var(--alpha-100));
}

/* Texte blanc hover alpha 100 */
#acheter .bouton:hover,
#acheter-panier .bouton:hover,
#corriger .bouton:hover,
#composer .bouton:hover,
#editer .bouton:hover,
#illustrer .bouton:hover,
#publier .bouton:hover,
#sublimer .bouton:hover,
#transfert-panier .bouton:hover {
  /* Typographie couleur */
  color: rgba(var(--blanc-rvb), var(--alpha-100));
}

/* Texte blanc active alpha 100 */
#acheter .bouton:active,
#acheter-panier .bouton:active,
#corriger .bouton:active,
#composer .bouton:active,
#editer .bouton:active,
#illustrer .bouton:active,
#publier .bouton:active,
#sublimer .bouton:active,
#transfert-panier .bouton:active {
  /* Typographie couleur */
  color: rgba(var(--blanc-rvb), var(--alpha-100));
}

/* Fond spécifique alpha 90 */
#acheter .bouton {
  background-color: rgba(var(--violet-rvb), var(--alpha-90));
}
#acheter-panier .bouton {
  background-color: rgba(var(--violet-rvb), var(--alpha-90));
}
#corriger .bouton {
  background-color: rgba(var(--rouge-rvb), var(--alpha-90));
}
#composer .bouton {
  background-color: rgba(var(--jaune-rvb), var(--alpha-90));
}
#editer .bouton {
  background-color: rgba(var(--bleu-vert-rvb), var(--alpha-90));
}
#illustrer .bouton {
  background-color: rgba(var(--vert-rvb), var(--alpha-90));
}
#publier .bouton {
  background-color: rgba(var(--rose-rvb), var(--alpha-90));
}
#sublimer .bouton {
  background-color: rgba(var(--orange-rvb), var(--alpha-90));
}
#transfert-panier .bouton {
  background-color: rgba(var(--violet-rvb), var(--alpha-90));
}

/* Fond spécifique hover alpha 100 */
#acheter .bouton:hover {
  background-color: rgba(var(--violet-rvb), var(--alpha-100));
}
#acheter-panier .bouton:hover {
  background-color: rgba(var(--violet-rvb), var(--alpha-100));
}
#corriger .bouton:hover {
  background-color: rgba(var(--rouge-rvb), var(--alpha-100));
}
#composer .bouton:hover {
  background-color: rgba(var(--jaune-rvb), var(--alpha-100));
}
#editer .bouton:hover {
  background-color: rgba(var(--bleu-vert-rvb), var(--alpha-100));
}
#illustrer .bouton:hover {
  background-color: rgba(var(--vert-rvb), var(--alpha-100));
}
#publier .bouton:hover {
  background-color: rgba(var(--rose-rvb), var(--alpha-100));
}
#sublimer .bouton:hover {
  background-color: rgba(var(--orange-rvb), var(--alpha-100));
}
#transfert-panier .bouton:hover {
  background-color: rgba(var(--violet-rvb), var(--alpha-100));
}

/* Fond spécifique active alpha 100 */
#acheter .bouton:active {
  background-color: rgba(var(--violet-rvb), var(--alpha-100));
}
#acheter-panier .bouton:active {
  background-color: rgba(var(--violet-rvb), var(--alpha-100));
}
#corriger .bouton:active {
  background-color: rgba(var(--rouge-rvb), var(--alpha-100));
}
#composer .bouton:active {
  background-color: rgba(var(--jaune-rvb), var(--alpha-100));
}
#editer .bouton:active {
  background-color: rgba(var(--bleu-vert-rvb), var(--alpha-100));
}
#illustrer .bouton:active {
  background-color: rgba(var(--vert-rvb), var(--alpha-100));
}
#publier .bouton:active {
  background-color: rgba(var(--rose-rvb), var(--alpha-100));
}
#sublimer .bouton:active {
  background-color: rgba(var(--orange-rvb), var(--alpha-100));
}
#transfert-panier .bouton:active {
  background-color: rgba(var(--violet-rvb), var(--alpha-100));
}

/* Fond spécifique hover alpha 30 */
#corriger .prestation-titre:hover {
  background-color: rgba(var(--rouge-rvb), var(--alpha-30));
}
#composer .prestation-titre:hover {
  background-color: rgba(var(--jaune-rvb), var(--alpha-30));
}
#editer .prestation-titre:hover {
  background-color: rgba(var(--bleu-vert-rvb), var(--alpha-30));
}
#illustrer .prestation-titre:hover {
  background-color: rgba(var(--vert-rvb), var(--alpha-30));
}
#publier .prestation-titre:hover {
  background-color: rgba(var(--rose-rvb), var(--alpha-30));
}
#sublimer .prestation-titre:hover {
  background-color: rgba(var(--orange-rvb), var(--alpha-30));
}

#corriger a:hover {
  color: rgba(var(--rouge-rvb), var(--alpha-100));
}
#composer a:hover {
  color: rgba(var(--jaune-rvb), var(--alpha-100));
}
#editer a:hover {
  color: rgba(var(--bleu-vert-rvb), var(--alpha-100));
}
#illustrer a:hover {
  color: rgba(var(--vert-rvb), var(--alpha-100));
}
#publier a:hover {
  color: rgba(var(--rose-rvb), var(--alpha-100));
}
#sublimer a:hover {
  color: rgba(var(--orange-rvb), var(--alpha-100));
}

/* Logotype gris affiché lorsqu’il n’est pas survolé */
#entreprise-amazon                              .image-normale,
#entreprise-banque-populaire                    .image-normale,
#entreprise-books-on-demand                     .image-normale,
#entreprise-carre-des-arts                      .image-normale,
#entreprise-chapitre                            .image-normale,
#entreprise-dunod                               .image-normale,
#entreprise-fnac                                .image-normale,
#entreprise-formations-piscine                  .image-normale,
#entreprise-hachette-livre                      .image-normale,
#entreprise-ibooks                              .image-normale,
#entreprise-ordre-des-avocats-grenoble          .image-normale,
#entreprise-the-books-edition                   .image-normale,
#entreprise-ibooks                              .image-normale,
#entreprise-ulule                               .image-normale,
#entreprise-universite-evry                     .image-normale,
#entreprise-universite-paris-dauphine           .image-normale,
#entreprise-universite-paris-sorbonne           .image-normale,
#entreprise-universite-technologie-troyes       .image-normale,
#entreprise-vie-et-sante                        .image-normale,
/* Logotype coloré visible lorsqu’il est survolé */
#entreprise-amazon:hover                        .image-survol,
#entreprise-banque-populaire:hover              .image-survol,
#entreprise-books-on-demand:hover               .image-survol,
#entreprise-carre-des-arts:hover                .image-survol,
#entreprise-chapitre:hover                      .image-survol,
#entreprise-dunod:hover                         .image-survol,
#entreprise-fnac:hover                          .image-survol,
#entreprise-formations-piscine:hover            .image-survol,
#entreprise-hachette-livre:hover                .image-survol,
#entreprise-ibooks:hover                        .image-survol,
#entreprise-ordre-des-avocats-grenoble:hover    .image-survol,
#entreprise-the-books-edition:hover             .image-survol,
#entreprise-ibooks:hover                        .image-survol,
#entreprise-ulule:hover                         .image-survol,
#entreprise-universite-evry:hover               .image-survol,
#entreprise-universite-paris-dauphine:hover     .image-survol,
#entreprise-universite-paris-sorbonne:hover     .image-survol,
#entreprise-universite-technologie-troyes:hover .image-survol,
#entreprise-vie-et-sante:hover                  .image-survol {
  /* Disposition */
  display: block;
}
/* Logoytype coloré caché lorsqu’il n’est pas survolé */
#entreprise-amazon                              .image-survol,
#entreprise-banque-populaire                    .image-survol,
#entreprise-books-on-demand                     .image-survol,
#entreprise-carre-des-arts                      .image-survol,
#entreprise-chapitre                            .image-survol,
#entreprise-dunod                               .image-survol,
#entreprise-fnac                                .image-survol,
#entreprise-formations-piscine                  .image-survol,
#entreprise-hachette-livre                      .image-survol,
#entreprise-ibooks                              .image-survol,
#entreprise-ordre-des-avocats-grenoble          .image-survol,
#entreprise-the-books-edition                   .image-survol,
#entreprise-ibooks                              .image-survol,
#entreprise-ulule                               .image-survol,
#entreprise-universite-evry                     .image-survol,
#entreprise-universite-paris-dauphine           .image-survol,
#entreprise-universite-paris-sorbonne           .image-survol,
#entreprise-universite-technologie-troyes       .image-survol,
#entreprise-vie-et-sante                        .image-survol,
/* Logotype gris caché lorsqu’il est survolé */
#entreprise-amazon:hover                        .image-normale,
#entreprise-banque-populaire:hover              .image-normale,
#entreprise-books-on-demand:hover               .image-normale,
#entreprise-carre-des-arts:hover                .image-normale,
#entreprise-chapitre:hover                      .image-normale,
#entreprise-dunod:hover                         .image-normale,
#entreprise-fnac:hover                          .image-normale,
#entreprise-formations-piscine:hover            .image-normale,
#entreprise-hachette-livre:hover                .image-normale,
#entreprise-ibooks:hover                        .image-normale,
#entreprise-ordre-des-avocats-grenoble:hover    .image-normale,
#entreprise-the-books-edition:hover             .image-normale,
#entreprise-ibooks:hover                        .image-normale,
#entreprise-ulule:hover                         .image-normale,
#entreprise-universite-evry:hover               .image-normale,
#entreprise-universite-paris-dauphine:hover     .image-normale,
#entreprise-universite-paris-sorbonne:hover     .image-normale,
#entreprise-universite-technologie-troyes:hover .image-normale,
#entreprise-vie-et-sante:hover                  .image-normale {
  /* Disposition */
  display: none;
}

/* Expertise rouge visible par défaut */
/* Intégrité */
#expertise-corriger-integrite-fonte                   .image-normale,
#expertise-corriger-integrite-image                   .image-normale,
#expertise-corriger-integrite-langue                  .image-normale,
#expertise-corriger-integrite-tableau                 .image-normale,
#expertise-corriger-integrite-espacement              .image-normale,
#expertise-corriger-integrite-style-caractere         .image-normale,
#expertise-corriger-integrite-citation                .image-normale,
#expertise-corriger-integrite-dialogue                .image-normale,
/* Lecture */
#expertise-corriger-lecture-chapitrage                .image-normale,
#expertise-corriger-lecture-affeterie                 .image-normale,
#expertise-corriger-lecture-phrase                    .image-normale,
#expertise-corriger-lecture-scenographie              .image-normale,
#expertise-corriger-lecture-replique                  .image-normale,
#expertise-corriger-lecture-registre                  .image-normale,
#expertise-corriger-lecture-narrativisation           .image-normale,
#expertise-corriger-lecture-charabia                  .image-normale,
/* Regroupement */
#expertise-corriger-typologie-cacographie             .image-normale,
#expertise-corriger-typologie-diacritique             .image-normale,
#expertise-corriger-typologie-discordance             .image-normale,
#expertise-corriger-typologie-homophonie              .image-normale,
#expertise-corriger-typologie-rectification           .image-normale,
#expertise-corriger-typologie-casse                   .image-normale,
#expertise-corriger-typologie-jonction                .image-normale,
#expertise-corriger-typologie-omission                .image-normale,

/* Expertise verte visible lorsqu’elle est survolée */
/* Intégrité */
#expertise-corriger-integrite-fonte:hover             .image-survol,
#expertise-corriger-integrite-image:hover             .image-survol,
#expertise-corriger-integrite-langue:hover            .image-survol,
#expertise-corriger-integrite-tableau:hover           .image-survol,
#expertise-corriger-integrite-espacement:hover        .image-survol,
#expertise-corriger-integrite-style-caractere:hover   .image-survol,
#expertise-corriger-integrite-citation:hover          .image-survol,
#expertise-corriger-integrite-dialogue:hover          .image-survol,
/* Lecture */
#expertise-corriger-lecture-chapitrage:hover          .image-survol,
#expertise-corriger-lecture-affeterie:hover           .image-survol,
#expertise-corriger-lecture-phrase:hover              .image-survol,
#expertise-corriger-lecture-scenographie:hover        .image-survol,
#expertise-corriger-lecture-replique:hover            .image-survol,
#expertise-corriger-lecture-registre:hover            .image-survol,
#expertise-corriger-lecture-narrativisation:hover     .image-survol,
#expertise-corriger-lecture-charabia:hover            .image-survol,
/* Regroupement */
#expertise-corriger-typologie-cacographie:hover       .image-survol,
#expertise-corriger-typologie-diacritique:hover       .image-survol,
#expertise-corriger-typologie-discordance:hover       .image-survol,
#expertise-corriger-typologie-homophonie:hover        .image-survol,
#expertise-corriger-typologie-rectification:hover     .image-survol,
#expertise-corriger-typologie-casse:hover             .image-survol,
#expertise-corriger-typologie-jonction:hover          .image-survol,
#expertise-corriger-typologie-omission:hover          .image-survol {
  /* Disposition */
  display: block;
}

/* Expertise rouge cachée */
/* Intégrité */
#expertise-corriger-integrite-fonte                   .image-survol,
#expertise-corriger-integrite-image                   .image-survol,
#expertise-corriger-integrite-langue                  .image-survol,
#expertise-corriger-integrite-tableau                 .image-survol,
#expertise-corriger-integrite-espacement              .image-survol,
#expertise-corriger-integrite-style-caractere         .image-survol,
#expertise-corriger-integrite-citation                .image-survol,
#expertise-corriger-integrite-dialogue                .image-survol,
/* Lecture */
#expertise-corriger-lecture-chapitrage                .image-survol,
#expertise-corriger-lecture-affeterie                 .image-survol,
#expertise-corriger-lecture-phrase                    .image-survol,
#expertise-corriger-lecture-scenographie              .image-survol,
#expertise-corriger-lecture-replique                  .image-survol,
#expertise-corriger-lecture-registre                  .image-survol,
#expertise-corriger-lecture-narrativisation           .image-survol,
#expertise-corriger-lecture-charabia                  .image-survol,
/* Regroupement */
#expertise-corriger-typologie-cacographie             .image-survol,
#expertise-corriger-typologie-diacritique             .image-survol,
#expertise-corriger-typologie-discordance             .image-survol,
#expertise-corriger-typologie-homophonie              .image-survol,
#expertise-corriger-typologie-rectification           .image-survol,
#expertise-corriger-typologie-casse                   .image-survol,
#expertise-corriger-typologie-jonction                .image-survol,
#expertise-corriger-typologie-omission                .image-survol,

/* Expertise rouge cachée lorsqu'elle est survolée */
/* Intégrité */
#expertise-corriger-integrite-fonte:hover             .image-normale,
#expertise-corriger-integrite-image:hover             .image-normale,
#expertise-corriger-integrite-langue:hover            .image-normale,
#expertise-corriger-integrite-tableau:hover           .image-normale,
#expertise-corriger-integrite-espacement:hover        .image-normale,
#expertise-corriger-integrite-style-caractere:hover   .image-normale,
#expertise-corriger-integrite-citation:hover          .image-normale,
#expertise-corriger-integrite-dialogue:hover          .image-normale,
/* Lecture */
#expertise-corriger-lecture-chapitrage:hover          .image-normale,
#expertise-corriger-lecture-affeterie:hover           .image-normale,
#expertise-corriger-lecture-phrase:hover              .image-normale,
#expertise-corriger-lecture-scenographie:hover        .image-normale,
#expertise-corriger-lecture-replique:hover            .image-normale,
#expertise-corriger-lecture-registre:hover            .image-normale,
#expertise-corriger-lecture-narrativisation:hover     .image-normale,
#expertise-corriger-lecture-charabia:hover            .image-normale,
/* Regroupement */
#expertise-corriger-typologie-cacographie:hover       .image-normale,
#expertise-corriger-typologie-diacritique:hover       .image-normale,
#expertise-corriger-typologie-discordance:hover       .image-normale,
#expertise-corriger-typologie-homophonie:hover        .image-normale,
#expertise-corriger-typologie-rectification:hover     .image-normale,
#expertise-corriger-typologie-casse:hover             .image-normale,
#expertise-corriger-typologie-jonction:hover          .image-normale,
#expertise-corriger-typologie-omission:hover          .image-normale {
  /* Disposition */
  display: none;
}

#explication-modale,
#explication-pseudonyme,
#explication-site-nom {
  /* Disposition */
  display: none;
}

#minuteur {
  /* Disposition */
  position: absolute;
  top: 0.45vw;
  left: 1vw;
  /* Espacement */
  padding: var(--rembourrage);
  /* Typographie dimension */
  font-size: 3vw;
  /* Aspect visuel */
  border-radius: var(--courbure);
}

#module-menu-superposition {
  /* Disposition */
  display: none;
  justify-content: center;
  z-index: calc(var(--z-index-navbar) + 1);
  /* Espacement */
  padding: var(--rembourrage);
  /* Taille */
  inline-size: 100%;
  /* Aspect visuel */
  background-color: rgba(var(--noir-rvb), var(--alpha-100));
}

#module-menu-superposition details {
  /* Typographie couleur */
  color: rgba(var(--blanc-rvb), var(--alpha-100));
}

#module-menu-superposition :is(details):where(:focus-within) {
  /* Aspect visuel */
  background-color: rgba(var(--gris-sombre-rvb), var(--alpha-100));
}

#module-menu-superposition h3 {
  /* Typographie couleur */
  color: rgba(var(--jaune-vif-rvb), var(--alpha-100));
}

#module-menu-superposition .superposition-menu {
  /* Disposition */
  display: grid;
}

#navigation-expertiser ul li .menu-item:hover {
  border-block-end: var(--lisere) solid rgba(var(--blanc-rvb), var(--alpha-100));
}
#navigation-corriger ul li .menu-item:hover {
  border-block-end: var(--lisere) solid rgba(var(--rouge-rvb), var(--alpha-100));
}
#navigation-sublimer ul li .menu-item:hover {
  border-block-end: var(--lisere) solid
    rgba(var(--orange-rvb), var(--alpha-100));
}
#navigation-composer ul li .menu-item:hover {
  border-block-end: var(--lisere) solid rgba(var(--jaune-rvb), var(--alpha-100));
}
#navigation-illustrer ul li .menu-item:hover {
  border-block-end: var(--lisere) solid rgba(var(--vert-rvb), var(--alpha-100));
}
#navigation-editer ul li .menu-item:hover {
  border-block-end: var(--lisere) solid
    rgba(var(--bleu-vert-rvb), var(--alpha-100));
}
#navigation-apprendre ul li .menu-item:hover {
  border-block-end: var(--lisere) solid
    rgba(var(--bleu-clair-rvb), var(--alpha-100));
}
#navigation-connecter ul li .menu-item:hover {
  border-block-end: var(--lisere) solid
    rgba(var(--bleu-sombre-rvb), var(--alpha-100));
}
#navigation-acheter ul li .menu-item:hover {
  border-block-end: var(--lisere) solid
    rgba(var(--violet-rvb), var(--alpha-100));
}
#navigation-publier ul li .menu-item:hover {
  border-block-end: var(--lisere) solid rgba(var(--rose-rvb), var(--alpha-100));
}
#navigation-cabinet ul li .menu-item:hover {
  border-block-end: var(--lisere) solid
    rgba(var(--pourpre-rvb), var(--alpha-100));
}

#navigation-expertiser ul li .menu-item-acheter:hover,
#navigation-corriger ul li .menu-item-acheter:hover,
#navigation-sublimer ul li .menu-item-acheter:hover,
#navigation-composer ul li .menu-item-acheter:hover,
#navigation-illustrer ul li .menu-item-acheter:hover,
#navigation-editer ul li .menu-item-acheter:hover,
#navigation-apprendre ul li .menu-item-acheter:hover,
#navigation-connecter ul li .menu-item-acheter:hover,
#navigation-acheter ul li .menu-item-acheter:hover,
#navigation-publier ul li .menu-item-acheter:hover,
#navigation-cabinet ul li .menu-item-acheter:hover {
  /* Typographie couleur */
  color: rgba(var(--blanc-rvb), var(--alpha-100));
  /* Aspect visuel */
  background-color: rgba(var(--violet-rvb), var(--alpha-100));
  border-block-end: var(--lisere) solid
    rgba(var(--violet-rvb), var(--alpha-100));
}

#partage-lien {
  /* Aspect visuel */
  cursor: pointer;
}

#pied-auteur {
  /* Taille */
  inline-size: 21rem;
  /* Espacement */
  margin-inline-end: 1rem;
  /* Animation et transition */
  transition: transform 0.3s ease, filter 0.3s ease;
}

#pied-auteur:active,
#pied-auteur:hover {
  /* Aspect visuel */
  filter: brightness(1.05);
  transform: scale(1.095);
}

#publier .prestation-description {
  /* Espacement */
  margin-block-start: 0;
}

#service-publier-auteur {
  /* Taille */
  inline-size: 5rem;
  /* Espacement */
  margin-inline-end: 1rem;
  /* Aspect visuel */
  border-radius: 14% 49% 14% 42%;
}

#toile {
  /* Disposition */
  display: none;
}

/*-----------------------------------------------|
Classes : styles pour des classes réutilisables. |
-------------------------------------------------|
*/
.aligne-centre {
  /* Disposition */
  text-align: center;
}

.aligne-droite {
  /* Disposition */
  text-align: right;
}

.aligne-gauche {
  /* Disposition */
  text-align: left;
}

.aligne-haut {
  /* Disposition */
  align-self: flex-start;
}

.aligne-milieu {
  /* Disposition */
  display: flex;
  align-items: center;
}

.aligne-milieu img,
.aligne-milieu strong {
  /* Espacement */
  margin-inline-end: var(--intermot);
}

.apercu-fichiers {
  /* Espacement */
  margin-inline-end: var(--gouttiere);
}

.bouton {
  /* Disposition */
  display: inline-block;
  text-align: center;
  /* Espacement */
  padding: var(--rembourrage);
  /* Taille */
  min-inline-size: 7rem;
  /* Typographie fonte */
  font-variant: small-caps;
  /* Typographie dimension */
  font-size: larger;
  line-height: 1rem;
  /* Typographie espacement */
  white-space: nowrap;
  /* Typographie couleur */
  color: rgba(var(--gris-moyen-rvb), var(--alpha-100));
  /* Aspect visuel */
  background-color: rgba(var(--gris-clair-rvb), var(--alpha-70));
  border-radius: var(--courbure);
}

/* active: style pour les éléments de menu lorsqu'ils sont cliqués */
/* hover: style pour les éléments de menu lorsqu'ils sont survolé */
.bouton:hover,
.bouton:active {
  /* Typographie fonte */
  text-decoration: none;
  /* Typographie couleur */
  color: rgba(var(--noir-rvb), var(--alpha-100));
}

.bouton.bouton-acheter:hover {
  /* Typographie couleur */
  color: rgba(var(--blanc-rvb), var(--alpha-100));
  /* Aspect visuel */
  background-color: rgba(var(--violet-rvb), var(--alpha-100));
}

.bouton.bouton-modifier {
  /* Disposition */
  display: block;
  /* Espacement */
  margin-inline-start: auto;
  margin-inline-end: auto;
  margin-block-end: 3rem;
  /* Taille */
  inline-size: 12rem;
  /* Typographie couleur */
  color: rgba(var(--gris-clair-rvb), var(--alpha-100));
  /* Aspect visuel */
  background-color: rgba(var(--bleu-sombre-rvb), var(--alpha-90));
}

.bouton.bouton-modifier:hover {
  /* Typographie couleur */
  color: rgba(var(--blanc-rvb), var(--alpha-100));
  /* Aspect visuel */
  background-color: rgba(var(--bleu-sombre-rvb), var(--alpha-100));
}

.bouton-acheter {
  /* Typographie couleur */
  color: rgba(var(--gris-clair-rvb), var(--alpha-100));
  /* Aspect visuel */
  background-color: rgba(var(--violet-rvb), var(--alpha-90));
}

.bouton-afficher {
  /* Disposition */
  flex-grow: 0; /* Empêche le bouton de grandir et le garde à droite */
}

.bouton-animation {
  /* Animation et transition */
  animation: focalisation 14s infinite; /* Animation de 14 secondes qui se répète à l'infini */
}

.bouton-connecter {
  /* Disposition */
  display: inline-block;
  text-align: center;
  /* Espacement */
  padding: var(--rembourrage);
  /* Taille */
  min-inline-size: 7rem;
  /* Typographie fonte */
  font-variant: small-caps;
  /* Typographie dimension */
  font-size: larger;
  line-height: 1rem;
  /* Typographie espacement */
  white-space: nowrap;
  /* Typographie couleir */
  color: rgba(var(--gris-moyen-rvb), var(--alpha-100));
  /* Aspect visuel */
  background-color: rgba(var(--gris-clair-rvb), var(--alpha-70));
  border-radius: var(--courbure);
}

/* Augmentation de la spécificité pour le survol des labels non sélectionnés */
.bouton-connecter input[type="radio"] + label:hover {
  /* Typographie couleur */
  color: rgba(var(--bleu-sombre-rvb), var(--alpha-100));
}

.categorie-anomalie summary {
  /* Espacement */
  padding: calc(var(--rembourrage) / 2) var(--rembourrage);
}

.champ-non-rempli {
  /* Aspect visuel */
  border: 1px solid rgba(var(--rouge-rvb), var(--alpha-100));
}

.chercher-conteneur {
  /* Disposition */
  display: flex;
  align-items: center;
  /* Espacement */
  gap: var(--interbloc);
}

.chercher-conteneur button {
  /* Disposition */
  display: flex;
  align-items: center;
  gap: var(--interbloc);
  /* Espacement */
  padding: var(--rembourrage);
  /* Aspect visuel */
  border: none;
  cursor: pointer;
}

.chercher-conteneur button[type="submit"] {
  /* Typographie couleur */
  color: rgba(var(--bleu-vert-rvb), var(--alpha-70));
  /* Aspect visuel */
  background-color: transparent;
}

.chercher-conteneur button[type="submit"]:hover {
  /* Typographie couleur */
  color: rgba(var(--bleu-vert-rvb), var(--alpha-100));
  /* Aspect visuel */
  background-color: transparent;
}

.chercher-conteneur .chercher-effacer {
  /* Typographie couleur */
  color: rgba(var(--bleu-vert-rvb), var(--alpha-70));
  /* Aspect visuel */
  background-color: transparent;
}

.chercher-conteneur .chercher-effacer:hover {
  /* Typographie couleur */
  color: rgba(var(--rouge-rvb), var(--alpha-100));
  /* Aspect visuel */
  background-color: transparent;
}

.chercher-conteneur input[type="text"] {
  /* Disposition */
  flex: 1;
  /* Espacement */
  padding: var(--rembourrage);
}

.colonne-absence {
  /* Disposition */
  grid-area: entete;
  display: flex;
  justify-content: center;
  align-items: center;
  /* Taille */
  inline-size: 100%;
}

/* Colonne double dans une ligne
   padding permet d’aérer les modules
   margin-block calcule la hauteur de la colonne en fonction de l'espace disponible dans la ligne et du nombre de colonnes */
.colonne-bicephale {
  /* Espacement */
  padding: var(--rembourrage) 0;
  margin-block: var(--interbloc);
}

.colonne-bicephale h1 {
  /* Disposition */
  text-align: left;
}

.colonne-bicephale.texte-droite.texte-important,
.colonne-bicephale.texte-gauche.texte-important {
  /* Espacement */
  padding-block-start: 0;
}

.colonne-centrage {
  /* Disposition */
  display: flex;
  justify-content: center;
  align-items: center;
}

.colonne-principale {
  /* Disposition */
  display: block;
  justify-content: space-between;
}

.colonne-principale.livres {
  /* Disposition */
  grid-template-columns: repeat(var(--livre-nombre), 1fr);
}

.colonne-principale.vignettes {
  /* Disposition */
  grid-template-columns: repeat(var(--vignette-nombre), 1fr);
}

.colonne-principale.livres,
.colonne-principale.vignettes {
  /* Disposition */
  display: grid;
  gap: var(--gouttiere);
}

.colonne-principale.livres article.vignette,
.colonne-principale.vignettes article.vignette {
  /* Disposition */
  position: relative; /* Imposer une position realtive à l’article */
}

.colonne-principale.livres article.vignette img,
.colonne-principale.vignettes article.vignette img {
  /* Taille */
  inline-size: 100%;
  block-size: auto;
}

.contenu-interbloc {
  /* Espacement */
  margin: var(--interbloc) 0;
}

.contenu-rembourrage {
  /* Espacement */
  padding: var(--rembourrage);
}

/* Couleur particulière 100 */
.couleur-blanc {
  color: rgba(var(--blanc-rvb), var(--alpha-100));
  fill: currentColor;
}
.couleur-blanc-casse {
  color: rgba(var(--blanc-casse-rvb), var(--alpha-100));
  fill: currentColor;
}
.couleur-gris-clair {
  color: rgba(var(--gris-clair-rvb), var(--alpha-100));
  fill: currentColor;
}
.couleur-gris-moyen {
  color: rgba(var(--gris-moyen-rvb), var(--alpha-100));
  fill: currentColor;
}
.couleur-gris-sombre {
  color: rgba(var(--gris-sombre-rvb), var(--alpha-100));
  fill: currentColor;
}
.couleur-noir {
  color: rgba(var(--noir-rvb), var(--alpha-100));
  fill: currentColor;
}
.couleur-rouge {
  color: rgba(var(--rouge-rvb), var(--alpha-100));
  fill: currentColor;
}
.couleur-orange {
  color: rgba(var(--orange-rvb), var(--alpha-100));
  fill: currentColor;
}
.couleur-jaune {
  color: rgba(var(--jaune-rvb), var(--alpha-100));
  fill: currentColor;
}
.couleur-jaune-moutarde {
  color: rgba(var(--jaune-moutarde-rvb), var(--alpha-100));
  fill: currentColor;
}
.couleur-jaune-orange {
  color: rgba(var(--jaune-orange-rvb), var(--alpha-100));
  fill: currentColor;
}
.couleur-jaune-serin {
  color: rgba(var(--jaune-serin-rvb), var(--alpha-100));
  fill: currentColor;
}
.couleur-vert {
  color: rgba(var(--vert-rvb), var(--alpha-100));
  fill: currentColor;
}
.couleur-vert-academie {
  color: rgba(var(--vert-academie-rvb), var(--alpha-100));
  fill: currentColor;
}
.couleur-bleu-vert {
  color: rgba(var(--bleu-vert-rvb), var(--alpha-100));
  fill: currentColor;
}
.couleur-bleu-clair {
  color: rgba(var(--bleu-clair-rvb), var(--alpha-100));
  fill: currentColor;
}
.couleur-bleu-sombre {
  color: rgba(var(--bleu-sombre-rvb), var(--alpha-100));
  fill: currentColor;
}
.couleur-pourpre {
  color: rgba(var(--pourpre-rvb), var(--alpha-100));
  fill: currentColor;
}
.couleur-violet {
  color: rgba(var(--violet-rvb), var(--alpha-100));
  fill: currentColor;
}
.couleur-rose {
  color: rgba(var(--rose-rvb), var(--alpha-100));
  fill: currentColor;
}

/* Couleur particulière 70 */
.couleur-blanc-70 {
  color: rgba(var(--blanc-rvb), var(--alpha-100));
  fill: currentColor;
}
.couleur-blanc-casse-70 {
  color: rgba(var(--blanc-casse-rvb), var(--alpha-70));
  fill: currentColor;
}
.couleur-gris-clair-70 {
  background-color: rgba(var(--gris-clair-rvb), var(--alpha-70));
  color: rgba(var(--gris-moyen-rvb), var(--alpha-100));
  fill: currentColor;
}
.couleur-gris-moyen-70 {
  color: rgba(var(--gris-moyen-rvb), var(--alpha-100));
  fill: currentColor;
}
.couleur-gris-sombre-70 {
  color: rgba(var(--gris-sombre-rvb), var(--alpha-100));
  fill: currentColor;
}
.couleur-noir-70 {
  color: rgba(var(--noir-rvb), var(--alpha-100));
  fill: currentColor;
}
.couleur-rouge-70 {
  color: rgba(var(--rouge-rvb), var(--alpha-100));
  fill: currentColor;
}
.couleur-orange-70 {
  color: rgba(var(--orange-rvb), var(--alpha-100));
  fill: currentColor;
}
.couleur-jaune-70 {
  color: rgba(var(--jaune-rvb), var(--alpha-100));
  fill: currentColor;
}
.couleur-jaune-moutarde-70 {
  color: rgba(var(--jaune-moutarde-rvb), var(--alpha-100));
  fill: currentColor;
}
.couleur-jaune-orange-70 {
  color: rgba(var(--jaune-orange-rvb), var(--alpha-100));
  fill: currentColor;
}
.couleur-jaune-serin-70 {
  color: rgba(var(--jaune-serin-rvb), var(--alpha-100));
  fill: currentColor;
}
.couleur-vert-70 {
  color: rgba(var(--vert-rvb), var(--alpha-100));
  fill: currentColor;
}
.couleur-vert-academie-70 {
  color: rgba(var(--vert-academie-rvb), var(--alpha-100));
  fill: currentColor;
}
.couleur-bleu-vert-70 {
  color: rgba(var(--bleu-vert-rvb), var(--alpha-100));
  fill: currentColor;
}
.couleur-bleu-clair-70 {
  color: rgba(var(--bleu-clair-rvb), var(--alpha-100));
  fill: currentColor;
}
.couleur-bleu-sombre-70 {
  color: rgba(var(--bleu-sombre-rvb), var(--alpha-100));
  fill: currentColor;
}
.couleur-pourpre-70 {
  color: rgba(var(--pourpre-rvb), var(--alpha-100));
  fill: currentColor;
}
.couleur-violet-70 {
  color: rgba(var(--violet-rvb), var(--alpha-70));
  fill: currentColor;
}
.couleur-rose-70 {
  color: rgba(var(--rose-rvb), var(--alpha-100));
  fill: currentColor;
}

/* Couleur particulière 30 */
.couleur-blanc-30 {
  color: rgba(var(--blanc-rvb), var(--alpha-100));
  fill: currentColor;
}
.couleur-blanc-casse-30 {
  color: rgba(var(--blanc-casse-rvb), var(--alpha-30));
  fill: currentColor;
}
.couleur-gris-clair-30 {
  background-color: rgba(var(--gris-clair-rvb), var(--alpha-30));
  color: rgba(var(--gris-moyen-rvb), var(--alpha-100));
  fill: currentColor;
}
.couleur-gris-moyen-30 {
  color: rgba(var(--gris-moyen-rvb), var(--alpha-100));
  fill: currentColor;
}
.couleur-gris-sombre-30 {
  color: rgba(var(--gris-sombre-rvb), var(--alpha-100));
  fill: currentColor;
}
.couleur-noir-30 {
  color: rgba(var(--noir-rvb), var(--alpha-100));
  fill: currentColor;
}
.couleur-rouge-30 {
  color: rgba(var(--rouge-rvb), var(--alpha-100));
  fill: currentColor;
}
.couleur-orange-30 {
  color: rgba(var(--orange-rvb), var(--alpha-100));
  fill: currentColor;
}
.couleur-jaune-30 {
  color: rgba(var(--jaune-rvb), var(--alpha-100));
  fill: currentColor;
}
.couleur-jaune-moutarde-30 {
  color: rgba(var(--jaune-moutarde-rvb), var(--alpha-100));
  fill: currentColor;
}
.couleur-jaune-orange-30 {
  color: rgba(var(--jaune-orange-rvb), var(--alpha-100));
  fill: currentColor;
}
.couleur-jaune-serin-30 {
  color: rgba(var(--jaune-serin-rvb), var(--alpha-100));
  fill: currentColor;
}
.couleur-vert-30 {
  color: rgba(var(--vert-rvb), var(--alpha-100));
  fill: currentColor;
}
.couleur-vert-academie-30 {
  color: rgba(var(--vert-academie-rvb), var(--alpha-100));
  fill: currentColor;
}
.couleur-bleu-vert-30 {
  color: rgba(var(--bleu-vert-rvb), var(--alpha-100));
  fill: currentColor;
}
.couleur-bleu-clair-30 {
  color: rgba(var(--bleu-clair-rvb), var(--alpha-100));
  fill: currentColor;
}
.couleur-bleu-sombre-30 {
  color: rgba(var(--bleu-sombre-rvb), var(--alpha-100));
  fill: currentColor;
}
.couleur-pourpre-30 {
  color: rgba(var(--pourpre-rvb), var(--alpha-100));
  fill: currentColor;
}
.couleur-violet-30 {
  color: rgba(var(--violet-rvb), var(--alpha-30));
  fill: currentColor;
}
.couleur-rose-30 {
  color: rgba(var(--rose-rvb), var(--alpha-100));
  fill: currentColor;
}

.contenu-modal {
  /* Disposition */
  text-align: left;
  /* Espacement */
  margin: auto;
  padding: var(--rembourrage);
}

.contenu-modal img,
.contenu-modal button {
  /* Disposition */
  display: block;
  /* Taille */
  inline-size: 33%;
  block-size: auto;
  max-block-size: 33vh;
  /* Espacement */
  margin: 0 auto;
}

.contenu-modal button {
  /* Espacement */
  margin-block-start: 1.5rem;
}

.credit-titre,
.fermer {
  /* Disposition */
  display: inline-block;
  vertical-align: middle;
}

.degrade-pourpre-a-jaune {
  background-image: linear-gradient(
    70deg,
    rgba(var(--pourpre-rvb), var(--alpha-100)) 0%,
    rgba(var(--rouge-rvb), var(--alpha-100)) 14%,
    rgba(var(--orange-rvb), var(--alpha-100)) 28%,
    rgba(var(--jaune-rvb), var(--alpha-100)) 100%
  );
}
.degrade-violet-a-vert {
  background-image: linear-gradient(
    70deg,
    rgba(var(--violet-rvb), var(--alpha-100)) 0%,
    rgba(var(--bleu-clair-rvb), var(--alpha-100)) 14%,
    rgba(var(--bleu-vert-rvb), var(--alpha-100)) 28%,
    rgba(var(--vert-rvb), var(--alpha-100))
  );
}
.degrade-rouge-orange {
  background-image: linear-gradient(
    70deg,
    rgba(var(--rouge-rvb), var(--alpha-100)) 0%,
    rgba(var(--rouge-rvb), var(--alpha-100))
  );
}

.degrade-pourpre-a-jaune,
.degrade-violet-a-vert,
.degrade-rouge-orange {
  /* Espacement */
  margin: 0.7rem 0;
  /* Taille */
  max-inline-size: max-content;
  /* Typographie couleur */
  color: transparent;
  /* Aspect visuel */
  background-clip: text;
  -webkit-background-clip: text;
}

.details-open {
  /* Aspect visuel */
  background-color: rgba(var(--gris-sombre-rvb), var(--alpha-100));
}

.entreprise-colonne {
  /* Disposition */
  display: flex;
  text-align: center;
  /* Taille */
  inline-size: auto;
  /* Espacement */
  gap: 2rem;
}

.entreprise-conteneur,
.prestation-conteneur {
  /* Disposition */
  display: flex;
  flex-direction: column;
  align-items: center;
}

.entreprise-ligne {
  /* Taille */
  inline-size: 28%;
}

.entreprise-ligne,
.prestation-ligne {
  /* Disposition */
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  justify-content: center;
  gap: var(--gouttiere);
  /* Espacement */
  margin-block-end: var(--gouttiere);
}

.etape-ancien,
.etape-nouveau,
.etape-prenom-nom,
.etape-courriel,
.etape-code,
.etape-passe,
.etape-passe-nouveau,
.etape-oubli,
.etape-connecter {
  /* Disposition */
  display: none;
}

/* Remplacement du <blockquote> dans un <dl> */
.etymologie {
  /* Disposition */
  display: block;
  /* Espacement */
  margin-block-start: var(--interligne);
  margin-block-end: var(--interligne);
  margin-inline-start: var(--retrait);
  margin-inline-end: var(--intermot);
  padding: var(--rembourrage);
  /* Aspect visuel */
  background-color: rgba(var(--gris-clair-rvb), var(--alpha-50));
  border-radius: var(--courbure);
}

/* Citation sur une nouvelle ligne, espacée du flux, en italique */
.etymologie cite {
  /* Disposition */
  display: block;
  /* Espacement */
  margin-block-start: var(--interbloc);
  /* Typographie fonte */
  font-style: italic;
}

/* Suppression de la marge par défaut du paragraphe */
.etymologie p {
  margin: 0;
}

.etiquette {
  /* Espacement */
  margin: var(--interbloc) 0;
  padding: var(--rembourrage);
}

.etiquette-conteneur {
  /* Disposition */
  display: grid;
  grid-template-columns: minmax(auto, 7rem) 1fr;
  grid-template-rows: auto;
  /* Espacement */
  gap: var(--gouttiere);
}

.etiquette-definition {
  /* Espacement */
  padding: var(--rembourrage);
}

/* Fontes Fontawesome */
.fa-brands {
  font-family: "Font Awesome 6 Brands";
}
.fa-regular {
  font-family: "Font Awesome 6 Regular";
}
.fa-solid {
  font-family: "Font Awesome 6 Solid";
}

.fa-brands,
.fa-regular,
.fa-solid {
  /* Typographie dimension */
  font-size: 1.5em;
  line-height: 1;
}

/* Zones d’utilisation privée d’Unicode (PUA) */
/* brands */
.fa-brands.amazon::before {
  content: "\f270"; /* Amazon */
}
.fa-brands.bluesky::before {
  content: "\e671"; /* BlueSky */
}
.fa-brands.facebook::before {
  content: "\f39e"; /* Facebook */
}
.fa-brands.instagram::before {
  content: "\f16d"; /* Instagram */
}
.fa-brands.linkedin::before {
  content: "\f0e1"; /* LinkedIn */
}
.fa-brands.thread::before {
  content: "\e618"; /* Thread */
}
.fa-brands.x::before {
  content: "\e61b"; /* X */
}
/* regular */
.fa-regular.courriel::before {
  content: "\f0e0"; /* Courriel */
}
.fa-regular.humeur::before {
  content: "\f164"; /* J’aime */
}
.fa-regular.partage::before {
  content: "\f14d"; /* Partage */
}
.fa-regular.pdf::before {
  content: "\f1c1"; /* PDF Doppio */
}
.fa-regular.reponse::before {
  content: "\f075"; /* Commentaire */
}
/* solid */
.fa-solid.acheter::before {
  content: "\f09d"; /* Acheter */
}
.fa-solid.cabinet::before {
  content: "\f47f"; /* Cabinet */
}
.fa-solid.caddie::before {
  content: "\f07a"; /* Caddie  */
}
.fa-solid.chercher::before {
  content: "\f002"; /* Chercher */
}
.fa-solid.connecter::before {
  content: "\f084"; /* Connecter */
}
.fa-solid.effacer::before {
  content: "\f12d"; /* Effacer */
}
.fa-solid.etiquette::before {
  content: "\f02c"; /* Étiquette */
}
.fa-solid.lien::before {
  content: "\f0c1"; /* Lien */
}
.fa-solid.menu::before {
  content: "\f0c9"; /* Menu */
}
.fa-solid.prix::before {
  content: "\f559"; /* Succès */
}
.fa-solid.tete::before {
  content: "\f714"; /* Tête de mort */
}
.fa-solid.video::before {
  content: "\f008"; /* video */
}
.fa-solid.visibilite-cache::before {
  content: "\f06e"; /* Œil */
}
.fa-solid.visibilite-montre::before {
  content: "\f070"; /* Œil barré */
}

.facture-document a {
  /* Typographie couleur */
  color: rgba(var(--bleu-sombre-rvb), var(--alpha-100));
}

.facture-date,
.facture-numero,
.facture-expertise,
.facture-quantite,
.facture-status,
.facture-document {
  /* Disposition */
  display: flex;
  justify-content: space-between;
}

.facture-historique {
  /* Taille */
  max-inline-size: 700px;
  /* Espacement */
  margin: auto;
  margin-block-end: var(--interligne);
  padding-block-end: var(--rembourrage);
  /* Aspect visuel */
  border-block-end: var(--lisere) solid
    rgba(var(--gris-clair-rvb), var(--alpha-100));
}

.fermer {
  /* Disposition */
  float: right;
  /* Typographie fonte */
  font-size: 1.5rem;
  font-weight: 400;
}

.fermer:focus,
.fermer:hover {
  /* Typographie fonte */
  text-decoration: none;
  /* Typographie couleur */
  color: rgba(var(--rouge-rvb), var(--alpha-100));
  /* Aspect visuel */
  background-color: rgba(var(--gris-clair-rvb), var(--alpha-100));
  cursor: pointer;
}

/* Fond coloré du focus */
.focus-acheter {
  background-color: rgba(var(--violet-rvb), var(--alpha-30));
}
.focus-apprendre {
  background-color: rgba(var(--bleu-clair-rvb), var(--alpha-30));
}
.focus-cabinet {
  background-color: rgba(var(--pourpre-rvb), var(--alpha-30));
}
.focus-composer {
  background-color: rgba(var(--jaune-rvb), var(--alpha-30));
}
.focus-corriger {
  background-color: rgba(var(--rouge-rvb), var(--alpha-30));
}
.focus-editer {
  background-color: rgba(var(--bleu-vert-rvb), var(--alpha-30));
}
.focus-illustrer {
  background-color: rgba(var(--vert-rvb), var(--alpha-30));
}
.focus-publier {
  background-color: rgba(var(--rose-rvb), var(--alpha-30));
}
.focus-se-connecter {
  background-color: rgba(var(--bleu-sombre-rvb), var(--alpha-30));
}
.focus-sublimer {
  background-color: rgba(var(--orange-rvb), var(--alpha-30));
}

/* Rembourrage du focus */
.focus-acheter,
.focus-apprendre,
.focus-cabinet,
.focus-composer,
.focus-corriger,
.focus-editer,
.focus-illustrer,
.focus-publier,
.focus-se-connecter,
.focus-sublimer {
  /* Espacement */
  padding: var(--rembourrage);
  margin-bottom: 2.5rem;
}

/* Mise en petites capitales du focus */
.focus-acheter strong,
.focus-apprendre strong,
.focus-cabinet strong,
.focus-composer strong,
.focus-corriger strong,
.focus-editer strong,
.focus-illustrer strong,
.focus-publier strong,
.focus-se-connecter strong,
.focus-sublimer strong {
  font-variant: small-caps;
}

/* Mise en petites capitales du focus */
.focus-acheter strong {
  color: rgba(var(--violet-rvb), var(--alpha-100));
}
.focus-apprendre strong {
  color: rgba(var(--bleu-clair-rvb), var(--alpha-100));
}
.focus-cabinet strong {
  color: rgba(var(--pourpre-rvb), var(--alpha-100));
}
.focus-composer strong {
  color: rgba(var(--jaune-rvb), var(--alpha-100));
}
.focus-corriger strong {
  color: rgba(var(--rouge-rvb), var(--alpha-100));
}
.focus-editer strong {
  color: rgba(var(--bleu-vert-rvb), var(--alpha-100));
}
.focus-illustrer strong {
  color: rgba(var(--vert-rvb), var(--alpha-100));
}
.focus-publier strong {
  color: rgba(var(--rose-rvb), var(--alpha-100));
}
.focus-se-connecter strong {
  color: rgba(var(--bleu-sombre-rvb), var(--alpha-100));
}
.focus-sublimer strong {
  color: rgba(var(--orange-rvb), var(--alpha-100));
}

/* Fond particulier 30 */
.fond-transparent-30 {
  background-color: rgba(var(--transparent-rvb), var(--alpha-30));
}
.fond-gris-argent-30 {
  background-color: rgba(var(--gris-argent-rvb), var(--alpha-30));
}
.fond-gris-clair-30 {
  background-color: rgba(var(--gris-clair-rvb), var(--alpha-30));
}
.fond-gris-moyen-30 {
  background-color: rgba(var(--gris-moyen-rvb), var(--alpha-30));
}
.fond-gris-sombre-30 {
  background-color: rgba(var(--gris-sombre-rvb), var(--alpha-30));
}
.fond-noir-30 {
  background-color: rgba(var(--noir-rvb), var(--alpha-30));
}
.fond-rouge-30 {
  background-color: rgba(var(--rouge-rvb), var(--alpha-30));
}
.fond-orange-30 {
  background-color: rgba(var(--orange-rvb), var(--alpha-30));
}
.fond-jaune-30 {
  background-color: rgba(var(--jaune-rvb), var(--alpha-30));
}
.fond-jaune-moutarde-30 {
  background-color: rgba(var(--jaune-moutarde-rvb), var(--alpha-30));
}
.fond-jaune-orange-30 {
  background-color: rgba(var(--jaune-orange-rvb), var(--alpha-30));
}
.fond-jaune-serin-30 {
  background-color: rgba(var(--jaune-serin-rvb), var(--alpha-30));
}
.fond-vert-30 {
  background-color: rgba(var(--vert-rvb), var(--alpha-30));
}
.fond-bleu-vert-30 {
  background-color: rgba(var(--bleu-vert-rvb), var(--alpha-30));
}
.fond-vert-academie-30 {
  background-color: rgba(var(--vert-academie-rvb), var(--alpha-30));
}
.fond-bleu-clair-30 {
  background-color: rgba(var(--bleu-clair-rvb), var(--alpha-30));
}
.fond-bleu-sombre-30 {
  background-color: rgba(var(--bleu-sombre-rvb), var(--alpha-30));
}
.fond-pourpre-30 {
  background-color: rgba(var(--pourpre-rvb), var(--alpha-30));
}
.fond-violet-30 {
  background-color: rgba(var(--violet-rvb), var(--alpha-30));
}
.fond-rose-30 {
  background-color: rgba(var(--rose-rvb), var(--alpha-30));
}

/* Fond particulier 70 */
.fond-transparent-70 {
  background-color: rgba(var(--transparent-rvb), var(--alpha-70));
}
.fond-gris-argent-70 {
  background-color: rgba(var(--gris-argent-rvb), var(--alpha-70));
}
.fond-gris-clair-70 {
  background-color: rgba(var(--gris-clair-rvb), var(--alpha-70));
}
.fond-gris-moyen-70 {
  background-color: rgba(var(--gris-moyen-rvb), var(--alpha-70));
}
.fond-gris-sombre-70 {
  background-color: rgba(var(--gris-sombre-rvb), var(--alpha-70));
}
.fond-noir-70 {
  background-color: rgba(var(--noir-rvb), var(--alpha-70));
}
.fond-rouge-70 {
  background-color: rgba(var(--rouge-rvb), var(--alpha-70));
}
.fond-orange-70 {
  background-color: rgba(var(--orange-rvb), var(--alpha-70));
}
.fond-jaune-70 {
  background-color: rgba(var(--jaune-rvb), var(--alpha-70));
}
.fond-jaune-moutarde-70 {
  background-color: rgba(var(--jaune-moutarde-rvb), var(--alpha-70));
}
.fond-jaune-orange-70 {
  background-color: rgba(var(--jaune-orange-rvb), var(--alpha-70));
}
.fond-jaune-serin-70 {
  background-color: rgba(var(--jaune-serin-rvb), var(--alpha-70));
}
.fond-vert-70 {
  background-color: rgba(var(--vert-rvb), var(--alpha-70));
}
.fond-bleu-vert-70 {
  background-color: rgba(var(--bleu-vert-rvb), var(--alpha-70));
}
.fond-vert-academie-70 {
  background-color: rgba(var(--vert-academie-rvb), var(--alpha-70));
}
.fond-bleu-clair-70 {
  background-color: rgba(var(--bleu-clair-rvb), var(--alpha-70));
}
.fond-bleu-sombre-70 {
  background-color: rgba(var(--bleu-sombre-rvb), var(--alpha-70));
}
.fond-pourpre-70 {
  background-color: rgba(var(--pourpre-rvb), var(--alpha-70));
}
.fond-violet-70 {
  background-color: rgba(var(--violet-rvb), var(--alpha-70));
}
.fond-rose-70 {
  background-color: rgba(var(--rose-rvb), var(--alpha-70));
}

/* Fond particulier 100 */
.fond-blanc {
  background-color: rgba(var(--blanc-rvb), var(--alpha-100));
}
.fond-blanc-casse {
  background-color: rgba(var(--blanc-casse-rvb), var(--alpha-100));
}
.fond-gris-argent {
  background-color: rgba(var(--gris-argent-rvb), var(--alpha-100));
}
.fond-gris-clair {
  background-color: rgba(var(--gris-clair-rvb), var(--alpha-100));
}
.fond-gris-moyen {
  background-color: rgba(var(--gris-moyen-rvb), var(--alpha-100));
}
.fond-gris-sombre {
  background-color: rgba(var(--gris-sombre-rvb), var(--alpha-100));
}
.fond-noir {
  background-color: rgba(var(--noir-rvb), var(--alpha-100));
}
.fond-rouge {
  background-color: rgba(var(--rouge-rvb), var(--alpha-100));
}
.fond-orange {
  background-color: rgba(var(--orange-rvb), var(--alpha-100));
}
.fond-jaune {
  background-color: rgba(var(--jaune-rvb), var(--alpha-100));
}
.fond-jaune-moutarde {
  background-color: rgba(var(--jaune-moutarde-rvb), var(--alpha-100));
}
.fond-jaune-orange {
  background-color: rgba(var(--jaune-orange-rvb), var(--alpha-100));
}
.fond-jaune-serin {
  background-color: rgba(var(--jaune-serin-rvb), var(--alpha-100));
}
.fond-vert {
  background-color: rgba(var(--vert-rvb), var(--alpha-100));
}
.fond-bleu-vert {
  background-color: rgba(var(--bleu-vert-rvb), var(--alpha-100));
}
.fond-vert-academie {
  background-color: rgba(var(--vert-academie-rvb), var(--alpha-100));
}
.fond-bleu-clair {
  background-color: rgba(var(--bleu-clair-rvb), var(--alpha-100));
}
.fond-bleu-sombre {
  background-color: rgba(var(--bleu-sombre-rvb), var(--alpha-100));
}
.fond-pourpre {
  background-color: rgba(var(--pourpre-rvb), var(--alpha-100));
}
.fond-violet {
  background-color: rgba(var(--violet-rvb), var(--alpha-100));
}
.fond-rose {
  background-color: rgba(var(--rose-rvb), var(--alpha-100));
}

.fonte-normal {
  font-variant: normal;
}
.fonte-petite {
  font-size: medium;
}
.fonte-petite-majuscule {
  font-variant-caps: small-caps;
}
.fonte-majuscule {
  text-transform: uppercase;
}

/* Icones des prestations en fond de liste de la facturation */
.fond-corriger {
  background-image: url("../svg/icone-corriger.svg");
}
.fond-sublimer {
  background-image: url("../svg/icone-sublimer.svg");
}
.fond-composer {
  background-image: url("../svg/icone-composer.svg");
}
.fond-illustrer {
  background-image: url("../svg/icone-illustrer.svg");
}
.fond-editer {
  background-image: url("../svg/icone-editer.svg");
}

.fond-corriger,
.fond-sublimer,
.fond-composer,
.fond-illustrer,
.fond-editer {
  /* Taille */
  background-size: cover;
  /* Aspect visuel */
  background-repeat: no-repeat;
  background-position: center;
}

.form {
  /* Disposition */
  display: flex;
  flex-direction: column;
  /* Taille */
  inline-size: 100%;
}

.grisage {
  /* Aspect visuel */
  filter: grayscale(91%);
}

.hr-diviseur {
  /* Disposition */
  position: relative;
  overflow: hidden;
  background-position: center;
  /* Taille */
  block-size: 84px;
  background-size: 350px 84px;
  /* Aspect visuel */
  background-color: transparent;
  border: none;
  background-repeat: no-repeat;
}

.hr-noir {
  background-image: url("/svg/diviseur-noir.svg");
}

/* Base du liseré coloré */
.hr-rouge,
.hr-orange,
.hr-jaune,
.hr-vert,
.hr-bleu-vert,
.hr-bleu-clair,
.hr-bleu-sombre,
.hr-violet,
.hr-pourpre,
.hr-rose {
  /* Taille */
  block-size: 0;
  /* Espacement */
  margin: var(--interligne) 0;
  /* Aspect visuel */
  border-block-start: var(--lisere) solid;
}

/* Couleur du liseré */
.hr-rouge {
  border-color: rgba(var(--rouge-rvb), var(--alpha-100));
}
.hr-orange {
  border-color: rgba(var(--orange-rvb), var(--alpha-100));
}
.hr-jaune {
  border-color: rgba(var(--jaune-rvb), var(--alpha-100));
}
.hr-vert {
  border-color: rgba(var(--vert-rvb), var(--alpha-100));
}
.hr-bleu-vert {
  border-color: rgba(var(--bleu-vert-rvb), var(--alpha-100));
}
.hr-bleu-clair {
  border-color: rgba(var(--bleu-clair-rvb), var(--alpha-100));
}
.hr-bleu-sombre {
  border-color: rgba(var(--bleu-sombre-rvb), var(--alpha-100));
}
.hr-bleu-clair {
  border-color: rgba(var(--bleu-clair-rvb), var(--alpha-100));
}
.hr-violet {
  border-color: rgba(var(--violet-rvb), var(--alpha-100));
}
.hr-pourpre {
  border-color: rgba(var(--pourpre-rvb), var(--alpha-100));
}
.hr-rose {
  border-color: rgba(var(--rose-rvb), var(--alpha-100));
}

/* Icône qui remplace le rond de couleur */
.icone-svg {
  position: relative;
}

.icone-svg svg {
  /* Disposition */
  position: absolute;
  left: 0;
  top: 50%;
  /* Autres */
  transform: translateY(-50%);
}

.image {
  /* Disposition */
  position: relative;
  display: inline-block;
}

.image-adaptative {
  /* Disposition */
  display: block;
  /* Taille */
  inline-size: 100%;
  block-size: auto;
}

.image-animation {
  animation: focalisation 35s infinite; /* Animation de 35 secondes qui se répète à l'infini */
}

.image-encadre {
  /* Aspect visuel */
  border: var(--lisere) solid rgba(var(--gris-sombre-rvb), var(--alpha-50));
  border-radius: var(--courbure);
  overflow: hidden;
  position: relative;
}

.image-encadre-haut {
  /* Aspect visuel */
  border: var(--lisere) solid rgba(var(--gris-sombre-rvb), var(--alpha-50));
  border-radius: var(--courbure) var(--courbure) 0 0;
}

.image-legende {
  /* Disposition */
  position: absolute;
  bottom: 0;
  left: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  /* Taille */
  inline-size: -webkit-fill-available; /* Chrome, Safari, Edge et autres navigateurs WebKit */
  inline-size: -moz-available; /* Firefox */
  inline-size: available; /* CSS standard, pour les navigateurs futurs */
  /* Espacement */
  padding: var(--rembourrage);
  /* Typographie fonte */
  font-size: 1.5em;
  /* Typographie couleur */
  color: rgba(var(--blanc-rvb), var(--alpha-100));
  /* Aspect visuel */
  border-radius: 0 0 calc( var(--courbure) * 0.75 ) calc( 0.75 * var(--courbure) );
}

.image-photo {
  /* Taille */
  max-inline-size: 1200px;
  block-size: auto;
}

.image-qr {
  /* Disposition */
  display: block;
  /* Taille */
  inline-size: 33%;
  max-inline-size: 400px;
  block-size: auto;
  max-block-size: 33vh;
  /* Espacement */
  margin: 0 auto;
}

.information-affichage {
  /* Typographie couleur */
  color: rgba(var(--bleu-sombre-rvb), var(--alpha-100));
  /* Aspect visuel */
  background-color: rgba(var(--bleu-clair-rvb), var(--alpha-30));
  border: 1px solid rgba(var(--bleu-sombre-rvb), var(--alpha-100));
}

.input-conteneur {
  /* Disposition */
  display: flex;
  flex-direction: column;
  flex: 1;
  /* Espacement */
  margin-block-end: calc(var(--interbloc) * 2);
}

.input-conteneur label,
.input-conteneur label span {
  /* Taille */
  inline-size: max-content;
  /* Typographie dimension */
  font-size: 1rem;
  /* Espacement */
  margin-block-end: 0rem;
}

.input-conteneur label span {
  /* Taille */
  inline-size: max-content;
  /* Typographie dimension */
  font-size: 0.7rem;
  /* Espacement */
  margin-block-end: 0rem;
}

.input-conteneur:first-child {
  margin-inline-start: 0;
} /* Ajustage de la première marge */
.input-conteneur:not(:last-child) {
  margin-inline-end: var(--gouttiere);
} /* Ajustage l'espacement entre les conteneurs */
.input-conteneur:last-child {
  margin-inline-end: 0;
} /* Ajustage de la dernière marge */

.input-conteneur.connexion-envoyer,
.input-conteneur.connexion-envoyer.connexion-coder {
  /* Disposition */
  display: none;
}

.input-conteneur.connexion-envoyer.visible,
.input-conteneur.connexion-envoyer.connexion-coder.visible {
  /* Disposition */
  display: flex;
}

/* Conversion du nombre xx de caractères d'un input en pourcentage : (xx+2)/38 */
/* La liste compte pour 2 ch déjà ajoutés, le rembourrage pour 2 ch ajoutés ici */
.input-conteneur.pourcentagelargeurtexte04 {
  inline-size: 6ch;
} /* 04 Bâtiment*/
.input-conteneur.pourcentagelargeurtexte05 {
  inline-size: 7ch;
} /* 05 Entrée */
.input-conteneur.pourcentagelargeurtexte06 {
  inline-size: 8.5ch;
} /* 06 Civilité | Numéro */
.input-conteneur.pourcentagelargeurtexte07 {
  inline-size: 9ch;
} /* 07 Statut | Voie  | Suffixe | Type de voie */
.input-conteneur.pourcentagelargeurtexte08 {
  inline-size: 10ch;
} /* 08 Code Postal | Cedex */
.input-conteneur.pourcentagelargeurtexte09 {
  inline-size: 11ch;
} /* 09 Porte */
.input-conteneur.pourcentagelargeurtexte11 {
  inline-size: 13ch;
} /* 11 Suffixe */
.input-conteneur.pourcentagelargeurtexte15 {
  inline-size: 17.6ch;
} /* 15 Prénom | Nom de la voie | Téléphone fixe | Radiotéléphone */
.input-conteneur.pourcentagelargeurtexte18 {
  inline-size: 19.3ch;
} /* 18 Nom */
.input-conteneur.pourcentagelargeurtexte28 {
  inline-size: 30ch;
} /* 28 Lieudit | Ville */
.input-conteneur.pourcentagelargeurtexte30 {
  inline-size: 32ch;
} /* 30 Nom de l’immeuble */
.input-conteneur.pourcentagelargeurtexte33 {
  inline-size: 35ch;
} /* 33 Chez */
.input-conteneur.pourcentagelargeurtexte36 {
  inline-size: 38ch;
} /* 36 Entreprise */
.input-conteneur.pourcentagelargeurtexte46 {
  inline-size: 48ch;
} /* 48 Service entreprise | Pays | Courriel */

.input-ligne {
  /* Disposition */
  display: flex;
  justify-content: space-between;
  align-items: center;
  /* Espacement */
  margin-inline-start: auto;
  margin-inline-end: auto;
  /* Taille */
  max-inline-size: 47.5ch; /* 38 ch + 8 rembourrage + 1,5 interbloc */
}

/* Ajustage de la dernière marge */
.input-ligne input:not(:last-of-type) {
  margin-inline-end: var(--gouttiere);
}

.input-radio {
  /* Disposition */
  text-align: left;
}

/*
************************
Téléversement conteneur
************************
 */
.input-televersement {
  /* Espacement */
  margin-block: calc(var(--interbloc) * 2);
  /* Typographie couleur */
  color: rgba(var(--gris-sombre-rvb), var(--alpha-100));
  /* Aspect visuel */
  border: var(--lisere) solid rgba(var(--gris-moyen-rvb), var(--alpha-100));
  border-radius: 0px;
  background-color: rgba(var(--gris-clair-rvb), var(--alpha-100));
  cursor: pointer;
}

/*
*********************
Téléversement bouton
Chrome, Edge, Firefox
Safari
*********************
 */
.input-televersement::file-selector-button,
.input-televersement::-webkit-file-upload-button {
  /* Espacement */
  margin-inline-end: var(--interbloc);
  padding-block: var(--interbloc);
  /* Typographie couleur */
  color: rgba(var(--blanc-rvb), var(--alpha-90));
  /* Aspect visuel */
  background-color: rgba(var(--bleu-clair-rvb), var(--alpha-90));
  border: none;
  border-radius: var(--courbure);
  cursor: pointer;
}

.input-televersement::file-selector-button:hover,
.input-televersement::-webkit-file-upload-button:hover {
  /* Aspect visuel */
  background-color: rgba(var(--bleu-clair-rvb), var(--alpha-100));
}

.label {
  margin-block-start: calc(var(--interbloc) * 2);
}

.legende-info {
  /* Disposition */
  position: absolute;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  /* Espacement */
  right: var(--interbloc);
  /* Taille */
  inline-size: 1em;
  block-size: 1em;
  /* Typographie dimension */
  font-size: 0.8em;
  /* Aspect visuel */
  border: var(--lisere) solid currentColor;
  border-radius: var(--courbure);
}

.legende-info:hover {
  background-color: rgba(var(--bleu-clair-rvb), var(--alpha-70));
}

p .legende-info {
  /* Disposition */
  position: initial;
  /* Espacement */
  right: 0;
}

.legende-texte {
  /* Disposition */
  text-align: center;
  /* Espacement */
  margin-inline-end: var(--interligne);
}

/* Soulignement des lettrines avec une bordure colorée */
.lettrine-gris-sombre {
  border-block-end: 2px solid rgba(var(--gris-sombre-rvb), var(--alpha-100));
}
.lettrine-rouge {
  border-block-end: 2px solid rgba(var(--rouge-rvb), var(--alpha-100));
}
.lettrine-orange {
  border-block-end: 2px solid rgba(var(--orange-rvb), var(--alpha-100));
}
.lettrine-jaune {
  border-block-end: 2px solid rgba(var(--jaune-rvb), var(--alpha-100));
}
.lettrine-vert {
  border-block-end: 2px solid rgba(var(--vert-rvb), var(--alpha-100));
}
.lettrine-vert-academie {
  border-block-end: 2px solid rgba(var(--vert-academie-rvb), var(--alpha-100));
}
.lettrine-bleu-vert {
  border-block-end: 2px solid rgba(var(--bleu-vert-rvb), var(--alpha-100));
}
.lettrine-bleu-clair {
  border-block-end: 2px solid rgba(var(--bleu-clair-rvb), var(--alpha-100));
}
.lettrine-bleu-sombre {
  border-block-end: 2px solid rgba(var(--bleu-sombre-rvb), var(--alpha-100));
}
.lettrine-violet {
  border-block-end: 2px solid rgba(var(--violet-rvb), var(--alpha-100));
}
.lettrine-pourpre {
  border-block-end: 2px solid rgba(var(--pourpre-rvb), var(--alpha-100));
}
.lettrine-rose {
  border-block-end: 2px solid rgba(var(--rose-rvb), var(--alpha-100));
}

.lettrine-gris-sombre,
.lettrine-rouge,
.lettrine-orange,
.lettrine-jaune,
.lettrine-vert,
.lettrine-vert-academie,
.lettrine-bleu-vert,
.lettrine-bleu-clair,
.lettrine-bleu-sombre,
.lettrine-violet,
.lettrine-pourpre,
.lettrine-rose {
  /* Disposition */
  display: inline-block;
  text-align: left;
  position: relative;
  vertical-align: bottom;
  /* Espacement */
  margin: var(--interligne) 0;
  padding: var(--rembourrage) 0;
  /* Typographie fonte */
  font-weight: 100;
  /* Typographie dimension */
  line-height: 0;
  /* Aspect visuel */
  background-color: transparent;
}

/* Première lettre sur fond colorée */
.lettrine-gris-sombre::first-letter {
  background-color: rgba(var(--gris-sombre-rvb), var(--alpha-100));
  color: rgba(var(--blanc-rvb), var(--alpha-100));
}
.lettrine-rouge::first-letter {
  background-color: rgba(var(--rouge-rvb), var(--alpha-100));
}
.lettrine-orange::first-letter {
  background-color: rgba(var(--orange-rvb), var(--alpha-100));
}
.lettrine-jaune::first-letter {
  background-color: rgba(var(--jaune-rvb), var(--alpha-100));
}
.lettrine-vert::first-letter {
  background-color: rgba(var(--vert-rvb), var(--alpha-100));
}
.lettrine-vert-academie::first-letter {
  background-color: rgba(var(--vert-academie-rvb), var(--alpha-100));
}
.lettrine-bleu-vert::first-letter {
  background-color: rgba(var(--bleu-vert-rvb), var(--alpha-100));
}
.lettrine-bleu-clair::first-letter {
  background-color: rgba(var(--bleu-clair-rvb), var(--alpha-100));
}
.lettrine-bleu-sombre::first-letter {
  background-color: rgba(var(--bleu-sombre-rvb), var(--alpha-100));
}
.lettrine-violet::first-letter {
  background-color: rgba(var(--violet-rvb), var(--alpha-100));
}
.lettrine-pourpre::first-letter {
  background-color: rgba(var(--pourpre-rvb), var(--alpha-100));
}
.lettrine-rose::first-letter {
  background-color: rgba(var(--rose-rvb), var(--alpha-100));
}

.lettrine-gris-sombre::first-letter,
.lettrine-rouge::first-letter,
.lettrine-orange::first-letter,
.lettrine-jaune::first-letter,
.lettrine-vert::first-letter,
.lettrine-vert-academie::first-letter,
.lettrine-bleu-vert::first-letter,
.lettrine-bleu-clair::first-letter,
.lettrine-bleu-sombre::first-letter,
.lettrine-violet::first-letter,
.lettrine-pourpre::first-letter,
.lettrine-rose::first-letter {
  /* Espacement */
  padding: 0.3rem;
  /* Typographie fonte */
  font-weight: 900;
}

.ligne {
  /* Disposition */
  display: grid;
  grid-column: 1 / -1; /* S'étend sur toutes les colonnes */
  grid-template-columns: 1fr var(--menu-largeur) 1fr;
  align-items: flex-start;
  /* Espacement */
  gap: var(--gouttiere);
  padding: var(--rembourrage);
  /* Taille */
  box-sizing: border-box;
}

.ligne img.image-adaptative {
  inline-size: var(--menu-largeur);
}

.ligne-bicephale {
  /* Disposition */
  display: grid;
  grid-column: 1 / -1; /* S'étend sur toutes les colonnes */
  grid-template-columns: 1fr 1fr;
  text-align: center;
  /* Espacement */
  gap: var(--gouttiere);
  padding: var(--rembourrage) 0;
}

.ligne-bicephale img.image-adaptative {
  inline-size: calc(50vw - var(--gouttiere) / 2);
}

.ligne-totale {
  /* Disposition */
  display: grid;
  grid-column: 1 / -1; /* S'étend sur les trois colonnes */
  grid-template-columns: 100%;
  /* Espacement */
  gap: var(--gouttiere);
  padding: var(--rembourrage);
}

.lire-la-suite {
  /* Aspect visuel */
  visibility: hidden;
  opacity: 0;
  /* Animation et transition */
  transition: opacity 0.3s;
}

/* Couleur particulière 100 */
/* Peut-être à supprimer ? */
.lire-la-suite-blanc::after {
  color: rgba(var(--blanc-rvb), var(--alpha-100));
}
.lire-la-suite-gris-clair::after {
  color: rgba(var(--gris-clair-rvb), var(--alpha-100));
}
.lire-la-suite-gris-clair-70::after {
  background-color: rgba(var(--gris-clair-rvb), var(--alpha-70));
  color: rgba(var(--gris-moyen-rvb), var(--alpha-100));
}
.lire-la-suite-gris-moyen::after {
  color: rgba(var(--gris-moyen-rvb), var(--alpha-100));
}
.lire-la-suite-gris-sombre::after {
  color: rgba(var(--gris-sombre-rvb), var(--alpha-100));
}
.lire-la-suite-noir::after {
  color: rgba(var(--noir-rvb), var(--alpha-100));
}
.lire-la-suite-rouge::after {
  color: rgba(var(--rouge-rvb), var(--alpha-100));
}
.lire-la-suite-orange::after {
  color: rgba(var(--orange-rvb), var(--alpha-100));
}
.lire-la-suite-jaune::after {
  color: rgba(var(--jaune-rvb), var(--alpha-100));
}
.lire-la-suite-jaune-moutarde::after {
  color: rgba(var(--jaune-moutarde-rvb), var(--alpha-100));
}
.lire-la-suite-vert::after {
  color: rgba(var(--vert-rvb), var(--alpha-100));
}
.lire-la-suite-vert-academie::after {
  color: rgba(var(--vert-academie-rvb), var(--alpha-100));
}
.lire-la-suite-bleu-vert::after {
  color: rgba(var(--bleu-vert-rvb), var(--alpha-100));
}
.lire-la-suite-bleu-clair::after {
  color: rgba(var(--bleu-clair-rvb), var(--alpha-100));
}
.lire-la-suite-bleu-sombre::after {
  color: rgba(var(--bleu-sombre-rvb), var(--alpha-100));
}
.lire-la-suite-pourpre::after {
  color: rgba(var(--pourpre-rvb), var(--alpha-100));
}
.lire-la-suite-violet::after {
  color: rgba(var(--violet-rvb), var(--alpha-100));
}
.lire-la-suite-rose::after {
  color: rgba(var(--rose-rvb), var(--alpha-100));
}

.lisere {
  block-size: 3px;
}

.longueur-30-lignes .vignette {
  max-block-size: calc(var(--interligne) * 30);
}
.longueur-40-lignes .vignette {
  max-block-size: calc(var(--interligne) * 40);
}

.longueur-30-lignes .vignette,
.longueur-40-lignes .vignette {
  /* Disposition */
  overflow: hidden;
  text-align: left;
  /* Taille */
  transition: max-block-size 0.2s ease;
}

.longueur-30-lignes .vignette::after,
.longueur-40-lignes .vignette::after {
  /* Disposition */
  display: block;
  position: absolute;
  bottom: 0;
  left: 0;
  text-align: left;
  /* Taille */
  inline-size: 100%;
  block-size: calc(var(--interligne) + var(--rembourrage));
  /* Espacement */
  padding: var(--rembourrage) 0 0 var(--rembourrage);
  /* Typographie couleur */
  color: rgba(var(--blanc-rvb), var(--alpha-100));
  /* Typographie contenu */
  content: "Lire la suite…";
  /* Aspect visuel */
  background-color: rgba(var(--gris-sombre-rvb), var(--alpha-100));
}

.longueur-30-lignes .vignette:focus-within,
.longueur-40-lignes .vignette:focus-within {
  /* Taille */
  max-block-size: 100%;
  /* Autres */
  pointer-events: none;
}

.longueur-30-lignes .vignette:focus-within *,
.longueur-40-lignes .vignette:focus-within * {
  /* Autres */
  pointer-events: auto;
}

.longueur-30-lignes .vignette:focus-within::after,
.longueur-40-lignes .vignette:focus-within::after {
  /* Disposition */
  display: none;
}

.marge-bloc {
  /* Espacement */
  margin-block-start: var(--interligne);
  margin-block-end: var(--interligne);
}

.marge-haut {
  /* Espacement */
  margin: 2rem 0 1rem;
}

.marge-haute-3rem {
  /* Espacement */
  margin-block-start: 3rem;
}

.menu-item {
  /* Espacement */
  padding: 0.07em 0; /* Éviter la différence verticale avec les autres éléments de menu */
  /* Typographie fonte */
  text-decoration: none;
  /* Typographie débordement et troncature */
  white-space: nowrap;
  /* Typographie couleur */
  color: rgba(var(--blanc-rvb), var(--alpha-100));
  /* Aspect visuel */
  border-block-end: var(--lisere) solid transparent; /* Éviter le sursaut au survol des éléments des services de prestation */
}

.menu-item-1200 {
  display: block;
}

/* Barre de menu primaire */
.menu-item.actif {
  color: rgba(var(--blanc-rvb), var(--alpha-100));
}
.menu-item.actif-rouge {
  color: rgba(var(--rouge-rvb), var(--alpha-100));
}
.menu-item.actif-orange {
  color: rgba(var(--orange-rvb), var(--alpha-100));
}
.menu-item.actif-jaune {
  color: rgba(var(--jaune-rvb), var(--alpha-100));
}
.menu-item.actif-vert {
  color: rgba(var(--vert-rvb), var(--alpha-100));
}
.menu-item.actif-vert-academie {
  color: rgba(var(--vert-academie-rvb), var(--alpha-100));
}
.menu-item.actif-bleu-vert {
  color: rgba(var(--bleu-vert-rvb), var(--alpha-100));
}
.menu-item.actif-bleu-clair {
  color: rgba(var(--bleu-clair-rvb), var(--alpha-100));
}
.menu-item.actif-bleu-sombre {
  color: rgba(var(--bleu-sombre-rvb), var(--alpha-100));
}
.menu-item.actif-violet {
  color: rgba(var(--violet-rvb), var(--alpha-100));
}
.menu-item.actif-pourpre {
  color: rgba(var(--pourpre-rvb), var(--alpha-100));
}
.menu-item.actif-rose {
  color: rgba(var(--rose-rvb), var(--alpha-100));
}

.menu-item.actif-blanc {
  /* Typographie couleur */
  color: rgba(var(--blanc-rvb), var(--alpha-100));
  /* Aspect visuel */
  border-block-end: var(--lisere) solid rgba(var(--blanc-rvb), var(--alpha-100));
}

/* Lettrine du menu primaire */
.menu-item.actif.primaire-rouge::first-letter {
  background-color: rgba(var(--rouge-rvb), var(--alpha-30));
}
.menu-item.actif.primaire-orange::first-letter {
  background-color: rgba(var(--orange-rvb), var(--alpha-30));
}
.menu-item.actif.primaire-jaune::first-letter {
  background-color: rgba(var(--jaune-rvb), var(--alpha-30));
}
.menu-item.actif.primaire-vert::first-letter {
  background-color: rgba(var(--vert-rvb), var(--alpha-30));
}
.menu-item.actif.primaire-vert-academie::first-letter {
  background-color: rgba(var(--vert-academie-rvb), var(--alpha-30));
}
.menu-item.actif.primaire-bleu-vert::first-letter {
  background-color: rgba(var(--bleu-vert-rvb), var(--alpha-30));
}
.menu-item.actif.primaire-bleu-clair::first-letter {
  background-color: rgba(var(--bleu-clair-rvb), var(--alpha-30));
}
.menu-item.actif.primaire-bleu-sombre::first-letter {
  background-color: rgba(var(--bleu-sombre-rvb), var(--alpha-30));
}
.menu-item.actif.primaire-violet::first-letter {
  background-color: rgba(var(--violet-rvb), var(--alpha-30));
}
.menu-item.actif.primaire-pourpre::first-letter {
  background-color: rgba(var(--pourpre-rvb), var(--alpha-100));
}
.menu-item.actif.primaire-rose::first-letter {
  background-color: rgba(var(--rose-rvb), var(--alpha-30));
}

.menu-item.actif.primaire-rouge::first-letter,
.menu-item.actif.primaire-orange::first-letter,
.menu-item.actif.primaire-jaune::first-letter,
.menu-item.actif.primaire-vert::first-letter,
.menu-item.actif.primaire-vert-academie::first-letter,
.menu-item.actif.primaire-bleu-vert::first-letter,
.menu-item.actif.primaire-bleu-clair::first-letter,
.menu-item.actif.primaire-bleu-sombre::first-letter,
.menu-item.actif.primaire-violet::first-letter,
.menu-item.actif.primaire-pourpre::first-letter,
.menu-item.actif.primaire-rose::first-letter {
  display: inline-block;
  transform: scale(1.3);
  font-weight: bold;
  vertical-align: baseline;
  padding: 2px;
}

.menu-item-acheter,
.menu-item-estimer {
  /* Aspect visuel */
  background-color: rgba(var(--violet-rvb), var(--alpha-90));
  border-radius: var(--courbure);
}

.menu-item-acheter {
  /* Espacement */
  padding: 0.07em 1.4em;
}

.menu-item-estimer {
  /* Espacement */
  margin-inline-start: 0.5rem !important;
  padding: 0.21em 0.42em;
}

.menu-item-service {
  /* Typographie fonte */
  font-size: 1.4em;
}

.menu-prestations {
  /* Disposition */
  display: flex;
  justify-content: space-between;
  flex-grow: 1;
}

.menu-prestations a:first-child {
  /* Espacement */
  margin-inline-start: 1rem;
}

.menu-prestations a:last-child {
  /* Espacement */
  margin-inline-end: 1rem;
}

.menu-primaire {
  /* Taille */
  inline-size: var(--menu-largeur);
}

.menu-secondaire {
  /* Taille */
  inline-size: var(--menu-largeur);
}

.menu-primaire,
.menu-secondaire {
  /* Disposition */
  display: flex;
  justify-content: space-between;
  align-items: center;
  /* Espacement */
  margin: 0;
  padding: 0;
  /* Aspect visuel */
  list-style-type: none;
}

.menu-primaire > li {
  /* Disposition */
  flex-grow: 1;
  text-align: center;
  /* Taille */
  min-inline-size: 0;
}

.services-prestation {
  /* Disposition */
  flex-grow: 1;
  justify-content: right;
  display: flex;
  gap: 1em;
}

.menu-secondaire .services-prestation-nav ul {
  /* Disposition */
  justify-content: space-between;
  /* Taille */
  inline-size: 50%;
  /* Espacement */
  margin: 0;
  padding: 0;
  /* Aspect visuel */
  list-style-type: none;
}

.modal {
  /* Disposition */
  display: none;
  left: 0;
  top: 0;
  /* Taille */
  inline-size: 100%;
  block-size: auto;
  /* Aspect visuel */
  background-color: rgba(var(--gris-sombre-rvb), var(--alpha-30));
}

.mot-de-passe-conteneur-general {
  /* Disposition */
  display: inline-block; /* Ajuste la largeur du conteneur à celle de l'input */
  /* Taille */
  inline-size: auto;
}

.mot-de-passe-conteneur-enfant {
  /* Disposition */
  display: flex;
  justify-content: space-between; /* Alignement de l'étiquette à gauche et du bouton à droite */
  /* Taille */
  inline-size: 100%;
}

.mot-de-passe-etiquette {
  /* Disposition */
  flex-grow: 1; /* Permet à l'étiquette de prendre tout l'espace disponible à gauche */
}

.mot-de-passe-saisie {
  /* Taille */
  inline-size: 100%; /* Assure que l'input occupe toute la largeur du conteneur général */
  /* Aspect visuel */
  box-sizing: border-box; /* Inclut padding et border dans la largeur totale */
}

.navigation-primaire {
  /* Disposition */
  display: flex; /* Afficher la navigation primaire par défaut */
  /* Typographie fonte */
  font-size: var(--menu-secondaire-taille);
  /* font-weight: bolder; */
  /* Aspect visuel */
  background-color: rgba(
    var(--gris-sombre-rvb),
    var(--alpha-100)
  ); /* Pantone 433C */
  border-block-end: var(--lisere) solid transparent;
}

.navigation-primaire,
.navigation-secondaire {
  /* Disposition */
  justify-content: center;
  /* Taille */
  inline-size: 100%;
}

/* Styles spécifiques aux éléments imbriqués dans la navigation primaire et dans la navigation secondaire */
.navigation-primaire ul,
.navigation-primaire ul li,
.navigation-secondaire ul,
.navigation-secondaire ul li {
  /* Disposition */
  display: flex;
  align-items: center;
  gap: var(--intermenu);
  /* Taille */
  block-size: var(--navigation-hauteur);
  /* Typographie fonte */
  text-transform: uppercase;
}

.navigation-secondaire {
  /* Disposition */
  display: none; /* Masquer par défaut la navigation secondaire */
  /* Typographie dimension */
  font-size: var(--menu-secondaire-taille);
  /* Aspect visuel */
  background-color: rgba(var(--noir-rvb), var(--alpha-100));
}

/*
*******************************
 Numéro Ne semble pas utilisé
*******************************
*/
.nb {
  /* Disposition */
  display: inline-block;
  text-align: center;
  /* Taille */
  inline-size: 1em;
  block-size: 1em;
  /* Espacement */
  margin: 0 var(--intermot);
  /* Typographie dimension */
  line-height: 1;
  /* Typographie couleur */
  color: rgba(var(--blanc-rvb), var(--alpha-100));
  /* Aspect visuel */
  background-color: rgba(var(--noir-rvb), var(--alpha-100));
  border-radius: 50%;
}

/* 
****************
Recopier bouton
****************
 */
.onglets {
  /* Taille */
  inline-size: 50%;
  /* Espacement */
  margin: 0 auto;
}

/* 
**********************
Recopier bouton-achat
**********************
 */
.onglet-contenu {
  /* Disposition */
  display: none;
  /* Espacement */
  padding: 20px;
  /* Aspect visuel */
  border: var(--lisere) solid #ccc;
  border-block-start: none;
}

/* 
****************
Recopier bouton
****************
 */
.onglet-lien {
  /* Disposition */
  float: left;
  /* Espacement */
  padding: 14px 16px;
  /* Aspect visuel */
  background-color: #f1f1f1;
  border: var(--lisere) solid #ccc;
  outline: none;
  cursor: pointer;
  /* Animation et transition */
  transition: background-color 0.3s;
}

/* 
***********************
Recopier bouton survol
***********************
 */
.onglet-lien:hover {
  /* Aspect visuel */
  background-color: #ddd;
}

/* 
**********************
Recopier bouton actif
**********************
 */
.onglet-lien.active {
  /* Aspect visuel */
  background-color: #ccc;
}

.partage-droite {
  /* Disposition */
  display: flex;
  justify-content: flex-end;
  align-items: center;
  flex-grow: 1; /* partage-droite prend tout l’espace restant */
}

.partage-droite a span,
.partage-droite .fa-regular {
  /* Espacement */
  margin: var(--intermot);
  padding: 0;
  /* Typographie dimension */
  font-size: var(--taille-p);
  /* Typographie couleur */
  color: rgba(var(--blanc-rvb), var(--alpha-100));
  /* Aspect visuel */
  border: none;
}

.partage-ligne {
  /* Disposition */
  display: flex;
  align-items: center;
}

.partage-pdf-form button {
  /* Disposition */
  display: inline-flex;
  align-items: center;
  justify-content: center;
  /* Espacement */
  inline-size: 2rem;
  block-size: auto;
  /* Aspect visuel */
  background-color: transparent;
  cursor: pointer;
}

.partage-pdf-form {
  /* Disposition */
  display: inline-block;
  /* Espacement */
  margin: 0;
  padding: 0;
}

.personnel:hover {
  /* Typographie couleur */
  color: rgba(var(--bleu-sombre-rvb), var(--alpha-100));
}

.pied {
  /* Disposition */
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: var(--gouttiere);
}

.pied-legal a,
.pied-menu ul li {
  /* Espacement */
  margin: 0;
  /* Typographie dimension */
  font-size: smaller;
  line-height: var(--interligne);
  /* Typographie couleur */
  color: rgba(var(--gris-clair-rvb), var(--alpha-100));
}

.pied-legal a:not(:has(> figure)):hover,
.pied-legal form:hover {
  /* Aspect visuel */
  background-color: rgba(var(--bleu-clair-rvb), var(--alpha-70));
  border: var(--lisere) solid rgb(var(--blanc-rvb));
  border-radius: var(--courbure);
}

.pied-legal figure {
  /* Espacement */
  padding: calc(var(--rembourrage) * 0.5);
  inline-size: 20rem;
  margin: var(--rembourrage);
}

.pied-menu .menu-item[aria-label="auteur-personnalise"] {
  /* Disposition */
  display: block;
  /* Taille */
  max-inline-size: 100%;
  /* Typographie espacement */
  white-space: normal;
  /* Typographie débordement et troncature */
  word-wrap: break-word;
  overflow-wrap: break-word;
}

.pied-menu .menu-item.actif,
.pied-menu .menu-item.actif-rouge,
.pied-menu .menu-item.actif-orange,
.pied-menu .menu-item.actif-jaune,
.pied-menu .menu-item.actif-vert,
.pied-menu .menu-item.actif-vert-academie,
.pied-menu .menu-item.actif-bleu-vert,
.pied-menu .menu-item.actif-bleu-clair,
.pied-menu .menu-item.actif-bleu-sombre,
.pied-menu .menu-item.actif-violet,
.pied-menu .menu-item.actif-pourpre,
.pied-menu .menu-item.actif-rose {
  /* Typographie fonte */
  font-weight: 700;
}

.prestation-publier {
  /* Disposition */
  display: flex;
  align-items: center;
}

.prestation-description {
  margin-block-start: var(--interbloc);
}

.prestation-description img {
  /* Disposition */
  display: none;
}

.prestation-colonne {
  /* Taille */
  inline-size: 100%;
  /* Espacement */
  padding: var(--rembourrage);
}

.prestation-colonne:hover .lire-la-suite {
  /* Aspect visuel */
  visibility: visible;
  opacity: 1;
  /* Animation et transition */
  transition: opacity 0.3s;
}

.prestation-colonne:hover .prestation-publier img,
.prestation-colonne:hover .prestation-ouvrage {
  /* Disposition */
  display: block;
  /* Animation et transition */
  transition: opacity 0.3s;
}

.prestation-colonne-duale {
  /* Taille */
  inline-size: calc(100% / 2);
}

.prestation-ligne {
  /* Taille */
  inline-size: 100%;
}

.prestation-ouvrage {
  /* Disposition */
  display: none;
}

.prestation-titre {
  /* Disposition */
  text-align: center;
  /* Typographie couleur */
  color: rgba(var(--noir-rvb), var(--alpha-100));
  /* Animation et transition */
  transition: background-color 0.3s ease-in-out, padding 0.3s ease-in-out;
}

.prestation-titre:active,
.prestation-titre:hover {
  /* Espacement */
  padding: 0.5rem;
  /* Typographie fonte */
  text-decoration: none;
  /* Typographie couleur */
  color: rgba(var(--noir-rvb), var(--alpha-100));
  /* Aspect visuel */
  background-color: rgba(var(--gris-clair-rvb), var(--alpha-100));
}

.prestation-titre h3 {
  /* Typographie fonte */
  font-size: var(--taille-h4);
  /* Animation et transition */
  transition: padding 0.3s ease-in-out, margin 0.3s ease-in-out;
}

.prestation-titre img,
.prestation-titre svg {
  /* Taille de base */
  inline-size: 12rem;
  block-size: 12rem;
  /* Aspect visuel */
  border: 7px solid transparent;
  object-fit: cover;
  /* Animation et transition */
  transition: inline-size 0.3s ease-in-out, block-size 0.3s ease-in-out;
}

.prestation-titre:hover img,
.prestation-titre:hover svg {
  /* Taille de base */
  inline-size: 11.5rem;
  block-size: 11.5rem;
}

.question-reponse {
  /* Taille */
  inline-size: calc(var(--menu-largeur) - 2 * var(--rembourrage));
  /* Espacement */
  padding: var(--rembourrage);
  margin-block-end: var(--interbloc);
  /* Typographie couleur */
  color: rgba(var(--gris-sombre-rvb), var(--alpha-100));
  /* Aspect visuel */
  cursor: pointer;
  background-color: rgba(var(--gris-clair-rvb), var(--alpha-100));
  border: var(--lisere) solid rgba(var(--gris-clair-rvb), var(--alpha-100));
  border-radius: var(--courbure);
  /* Animation et transition */
  transition: 0.3s;
}

.question-reponse:hover {
  /* Typographie couleur */
  color: rgba(var(--blanc-rvb), var(--alpha-100));
  /* Aspect visuel */
  background-color: rgba(var(--gris-moyen-rvb), var(--alpha-100));
}

.question-reponse::-webkit-details-marker {
  /* Disposition */
  display: none;
}

.question-reponse:marker {
  /* Typographie contenu */
  content: "▶";
  /* Espacement */
  margin-inline-end: 5px;
}

.reduit-interligne:before {
  /* Disposition */
  display: block;
  /* Taille */
  block-size: 0;
  inline-size: 0;
  /* Espacement */
  margin-block-start: -0.05em;
  /* Typographie contenu */
  content: "";
}

.rembourrage-horizontal {
  /* Espacement */
  padding-inline-start: calc(var(--rembourrage) * 2);
  padding-inline-end: calc(var(--rembourrage) * 2);
}

.scanneur {
  /* Disposition */
  position: relative;
  overflow: hidden;
  /* Espacement */
  padding: var(--rembourrage);
  /* Aspect visuel */
  border-radius: var(--courbure);
}

.scanneur::after {
  /* Disposition */
  position: absolute;
  top: 0;
  /* Taille */
  inline-size: 0.1rem;
  block-size: 100%;
  /* Typographie contenu */
  content: "";
  /* Aspect visuel */
  background: rgba(var(--rouge-rvb), var(--alpha-100));
  /* Animation et transition */
  animation: scanneur 2s infinite linear;
}

/* Annulation des ajustements sur input-ligne dans un environnement réduit */
.section-ancien.input-ligne,
.section-nouveau.input-ligne {
  /* Espacement */
  margin-inline-start: 0;
  margin-inline-end: 0;
}

.services-administration {
  /* Disposition */
  display: flex;
  /* Espacement */
  margin-inline-start: auto;
}

.services-administration .menu-item {
  /* Espacement */
  margin-inline-start: calc(0.5 * var(--intermenu)) !important;
}

.services-administration .menu-item:first-child {
  /* Espacement */
  margin-inline-start: 0;
}

.services-prestation {
  /* Disposition */
  display: flex;
}

.services-prestation .menu-item {
  /* Espacement */
  margin-inline-start: 2em;
}

.services-prestation .menu-item:first-child {
  /* Espacement */
  margin-inline-start: 0;
}

.sous-boutons {
  /* Disposition */
  display: flex;
  justify-content: flex-end;
  gap: var(--gouttiere);
  /* Espacement */
  margin-block-start: var(--interbloc);
}

.sous-boutons .bouton {
  /* Taille */
  inline-size: 14rem;
}

.sous-colonnes {
  /* Disposition */
  display: flex;
  flex-wrap: wrap;
  gap: var(--gouttiere);
  /* Espacement */
  padding: var(--rembourrage);
}

.sous-colonne-1 {
  /* Disposition */
  flex: 0 0 28%;
}

.sous-colonne-1 .svg-plume-icone {
  /* Disposition */
  align-items: center;
  /* Taille */
  inline-size: 100%;
  block-size: 100%;
  /* Aspect visuel */
  background-color: rgba(var(--blanc-rvb), var(--alpha-100));
  /* Animation et transition */
  transform: translatex(0em) translatey(0em);
}

.sous-colonne-2 {
  /* Disposition */
  display: flex;
  flex-direction: column;
  flex: 1;
}

.style-surlignage {
  background-color: rgba(0, 0, 0, 0.3);
}

/* Numéro romain initial */
.style-romain-1 {
  counter-reset: liste-numero 0;
}
.style-romain-2 {
  counter-reset: liste-numero 1;
}
.style-romain-3 {
  counter-reset: liste-numero 2;
}
.style-romain-4 {
  counter-reset: liste-numero 3;
}
.style-romain-5 {
  counter-reset: liste-numero 4;
}
.style-romain-6 {
  counter-reset: liste-numero 5;
}
.style-romain-7 {
  counter-reset: liste-numero 6;
}

.superposition {
  /* Disposition */
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: var(--gouttiere);
  align-items: flex-start;
}

.superposition-menu {
  /* Aspect visuel */
  box-sizing: border-box;
}

.superposition-menu li h3 {
  /* Disposition */
  text-align: left;
  /* Typographie fonte */
  font-weight: normal;
}

.superposition-menu ul li {
  /* Espacement */
  margin: 0;
  /* Typographie dimension */
  line-height: var(--interligne);
  /* Typographie couleur */
  color: rgba(var(--gris-clair-rvb), var(--alpha-100));
}

.superposition-sous-menu {
  /* Disposition */
  display: grid;
  grid-template-columns: 1fr;
  align-items: center;
  /* Espacement */
  padding: var(--interbloc) var(--intermot);
  margin-inline-start: var(--retrait);
}

.svg-acheter-icone {
  /* Taille */
  block-size: var(--interligne);
  inline-size: auto;
  /* Espacement */
  margin-inline-end: var(--intermot);
}

.svg-couleur::before {
  /* Disposition */
  display: inline-block;
  /* Taille */
  inline-size: 2.8em;
  block-size: 2.8em;
  /* Espacement */
  margin-inline-end: 1em;
  /* Typographie contenu */
  content: "";
  /* Aspect visuel */
  background-repeat: no-repeat;
  background-size: cover;
}

.svg-drapeau-icone {
  /* Taille */
  inline-size: 1.5em;
}

.svg-logo-3rem {
  block-size: 3rem;
  inline-size: auto;
  text-transform: none;
}

/*
.svg-logo-3rem figure {
  block-size: 3rem;
  inline-size: auto;
  text-transform: none;
}
*/

.svg-logo-texte {
  /* Typographie fonte */
  font-family: ""Simply Sans"";
  /* Typographie dimension */
  font-size: 291.667px;
  /* Aspect visuel */
  fill: #ffffff;
}

.svg-plume-icone {
  /* Taille */
  inline-size: 12em;
  block-size: 3em;
  /* Espacement */
  padding: 0.21em;
  /* Animation et transition */
  transform: translateX(-0.4375em) translateY(0.25em);
}

.svg-plume-texte {
  /* Disposition */
  position: absolute;
  z-index: calc(var(--z-index-navbar) + 2);
  background-image: linear-gradient(rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.3));
  /* Typographie fonte */
  font-size: 1.5em;
  /* Typographie couleur */
  color: rgba(var(--blanc-rvb), var(--alpha-100));
  /* Animation et transition */
  transform: translatey(0.9375em);
}
.svg-plume-texte {
  /* Disposition */
  position: absolute;
  z-index: calc(var(--z-index-navbar) + 2);
  /* Typographie fonte */
  font-size: 1.5em;
  /* Typographie couleur */
  color: rgba(var(--blanc-rvb), var(--alpha-100));
  /* Aspect visuel */
  background-image: linear-gradient(rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.3));
  /* Animation et transition */
  transform: translateY(0.9375em);
}

.svg-qrcode {
  /* Taille */
  block-size: 5rem;
  inline-size: auto;
  /* Typographie fonte */
  text-transform: none;
}

.svg-qrcode figure {
  /* Disposition */
  display: block;
  /* Taille */
  inline-size: 5rem;
  max-inline-size: 100%;
}

/* Icone de menu secondaire particulier */
.svg-rouge::before {
  background-image: url("/svg/icone-corriger.svg");
}
.svg-orange::before {
  background-image: url("/svg/icone-sublimer.svg");
}
.svg-jaune::before {
  background-image: url("/svg/icone-composer.svg");
}
.svg-vert::before {
  background-image: url("/svg/icone-illustrer.svg");
}
.svg-bleu-vert::before {
  background-image: url("/svg/icone-editer.svg");
}
.svg-bleu-clair::before {
  background-image: url("/svg/icone-apprendre.svg");
}
.svg-bleu-sombre::before {
  background-image: url("/svg/icone-connecter.svg");
}
.svg-violet::before {
  background-image: url("/svg/icone-acheter.svg");
}
.svg-pourpre::before {
  background-image: url("/svg/icone-cabinet.svg");
}
.svg-rose::before {
  background-image: url("/svg/icone-publier.svg");
}

.texte-aligne-gauche {
  /* Disposition */
  text-align: left;
}

.texte-droite {
  /* Espacement */
  padding-inline-start: 14%;
  padding-inline-end: 21%;
}

.texte-droite,
.texte-gauche {
  /* Disposition */
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.texte-droite p,
.texte-gauche p {
  /* Disposition */
  text-align: left;
}

.texte-gauche {
  /* Espacement */
  padding-inline-start: 17%;
  padding-inline-end: 14%;
}

.texte-important,
.texte-important p,
.texte-important span {
  /* Typographie fonte */
  font-size: 1.4rem;
  /* Typographie dimension */
  line-height: normal;
}

.texte-tres-important,
.texte-tres-important p,
.texte-tres-important span {
  /* dimension */
  font-size: calc(100vw / 70);
  line-height: normal;
}

.video-fermer {
  /* Disposition */
  display: flex;
  align-items: center;
  justify-content: center;
  /* Taille */
  block-size: 100%;
  inline-size: auto;
  /* Espacement */
  padding: var(--rembourrage);
  /* Typographie dimension */
  font-size: var(--taille-h1);
  /* Aspect visuel */
  cursor: pointer;
}

.video-fermer:hover,
.video-fermer:focus {
  /* Typographie fonte */
  text-decoration: none;
  /* Typographie couleur */
  color: rgba(var(--blanc-rvb), var(--alpha-100));
  /* Aspect visuel */
  background-color: rgba(var(--rouge-rvb), var(--alpha-100));
}

.video-modale {
  /* Disposition */
  display: none;
  position: relative;
}

.video-modale-conteneur {
  /* Disposition */
  position: relative;
  /* Taille */
  inline-size: 100%;
  max-inline-size: 100%;
  /* Aspect visuel */
  background-color: rgba(var(--gris-clair-rvb), var(--alpha-100));
  border: var(--lisere) solid rgba(var(--noir-rvb), var(--alpha-100));
  border-radius: var(--courbure) var(--courbure) 0 0;
}

.video-titre {
  /* Disposition */
  text-align: left;
  flex-grow: 1;
  /* Espacement */
  padding: 1rem;
  /* Typographie fonte */
  font-weight: bolder;
  /* Typographie dimension */
  font-size: large;
}

.video-titre-conteneur {
  /* Disposition */
  text-align: center;
  display: flex;
  justify-content: space-between;
  align-items: center;
  /* Typographie couleur */
  color: rgba(var(--noir-rvb), var(--alpha-100));
  /* Aspect visuel */
  border-radius: var(--courbure) var(--courbure) 0 0;
  background-color: rgba(var(--gris-clair-rvb), var(--alpha-100));
}
.video-titre-conteneur {
  /* Disposition */
  display: flex;
  text-align: center;
  justify-content: space-between;
  align-items: center;
  /* Typographie couleur */
  color: rgba(var(--noir-rvb), var(--alpha-100));
  /* Aspect visuel */
  background-color: rgba(var(--gris-clair-rvb), var(--alpha-100));
  border-radius: var(--courbure) var(--courbure) 0 0;
}

.video-vertical,
.video-horizontal {
  /* Disposition */
  display: block;
  /* Taille */
  inline-size: 100%;
  block-size: auto;
}

/* Masquer la vidéo verticale par défaut */
.video-vertical {
  /* Disposition */
  display: none;
}

.videotexte-conteneur {
  /* Disposition */
  position: relative;
  overflow: hidden;
  /* Espacement */
  padding-block-end: 56.25%; /* Par défaut, 16:9 aspect ratio */
  /* Taille */
  inline-size: 100%;
  block-size: 0;
  /* Aspect visuel */
  background-color: rgba(var(--blanc-casse-rvb), var(--alpha-100));
  border: var(--lisere) solid rgb(var(--gris-sombre-rvb));
}

.videotexte-conteneur article {
  /* Disposition */
  display: none;
  position: absolute;
  top: 0;
  left: 0;
  /* Espacement */
  padding: var(--rembourrage);
  /* Taille */
  inline-size: 100%;
  block-size: 100%;
  /* Aspect visuel */
  box-sizing: border-box;
}

.videotexte-conteneur article.active {
  /* Disposition */
  display: block;
}

.videotexte-conteneur h2 {
  /* Typographie fonte */
  font-size: var(--taille-h1);
  /* Typographie couleur */
  color: rgba(var(--rouge-rvb), var(--alpha-100));
}

.videotexte-conteneur p {
  /* Disposition */
  text-align: center;
  /* Typographie fonte */
  font-size: var(--taille-m);
}

.videotexte-copie {
  /* Disposition */
  position: absolute;
  pointer-events: none;
  z-index: 1000;
  /* Typographie dimension */
  font-size: inherit;
  line-height: inherit;
  /* Typographie espacement */
  letter-spacing: inherit;
  word-spacing: inherit;
  /* Autres */
  /* Ajouter ici des effets d’explosion si nécessaire */
}

/* Styles spécifiques aux éléments */
.videotexte-ajout,
.videotexte-creation,
.videotexte-explosion,
.videotexte-final,
.videotexte-initial,
.videotexte-suppression {
  /* Disposition */
  overflow: hidden;
  /* Typographie débordement et troncature */
  white-space: pre-wrap;
}

.videotexte-ajout,
.videotexte-creation,
.videotexte-final {
  /* Disposition */
  display: none;
}

.videotexte-ajout {
  background-color: rgba(var(--vert-rvb), var(--alpha-30));
  color: rgba(var(--vert-rvb), var(--alpha-100));
}
.videotexte-creation {
  background-color: rgba(var(--bleu-clair-rvb), var(--alpha-30));
  color: rgba(var(--bleu-clair-rvb), var(--alpha-100));
}
.videotexte-final {
  background-color: rgba(var(--bleu-vert-rvb), var(--alpha-30));
  color: rgba(var(--bleu-vert-rvb), var(--alpha-100));
}

.videotexte-explosion-active {
  animation: explosion 0.05s forwards;
}
.videotexte-implosion-active {
  animation: implosion 0.05s forwards;
}
.videotexte-suppression {
  color: rgba(var(--noir-rvb), var(--alpha-100));
}

/* Styles pour les soulignements */
.videotexte-creation-soulignement {
  background-color: rgba(var(--bleu-clair-rvb), var(--alpha-30));
  color: rgba(var(--bleu-clair-rvb), var(--alpha-100));
  position: relative;
}
.videotexte-explosion-soulignement {
  background-color: rgba(var(--violet-rvb), var(--alpha-30));
  color: rgba(var(--violet-rvb), var(--alpha-100));
  position: relative;
}
.videotexte-initial-soulignement {
  background-color: rgba(var(--violet-rvb), var(--alpha-30));
  color: rgba(var(--violet-rvb), var(--alpha-100));
  position: relative;
}
.videotexte-suppression-soulignement {
  background-color: rgba(var(--rouge-rvb), var(--alpha-30));
  color: rgba(var(--rouge-rvb), var(--alpha-100));
  position: relative;
}

.videotexte-creation-soulignement::after {
  background-color: rgba(var(--bleu-clair-rvb), var(--alpha-100));
}
.videotexte-explosion-soulignement::after {
  background-color: rgba(var(--violet-rvb), var(--alpha-100));
}
.videotexte-suppression-soulignement::after {
  background-color: rgba(var(--rouge-rvb), var(--alpha-100));
}
.videotexte-initial-soulignement::after {
  background-color: rgba(var(--violet-rvb), var(--alpha-100));
}

.videotexte-explosion-soulignement::after,
.videotexte-initial-soulignement::after,
.videotexte-suppression-soulignement::after {
  /* Disposition */
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0.75vw;
  /* Taille */
  block-size: var(--lisere);
  /* Typographie contenu */
  content: "";
}

.vignette {
  /* Disposition */
  text-align: center;
  /* Espacement */
  padding: var(--rembourrage);
  margin: 0;
  /* Aspect visuel */
  background-color: rgba(var(--gris-clair-rvb), var(--alpha-100));
  box-sizing: border-box;
  /* Animation et transition */
  transition: padding 0.3s ease-in-out, margin 0.3s ease-in-out,
    background-color 0.3s ease-in-out 0.3s;
}

.vignette:hover {
  /* Espacement */
  padding: calc(var(--rembourrage) + 0.5rem);
  margin: 0.5rem;
  /* Aspect visuel */
  background-color: rgba(var(--bleu-clair-rvb), var(--alpha-30));
  transition: padding 0.3s ease-in-out, margin 0.3s ease-in-out,
    background-color 0.3s ease-in-out;
}

/* Réapplique la couleur de fond au survol */
.vignette:hover.fond-blanc {
  background-color: rgba(var(--blanc-rvb), var(--alpha-30));
}
.vignette:hover.fond-blanc-casse {
  background-color: rgba(var(--blanc-casse-rvb), var(--alpha-30));
}
.vignette:hover.fond-gris-argent {
  background-color: rgba(var(--gris-argent-rvb), var(--alpha-30));
}
.vignette:hover.fond-gris-clair {
  background-color: rgba(var(--gris-clair-rvb), var(--alpha-30));
}
.vignette:hover.fond-gris-moyen {
  background-color: rgba(var(--gris-moyen-rvb), var(--alpha-30));
}
.vignette:hover.fond-gris-sombre {
  background-color: rgba(var(--gris-sombre-rvb), var(--alpha-30));
}
.vignette:hover.fond-noir {
  background-color: rgba(var(--noir-rvb), var(--alpha-30));
}
.vignette:hover.fond-rouge {
  background-color: rgba(var(--rouge-rvb), var(--alpha-30));
}
.vignette:hover.fond-orange {
  background-color: rgba(var(--orange-rvb), var(--alpha-30));
}
.vignette:hover.fond-jaune {
  background-color: rgba(var(--jaune-rvb), var(--alpha-30));
}
.vignette:hover.fond-jaune-moutarde {
  background-color: rgba(var(--jaune-moutarde-rvb), var(--alpha-20));
}
.vignette:hover.fond-jaune-orange {
  background-color: rgba(var(--jaune-orange-rvb), var(--alpha-30));
}
.vignette:hover.fond-jaune-serin {
  background-color: rgba(var(--jaune-serin-rvb), var(--alpha-30));
}
.vignette:hover.fond-vert {
  background-color: rgba(var(--vert-rvb), var(--alpha-30));
}
.vignette:hover.fond-bleu-vert {
  background-color: rgba(var(--bleu-vert-rvb), var(--alpha-30));
}
.vignette:hover.fond-vert-academie {
  background-color: rgba(var(--vert-academie-rvb), var(--alpha-30));
}
.vignette:hover.fond-bleu-clair {
  background-color: rgba(var(--bleu-clair-rvb), var(--alpha-30));
}
.vignette:hover.fond-bleu-sombre {
  background-color: rgba(var(--bleu-sombre-rvb), var(--alpha-30));
}
.vignette:hover.fond-pourpre {
  background-color: rgba(var(--pourpre-rvb), var(--alpha-30));
}
.vignette:hover.fond-violet {
  background-color: rgba(var(--violet-rvb), var(--alpha-30));
}
.vignette:hover.fond-rose {
  background-color: rgba(var(--rose-rvb), var(--alpha-30));
}

/*--------------------------------------|
@media : styles adaptatifs Media Query. |
----------------------------------------|
*/
@media (min-aspect-ratio: 16/9) {
  .videotexte-conteneur {
    /* Espacement */
    padding-block-end: 56.25%; /* 16:9 aspect ratio */
  }
}

@media (max-aspect-ratio: 1/1) and (min-aspect-ratio: 9/16) {
  .videotexte-conteneur {
    /* Espacement */
    padding-block-end: 100%; /* 1:1 aspect ratio */
  }

  .videotexte-conteneur pre {
    /* Typographie dimension */
    font-size: 1.9vw;
  }

  .videotexte-conteneur legend {
    /* Typographie dimension */
    font-size: x-large;
  }

  .videotexte-conteneur h2 {
    /* Disposition */
    text-align: right;
    /* Typographie dimension */
    font-size: var(--taille-h3);
  }
}

@media (max-aspect-ratio: 9/16) {
  .videotexte-conteneur {
    /* Espacement */
    padding-block-end: 177.78%; /* 9:16 aspect ratio */
  }

  .videotexte-conteneur pre {
    /* Typographie dimension */
    font-size: 2.65vw;
  }

  .videotexte-conteneur legend {
    /* Typographie dimension */
    font-size: x-large;
  }

  .videotexte-conteneur h2 {
    /* Disposition */
    text-align: right;
    /* Typographie dimension */
    font-size: var(--taille-h3);
  }
}

/* Afficher la vidéo verticale en mode portrait */
@media (orientation: portrait) {
  .video-horizontal {
    display: none;
  }
  .video-vertical {
    display: block;
  }
}

/* Largeur de menu et taille de fonte fixes à partir de la résolution 3840 px */
@media (min-width: 3840px) {
  :root {
    /* Autres */
    --menu-largeur: var(--menu-ecran-maximal-largeur);
    --taille-fonte: 22px;
  }
}

@media (min-width: 1350px) and (max-width: 1575px) {
  .menu-item {
    /* Typographie dimension */
    font-size: 98%;
  }
}

@media (min-width: 1200px) and (max-width: 1350px) {
  .menu-item {
    /* Typographie dimension */
    font-size: 95%;
  }
}

/* Largeur des menus variant de 77 % à 50 % entre les résolutions 1200 et 3840 px */
@media (min-width: 1200px) {
  :root {
    /* Autres */
    --menu-largeur: calc(
      var(--menu-ecran-minimal-largeur) - (100vw - var(--ecran-minimal-largeur)) *
        var(--difference-menu-largeur) / var(--difference-largeur)
    );
  }
}

/* Disparition du menu en dessous d'une résolution de 1200 px */
@media (max-width: 1200px) {
  .colonne-bicephale h1,
  .colonne-bicephale p {
    /* Disposition */
    text-align: center;
  }

  .degrade-pourpre-a-jaune,
  .degrade-violet-a-vert {
    /* Taille */
    max-inline-size: 50%;
    /* Espacement */
    margin-inline-start: auto;
    margin-inline-end: auto;
    /* Typographie fonte */
    font-variant: small-caps;
    font-weight: 700;
    /* Typographie dimension */
    font-size: 1.5rem;
  }

  .image-droite,
  .image-gauche {
    /* Taille */
    inline-size: 100%;
    /* Espacement */
    padding-inline-start: var(--rembourrage);
    padding-inline-end: var(--rembourrage);
  }

  .image-droite-ligne,
  .image-gauche-ligne {
    /* Espacement */
    padding: var(--rembourrage) 0;
  }

  .ligne-bicephale {
    /* Disposition */
    grid-template-columns: 1fr;
    /* Espacement */
    padding: 0;
  }

  .ligne-bicephale img.image-adaptative {
    /* Taille */
    inline-size: calc(100vw - 7 * var(--rembourrage));
  }

  .ligne-bicephale .texte-gauche {
    /* Disposition */
    order: 2;
  }

  .ligne-bicephale .texte-droite {
    /* Disposition */
    order: 1;
  }

  .menu-item-1200 {
    /* Disposition */
    display: none;
  }

  .prestation-titre {
    /* Disposition */
    text-align: center;
    flex-direction: column;
  }

  .prestation-titre img {
    /* Espacement */
    margin-inline-end: 0;
    margin-block-end: var(--gouttiere);
  }

  .texte-aligne-gauche {
    /* Disposition */
    text-align: inherit;
  }

  .texte-tres-important,
  .texte-tres-important p,
  .texte-tres-important span {
    /* Typographie dimension */
    font-size: calc(100vw / 50);
    line-height: normal;
  }
}

@media (max-width: 836px) {
  .input-ligne {
    /* Disposition */
    flex-direction: column; /* Empile les éléments verticalement */
    /* Taille */
    inline-size: 35ch;
  }

  .input-conteneur {
    /* Taille */
    inline-size: 100%; /* Les conteneurs enfants occupent toute la largeur */
  }

  .input-conteneur:not(:last-child) {
    margin-inline-end: 0;
  } /* Ajustage l'espacement entre les conteneurs */
  .input-conteneur > label {
    /* Espacement */
    margin: auto; /* Marge automatique de tous les côtés */
  }

  .input-conteneur.pourcentagelargeurtexte04,
  .input-conteneur.pourcentagelargeurtexte05,
  .input-conteneur.pourcentagelargeurtexte06,
  .input-conteneur.pourcentagelargeurtexte07,
  .input-conteneur.pourcentagelargeurtexte08,
  .input-conteneur.pourcentagelargeurtexte09,
  .input-conteneur.pourcentagelargeurtexte11,
  .input-conteneur.pourcentagelargeurtexte15,
  .input-conteneur.pourcentagelargeurtexte18,
  .input-conteneur.pourcentagelargeurtexte28,
  .input-conteneur.pourcentagelargeurtexte30,
  .input-conteneur.pourcentagelargeurtexte33,
  .input-conteneur.pourcentagelargeurtexte36,
  .input-conteneur.pourcentagelargeurtexte46 {
    /* Taille */
    inline-size: 35ch;
  }

  .sous-colonne-1 {
    /* Disposition */
    flex: 0 0 100%;
  }

  .sous-boutons {
    /* Disposition */
    flex-direction: column;
    align-items: center;
    justify-content: center;
  }

  .sous-boutons .bouton {
    /* Disposition */
    text-align: center;
    /* Taille */
    inline-size: 100%;
  }
}

@media (max-width: 768px) {
  :root {
    /* Autres */
    --livre-nombre: 1;
    --vignette-nombre: 1;
  }

  .input-ligne {
    /* Disposition */
    flex-direction: column; /* Empile les éléments verticalement */
    /* Taille */
    inline-size: 29ch;
  }

  .input-conteneur.pourcentagelargeurtexte04,
  .input-conteneur.pourcentagelargeurtexte05,
  .input-conteneur.pourcentagelargeurtexte06,
  .input-conteneur.pourcentagelargeurtexte07,
  .input-conteneur.pourcentagelargeurtexte08,
  .input-conteneur.pourcentagelargeurtexte09,
  .input-conteneur.pourcentagelargeurtexte11,
  .input-conteneur.pourcentagelargeurtexte15,
  .input-conteneur.pourcentagelargeurtexte18,
  .input-conteneur.pourcentagelargeurtexte28,
  .input-conteneur.pourcentagelargeurtexte30,
  .input-conteneur.pourcentagelargeurtexte33,
  .input-conteneur.pourcentagelargeurtexte36,
  .input-conteneur.pourcentagelargeurtexte46 {
    /* Taille */
    inline-size: 29ch;
  }

  .partage-gauche {
    /* Taille */
    max-inline-size: 30%;
  }

  .partage-gauche a {
    /* Disposition */
    display: block;
    /* Typographie espacement */
    white-space: normal;
    /* Aspect visuel */
    overflow-wrap: break-word;
  }

  .pied {
    /* Disposition */
    grid-template-columns: repeat(2, 1fr);
  }

  .prestation-ligne {
    /* Disposition */
    grid-template-columns: repeat(2, 1fr);
  }

  .prestation-titre h3 {
    /* Disposition */
    text-align: center;
  }

  .superposition {
    /* Disposition */
    grid-template-columns: repeat(1, 1fr);
  }
}
/* Fonte proportionelle entre les résolutions 480 px et 3840 px */
@media (min-width: 480px) {
  :root {
    /* Autres */
    --taille-fonte: clamp(
      12px,
      calc(12px + (22 - 12) * ((100vw - 480px) / (3840 - 480))),
      22px
    );
  }
}

@media (max-width: 479px) {
  /* Centrage du bouton */
  input {
    /* Taille */
    inline-size: auto;
  }

  .bouton {
    /* Disposition */
    display: block;
    /* Espacement */
    margin: 0 auto;
    /* Taille */
    inline-size: 50%;
  }

  .entreprise-ligne {
    /* Taille */
    inline-size: 100%;
  }

  .input-ligne,
  .ligne {
    /* Taille */
    inline-size: 27ch;
  }

  .input-conteneur.pourcentagelargeurtexte04,
  .input-conteneur.pourcentagelargeurtexte05,
  .input-conteneur.pourcentagelargeurtexte06,
  .input-conteneur.pourcentagelargeurtexte07,
  .input-conteneur.pourcentagelargeurtexte08,
  .input-conteneur.pourcentagelargeurtexte09,
  .input-conteneur.pourcentagelargeurtexte11,
  .input-conteneur.pourcentagelargeurtexte15,
  .input-conteneur.pourcentagelargeurtexte18,
  .input-conteneur.pourcentagelargeurtexte28,
  .input-conteneur.pourcentagelargeurtexte30,
  .input-conteneur.pourcentagelargeurtexte33,
  .input-conteneur.pourcentagelargeurtexte36,
  .input-conteneur.pourcentagelargeurtexte46 {
    /* Taille */
    inline-size: 27ch;
  }

  .lire-la-suite {
    /* Aspect visuel */
    visibility: visible;
    opacity: 1;
  }

  .menu-item-380 {
    /* Disposition */
    display: none;
  }

  .menu-primaire {
    /* Taille */
    inline-size: var(--menu-largeur);
  }

  .pied-menu .menu-item[aria-label="auteur-personnalise"] {
    /* Taille */
    max-inline-size: 100%;
  }

  .prestation-publier img,
  .prestation-ouvrage {
    /* Disposition */
    display: block;
  }

  .prestation-ligne {
    /* Disposition */
    grid-template-columns: repeat(1, 1fr);
  }

  .prestation-titre svg {
    /* Disposition */
    display: block;
    /* Taille */
    inline-size: 100%;
    block-size: auto;
    /* Espacement */
    margin-inline: auto;
  }

  .prestation-titre:hover svg {
    /* Annule l'effet de rétrécissement pour éviter des artefacts visuels sur petits écrans */
    inline-size: 100%;
    block-size: auto;
  }

  .texte-tres-important,
  .texte-tres-important p,
  .texte-tres-important span {
    /* Typographie */
    font-size: calc(100vw / 28);
    line-height: normal;
  }
}
@media (max-width: 420px) {
  .input-ligne,
  .ligne {
    /* Taille */
    inline-size: 25ch;
  }

  .input-conteneur.pourcentagelargeurtexte04,
  .input-conteneur.pourcentagelargeurtexte05,
  .input-conteneur.pourcentagelargeurtexte06,
  .input-conteneur.pourcentagelargeurtexte07,
  .input-conteneur.pourcentagelargeurtexte08,
  .input-conteneur.pourcentagelargeurtexte09,
  .input-conteneur.pourcentagelargeurtexte11,
  .input-conteneur.pourcentagelargeurtexte15,
  .input-conteneur.pourcentagelargeurtexte18,
  .input-conteneur.pourcentagelargeurtexte28,
  .input-conteneur.pourcentagelargeurtexte30,
  .input-conteneur.pourcentagelargeurtexte33,
  .input-conteneur.pourcentagelargeurtexte36,
  .input-conteneur.pourcentagelargeurtexte46 {
    /* Taille */
    inline-size: 25ch;
  }
}
@media (max-width: 350px) {
  .facture-historique > div {
    /* Disposition */
    flex-direction: column;
    /* Taille */
    inline-size: 100%; /* Assure que chaque div prend toute la largeur disponible */
  }
}

/* 
*******************************
À adapter à la charte graphique
*******************************
*/
.table-televersement {
  /* Taille */
  inline-size: 100%;
  /* Espacement */
  margin: 1rem 0;
  /* Aspect visuel */
  border-collapse: collapse;
}

.table-televersement th,
.table-televersement td {
  /* Disposition */
  text-align: left;
  /* Espacement */
  padding: 0.5rem;
  /* Aspect visuel */
  border-block-end: 1px solid #ddd;
}

.table-televersement th {
  /* Typographie */
  font-weight: bold;
  /* Aspect visuel */
  background-color: #f5f5f5;
}

.lien-televersement {
  /* Typographie */
  color: #0066cc;
  text-decoration: none;
}

.lien-televersement:hover {
  /* Typographie */
  text-decoration: underline;
}