/* 90-charte.css — LA CHARTE APPLIQUÉE (21/10/2026). Retours de l'associé (« manque d'uniformisation » ; textes trop
   grands d'au moins 15 % ; marges des bandeaux au moins doublées, comme la règle des 120 px ; pictos trop grands, comme
   ceux de « Nos valeurs » ; ombres des blocs à retirer, liseré en dégradé animé ; titres des blocs en dégradé ; légendes
   plus fines et plus claires ; contenu centré) et idée d'Anthony (« un système de balises pour normer la police et des
   espacements gérables et vérifiables dans le mode studio »).

   Règle : chaque texte du site a UN rôle (h1, h2, h3, h4, sous-titre, surtitre, légende, texte, carte, petit, bouton,
   menu, chiffre, champ) et prend taille, graisse, interligne et espacement des lettres de la balise de ce rôle
   (src/balises.json → 00-balises.css). Marges, hauteurs, boutons, pictos et blocs suivent aussi leurs balises.
   Cette feuille est HORS de la couche « ancien » (outils/construire.mjs) : elle prime sur toutes les feuilles écrites
   avant le 21/10, quelle que soit leur spécificité. Seule exception de la cascade : une déclaration « !important » de
   l'ancienne couche (téléphone tenu en paysage, validé le 18/10 ; mouvement réduit) passe encore devant.
   Paragraphe simple : « p:not([class]), p[class^="apparition"] » — le script du site ajoute « apparition » (puis
   « est-visible ») aux paragraphes sans classe ; un paragraphe qui a un rôle porte sa classe en premier.
   Hors charte, volontairement : la bulle Nova (.nova, .apercu-avatar), l'intro
   animée (.intro), la visionneuse d'images (.ex-visionneuse), la lettre d'attente du portrait (.membre__attente). */

/* ===================================================================================================================
   1. Police : tailles réelles. L'agrandissement de Satoshi (font-size-adjust, A-42 : lettres 11 % plus grandes que la
   taille écrite) est retiré : la taille d'une balise est la taille vue.
   =================================================================================================================== */
html,
.pied {
  font-size-adjust: none;
}

/* ===================================================================================================================
   2. Textes : un rôle, une balise.
   =================================================================================================================== */
body,
p,
li,
dd,
.section--legal :is(p, li, a),
.coordonnee__valeur,
.coordonnee__detail,
.champ__libelle,
.formulaire__message,
.pied__signature,
.pied__liens a,
.pied__contact a,
.pied__lieu {
  font-size: var(--b-texte-taille);
  font-weight: var(--b-texte-graisse);
  line-height: var(--b-texte-interligne);
  letter-spacing: var(--b-texte-espacement);
}

h1,
.h1 {
  font-size: var(--b-h1-taille);
  font-weight: var(--b-h1-graisse);
  line-height: var(--b-h1-interligne);
  letter-spacing: var(--b-h1-espacement);
}

h2,
.h2,
.titre-engagements {
  font-size: var(--b-h2-taille);
  font-weight: var(--b-h2-graisse);
  line-height: var(--b-h2-interligne);
  letter-spacing: var(--b-h2-espacement);
}

/* Les morceaux d'un titre (deuxième ligne, mot en dégradé) gardent la taille du titre : seuls la graisse et la couleur
   peuvent changer. */
:is(h1, h2, h3, h4, .h1, .h2, .h3, .h4) :is(span, strong, em) {
  font-size: inherit;
  line-height: inherit;
  letter-spacing: inherit;
}

h3,
.h3 {
  font-size: var(--b-h3-taille);
  font-weight: var(--b-h3-graisse);
  line-height: var(--b-h3-interligne);
  letter-spacing: var(--b-h3-espacement);
}

/* Titre de carte (T20, 01/11/2026) : les titres des encadrés lisent leur PROPRE balise (--b-titre-carte-*, aux valeurs
   d'origine de H3 : rendu identique), pour que le studio les règle sans toucher un H3 hors carte. :where() garde
   exactement la spécificité de l'ancienne règle (h3, .h3, .carte--engagement h4, .hero__carte .h4) ; posée juste après
   celle des H3, elle ne change aucune autre préséance. Même liste de conteneurs que studio/public/hn-apparence-regles.js. */
:where(.carte, .benefice, .mission__point, .etape, .etape-securite, .hero__carte) h3,
:where(.carte, .benefice, .mission__point, .etape, .etape-securite, .hero__carte) .h3,
.carte--engagement h4,
.hero__carte .h4 {
  font-size: var(--b-titre-carte-taille);
  font-weight: var(--b-titre-carte-graisse);
  line-height: var(--b-titre-carte-interligne);
  letter-spacing: var(--b-titre-carte-espacement);
}

h4,
.h4:not(.hero__carte .h4),
.sous-titre-carte {
  font-size: var(--b-h4-taille);
  font-weight: var(--b-h4-graisse);
  line-height: var(--b-h4-interligne);
  letter-spacing: var(--b-h4-espacement);
}

.surtitre,
.pied__titre {
  font-size: var(--b-surtitre-taille);
  font-weight: var(--b-surtitre-graisse);
  line-height: var(--b-surtitre-interligne);
  letter-spacing: var(--b-surtitre-espacement);
}

/* Légende : le texte d'introduction posé sous un titre (paragraphes d'en-tête d'une section, « lead » des hauts de
   page, texte des bandeaux d'appel). Associé : « typographie plus légère (Light) et une couleur moins foncée […] appliquée
   de manière cohérente sur l'ensemble du site ». */
.lead,
.section .conteneur > :is(p:not([class]), p[class^="apparition"]),
.entete-deux :is(p:not([class]), p[class^="apparition"]),
:is(.cta__contenu, .cta__texte) > p:not(.surtitre) {
  font-size: var(--b-legende-taille);
  font-weight: var(--b-legende-graisse);
  line-height: var(--b-legende-interligne);
  letter-spacing: var(--b-legende-espacement);
}

/* Sous-titre de section : la phrase forte posée entre le titre et la légende (« Faites de l'IA un véritable levier pour
   votre entreprise. ») ; sur une ligne à partir de la tablette. */
.lead:has(+ :is(p:not([class]), p[class^="apparition"])),
.lead--fort {
  font-size: var(--b-sous-titre-taille);
  font-weight: var(--b-sous-titre-graisse);
  line-height: var(--b-sous-titre-interligne);
  letter-spacing: var(--b-sous-titre-espacement);
}

/* Valeurs des coordonnées (Contact) : du texte, pas une légende. */
.lead.coordonnee__valeur {
  font-size: var(--b-texte-taille);
  font-weight: var(--b-texte-graisse);
  line-height: var(--b-texte-interligne);
}

.texte-carte,
.puces li,
.texte-avantage,
.membre__bandeau p,
.cta__carte p {
  font-size: var(--b-carte-taille);
  font-weight: var(--b-carte-graisse);
  line-height: var(--b-carte-interligne);
  letter-spacing: var(--b-carte-espacement);
}

.small,
.pied__discret,
.pied__barre p,
.pied__legal a,
.champ__erreur,
.formulaire__alerte,
.formulaire__confidentialite-texte :is(p, a),
.legal__maj,
.rdv__ou {
  font-size: var(--b-petit-taille);
  font-weight: var(--b-petit-graisse);
  line-height: var(--b-petit-interligne);
  letter-spacing: var(--b-petit-espacement);
}

.bouton,
.etape__numero {
  font-size: var(--b-bouton-taille);
  font-weight: var(--b-bouton-graisse);
  line-height: var(--b-bouton-interligne);
  letter-spacing: var(--b-bouton-espacement);
}

.entete__lien {
  font-size: var(--b-menu-taille);
  font-weight: var(--b-menu-graisse);
  line-height: var(--b-menu-interligne);
  letter-spacing: var(--b-menu-espacement);
}

.chiffre,
.etape-securite__numero {
  font-size: var(--b-chiffre-taille);
  font-weight: var(--b-chiffre-graisse);
  line-height: var(--b-chiffre-interligne);
  letter-spacing: var(--b-chiffre-espacement);
}

.champ__controle {
  font-size: var(--b-champ-taille);
  font-weight: var(--b-champ-graisse);
  line-height: var(--b-champ-interligne);
}

/* Libellés des champs : texte en demi-gras (la graisse distingue le libellé de la saisie). */
.champ__libelle {
  font-weight: 600;
}

/* ===================================================================================================================
   3. Couleurs : titres francs, légendes et textes de bloc plus clairs (associé : « accentuer la différence de couleur
   entre les titres et les descriptions »).
   =================================================================================================================== */
:is(.lead, .section .conteneur > :is(p:not([class]), p[class^="apparition"]), .entete-deux :is(p:not([class]), p[class^="apparition"])) {
  color: var(--b-couleur-legende-sur-sombre);
}

:is(.section--clair, .section--blanc, .section--legal) :is(.lead, .conteneur > :is(p:not([class]), p[class^="apparition"]), .entete-deux :is(p:not([class]), p[class^="apparition"])) {
  color: var(--b-couleur-legende-sur-clair);
}

:is(.lead:has(+ :is(p:not([class]), p[class^="apparition"])), .lead--fort) {
  color: var(--texte-principal);
}

:is(.section--clair, .section--blanc) :is(.lead:has(+ :is(p:not([class]), p[class^="apparition"])), .lead--fort) {
  color: var(--titre-sur-clair);
}

.texte-carte,
.puces li,
.texte-avantage {
  color: var(--b-couleur-carte-sur-sombre);
}

:is(.section--clair, .section--blanc) :is(.texte-carte, .puces li) {
  color: var(--b-couleur-carte-sur-clair);
}

:is(.carte--sombre, .carte--valeur, .carte--outil, .carte--formation, .carte--conference) :is(.texte-carte, .puces li) {
  color: var(--b-couleur-carte-sur-sombre);
}

/* Titres des cartes de Contact (« Envoyez-nous un message », « Une équipe à votre écoute ») : des titres de bloc
   larges, à la taille du sous-titre de section et à la graisse des titres. */
.contact__carte > h2 {
  font-size: var(--b-sous-titre-taille);
  font-weight: var(--b-h2-graisse);
  line-height: var(--b-sous-titre-interligne);
  letter-spacing: var(--b-sous-titre-espacement);
}

/* Texte entre parenthèses (associé : « une graisse plus légère (Light) ») : <span class="leger">. */
.leger {
  font-weight: 300;
}

/* ===================================================================================================================
   4. Marges des bandeaux : 120 px vides en haut et en bas (règle des marges ; 96 sur tablette, 72 sur téléphone).
   =================================================================================================================== */
.section {
  padding-top: var(--b-espace-section);
  padding-bottom: var(--b-espace-section);
}

.section--legal {
  padding-top: calc(var(--b-hauteur-entete) + var(--b-espace-section));
}

@media (max-width: 999px) {
  .section--image-gauche,
  .section--image-droite {
    padding-top: calc(260px + var(--b-espace-section));
  }
}

/* Écarts internes : ils viennent des balises par les anciennes variables (--espace-*), rebranchées dans 00-balises.css.
   La règle ci-dessous les impose là où une feuille de page avait posé sa propre valeur. */
.section .conteneur > * + :is(.grille, .logos, .etapes, .grille-contact),
.section__colonne > * + :is(.grille, .etapes) {
  margin-top: var(--b-espace-entete-contenu);
}

.section .conteneur > :is(.grille, .logos, .etapes, .ex-galerie) + .boutons {
  margin-top: var(--b-espace-contenu-boutons);
}

/* ===================================================================================================================
   5. Contenu centré dans chaque zone (règle des hauteurs : « Contenu centré dans chaque zone » ; associé : centrer les
   en-têtes de section, le titre puis les textes dessous, les blocs et leur contenu, les boutons sous le texte).
   Les pages légales gardent leur texte aligné à gauche (lecture longue).
   =================================================================================================================== */
.section:not(.section--legal) .conteneur > :is(.surtitre, h2, h3, .lead, :is(p:not([class]), p[class^="apparition"])),
.section__colonne > :is(.surtitre, h2, .lead, :is(p:not([class]), p[class^="apparition"])),
.pourquoi__texte > :is(.surtitre, h2, .lead, :is(p:not([class]), p[class^="apparition"])) {
  text-align: center;
  margin-left: auto;
  margin-right: auto;
}

.section:not(.section--legal) .conteneur > :is(.lead, :is(p:not([class]), p[class^="apparition"])),
.section__colonne > :is(.lead, :is(p:not([class]), p[class^="apparition"])),
.pourquoi__texte > :is(.lead, :is(p:not([class]), p[class^="apparition"])) {
  max-width: var(--b-conteneur-texte);
}

.section:not(.section--legal) .surtitre {
  justify-content: center;
}

/* En-têtes à deux colonnes (Formations : titre à gauche, texte à droite) : titre centré, texte centré dessous
   (associé : « centrer le titre et placer les textes en dessous, également centrés »). */
.entete-deux {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--b-espace-titre-texte);
  text-align: center;
}

.entete-deux > *,
.entete-deux__titre > * {
  margin-left: auto;
  margin-right: auto;
  text-align: center;
}

.entete-deux :is(.lead, p:not(.surtitre)) {
  max-width: var(--b-conteneur-texte);
}

/* Toutes les grilles de blocs à la largeur du contenu : leurs bords s'alignent sur les textes de la section (associé :
   « aligner les textes avec les blocs, au début comme à la fin » ; « harmoniser la largeur de tous les blocs »). */
.section .conteneur > :is(.grille, .grille-contact) {
  width: auto;
  max-width: none;
  margin-left: 0;
  margin-right: 0;
}

.section:not(.section--legal) :is(.conteneur, .section__colonne, .pourquoi__texte) > .boutons,
.cta .boutons {
  justify-content: center;
}

/* ===================================================================================================================
   6. Boutons : hauteur 46 px, texte 15 px, moins larges (associé : « trop grand, notamment en largeur »).
   =================================================================================================================== */
.boutons {
  gap: var(--b-bouton-ecart);
}

.bouton {
  height: var(--b-bouton-hauteur);
  padding: 0 var(--b-bouton-marge-laterale);
  border-radius: calc(var(--b-bouton-hauteur) / 2);
  gap: 10px;
}

.bouton .icone {
  width: var(--b-bouton-icone);
  height: var(--b-bouton-icone);
}

/* Flèche ronde des blocs : même hauteur que les boutons. */
.fleche {
  width: var(--b-bouton-hauteur);
  height: var(--b-bouton-hauteur);
}

.fleche .icone {
  width: var(--b-bouton-icone);
  height: var(--b-bouton-icone);
}

/* ===================================================================================================================
   7. Pictos : un seul dessin partout, celui de « Nos valeurs » (À propos) — trait fin de 1,5 px réel, dégradé commun,
   plus petits, sans pastille ni ombre.
   =================================================================================================================== */
.icone :is(path, circle, rect, line, polyline, polygon, ellipse) {
  vector-effect: non-scaling-stroke;
}

.icone {
  stroke-width: var(--b-picto-trait);
  box-shadow: none;
  filter: none;
}

:is(.carte--solution, .benefice, .carte--engagement, .mission__point, .carte--valeur, .carte--agent,
  .chiffre-bloc, .tuile-icone, .pastille) > .icone {
  width: var(--b-picto-taille);
  height: var(--b-picto-taille);
  padding: 0;
  border: 0;
  border-radius: 0;
  background: none;
  box-shadow: none;
  stroke: url(#degrade-icone);
  fill: none;
}

/* Pictos posés sur une vidéo (avantages du haut de l'Accueil, « Un projet ? » des bandeaux d'appel) : blancs, dans un
   cercle bleu nuit cerclé du dégradé (Anthony, 18/10 : « j'ai énormément de mal à lire les pictos sur le haut de
   page »), à la taille des autres pictos, sans ombre portée. */
:is(.hero__carte, .cta__carte) > .icone {
  box-sizing: border-box;
  width: calc(var(--b-picto-taille) + 24px);
  height: calc(var(--b-picto-taille) + 24px);
  padding: 15px;
  box-shadow: none;
}

/* Pictos vivants (Anthony, 18/10 : « Marée et Halo ») gardés, sans ombre (associé : « supprimer les ombres sous les
   pictogrammes ») : la couleur coule et le picto respire ; l'onde des pastilles reste, l'ombre portée part. */
@media (prefers-reduced-motion: no-preference) {
  #contenu :is(.carte--solution, .benefice, .carte--engagement, .mission__point, .carte--valeur, .carte--agent,
    .tuile-icone, .chiffre-bloc, .pastille) > .icone {
    animation-name: b-picto-vie;
  }

  #contenu :is(.hero__carte, .cta__carte) > .icone {
    animation-name: b-pastille-vie;
  }
}

@keyframes b-picto-vie {
  0%, 100% { filter: hue-rotate(-25deg); transform: scale(1); }
  14% { filter: hue-rotate(-12deg); transform: scale(1.06); }
  32% { filter: hue-rotate(5deg); transform: scale(1); }
  64% { filter: hue-rotate(38deg); transform: scale(1.06); }
  82% { filter: hue-rotate(10deg); transform: scale(1); }
}

@keyframes b-pastille-vie {
  0%, 100% { color: #ffffff; box-shadow: 0 0 0 0 rgba(0, 200, 255, 0.6); transform: scale(1); }
  16% { box-shadow: 0 0 0 14px rgba(0, 200, 255, 0); }
  30% { color: #7fe6ff; transform: scale(1.05); }
  50% { box-shadow: 0 0 0 0 rgba(164, 67, 233, 0.55); }
  66% { color: #cdb8ff; box-shadow: 0 0 0 14px rgba(164, 67, 233, 0); transform: scale(1); }
}

:is(.puces, .champ__saisie, .pied__contact, .coordonnee__pastille) .icone {
  width: var(--b-picto-taille-ligne);
  height: var(--b-picto-taille-ligne);
}

.tuile-icone,
.tuile-icone--clair {
  width: auto;
  height: auto;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: none;
  box-shadow: none;
}

/* ===================================================================================================================
   8. Blocs à picto : le style de « Nos valeurs » partout — fond plein, fin liseré en dégradé qui tourne lentement, aucune
   ombre ni lueur, contenu centré (picto en haut au centre, titre en dégradé, texte, bouton).
   =================================================================================================================== */
@property --b-angle {
  syntax: "<angle>";
  inherits: false;
  initial-value: 0deg;
}

:is(.carte--solution, .carte--valeur, .carte--engagement, .carte--agent, .carte--outil, .carte--generative, .benefice,
  .chiffre-bloc) {
  /* Fond UNI (Anthony, revue du 22/10 : « pourquoi avoir ajouté un fond de couleur », « que le cadre, pas l'intérieur ») :
     à 85 %, le dégradé du liseré, peint sous le fond, teintait tout le bloc. */
  --b-fond-bloc: #071331;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0;
  padding: var(--b-espace-carte-interieur);
  border: var(--b-carte-lisere) solid transparent;
  border-radius: var(--b-carte-rayon);
  background:
    linear-gradient(var(--b-fond-bloc), var(--b-fond-bloc)) padding-box,
    conic-gradient(from var(--b-angle), #00C8FF, #7776FF, #C34BEE, #7776FF, #00C8FF) border-box;
  box-shadow: none;
  text-align: center;
}

/* Blocs posés sur une section claire et blancs à l'origine : fond blanc, même liseré. Les solutions de l'Accueil aussi
   (Anthony, 22/10 : « pour que ce soit plus cohérent, mettre des cadres blancs ici aussi », comme les engagements). */
:is(.section--clair, .section--blanc) :is(.carte--engagement, .carte--solution, .carte--agent, .carte--generative, .benefice,
  .chiffre-bloc) {
  --b-fond-bloc: #FFFFFF;
}

/* Flèche ronde d'un bloc blanc : intérieur blanc, flèche bleu nuit (blanche, elle disparaissait). */
:is(.section--clair, .section--blanc) .carte--solution > .fleche {
  --fond-section: #FFFFFF;
  color: var(--titre-sur-clair);
}

:is(.carte--solution, .carte--valeur, .carte--engagement, .carte--agent, .carte--outil, .carte--generative, .benefice,
  .chiffre-bloc)::before,
:is(.carte--solution, .carte--valeur, .carte--engagement, .carte--agent, .carte--outil, .carte--generative, .benefice,
  .chiffre-bloc)::after {
  content: none;
}

@media (prefers-reduced-motion: no-preference) {
  :is(.carte--solution, .carte--valeur, .carte--engagement, .carte--agent, .carte--outil, .carte--generative, .benefice,
    .chiffre-bloc) {
    animation: b-lisere 12s linear infinite;
  }

  /* Départs décalés : les liserés voisins ne tournent pas ensemble. */
  :is(.carte--solution, .carte--valeur, .carte--engagement, .carte--agent, .carte--outil, .carte--generative, .benefice,
    .chiffre-bloc):nth-child(4n + 2) { animation-delay: -3s; }
  :is(.carte--solution, .carte--valeur, .carte--engagement, .carte--agent, .carte--outil, .carte--generative, .benefice,
    .chiffre-bloc):nth-child(4n + 3) { animation-delay: -6s; }
  :is(.carte--solution, .carte--valeur, .carte--engagement, .carte--agent, .carte--outil, .carte--generative, .benefice,
    .chiffre-bloc):nth-child(4n + 4) { animation-delay: -9s; }
}

@keyframes b-lisere {
  to { --b-angle: 360deg; }
}

/* Contenu des blocs : enveloppes (engagements, mission, chiffres, générative) mises en colonne centrée. */
:is(.carte--engagement, .mission__point, .chiffre-bloc, .carte--generative) > div,
.carte--generative > .carte__corps {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}

:is(.carte--solution, .carte--valeur, .carte--engagement, .carte--agent, .carte--outil, .carte--generative, .benefice,
  .mission__point, .chiffre-bloc) > :is(.icone, .tuile-icone) {
  margin: 0 0 var(--b-espace-picto-titre);
}

:is(.carte--solution, .carte--valeur, .carte--engagement, .carte--agent, .carte--outil, .carte--generative, .benefice,
  .mission__point, .chiffre-bloc) :is(h3, h4) {
  margin: 0;
}

:is(.carte--solution, .carte--valeur, .carte--engagement, .carte--agent, .carte--outil, .carte--generative, .benefice,
  .mission__point, .chiffre-bloc) :is(h3, h4) + :is(p, .sous-titre-carte) {
  margin-top: var(--b-espace-titre-texte-carte);
}

/* Bouton ou flèche d'un bloc : en bas du bloc (tous alignés sur une rangée), au moins à la balise « texte → bouton » du
   texte au-dessus. */
:is(.carte--solution, .carte--agent, .carte--outil, .carte--generative) > :is(p, ul, .carte__corps):has(+ :is(.bouton, .fleche)) {
  margin-bottom: var(--b-espace-carte-bouton);
}

:is(.carte--solution, .carte--agent, .carte--outil, .carte--generative) > :is(.bouton, .fleche) {
  margin-top: auto;
}

/* Titres des blocs à picto : en dégradé (associé : « appliquer un dégradé aux titres situés sous les pictogrammes »,
   « titres en dégradé » des engagements, de la mission, des valeurs). Dégradé assombri sur fond blanc (A-15). */
:is(.carte--solution, .carte--valeur, .carte--engagement, .carte--agent, .carte--outil, .carte--generative, .benefice,
  .mission__point, .hero__carte) :is(h3, h4, .h4),
.etape__texte > h3 {
  background-image: var(--degrade-accent);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  text-shadow: none;
}

:is(.section--clair, .section--blanc) :is(.carte--engagement, .carte--solution, .carte--agent, .carte--generative, .benefice,
  .mission__point) :is(h3, h4, .h4) {
  background-image: var(--degrade-accent-clair);
}

/* Écart entre les blocs d'une grille : la balise (certaines grilles étaient jointives). */
.section .conteneur > .grille:is(.grille--4, .grille--3, .grille--2, .grille--mission, .grille--formations, .grille--conferences) {
  column-gap: var(--b-espace-grille);
  row-gap: var(--b-espace-grille);
}

/* ===================================================================================================================
   9. Menu (associé : barre dégradée trop épaisse, à affiner, animer et faire glisser sous les liens au survol ;
   animation au survol ; logo plus petit et bien centré ; fond opacifié sous le blanc ; fin liseré dégradé sous le
   bandeau ; bouton « Nous contacter » trop grand, notamment en largeur).
   =================================================================================================================== */
html:root :is(.entete, .entete--defile) {
  border-bottom: 0;
  background-color: rgba(255, 255, 255, 0.95);
  box-shadow: none;
  -webkit-backdrop-filter: blur(16px) saturate(1.4);
  backdrop-filter: blur(16px) saturate(1.4);
}

/* Sous la barre en haut de page, c'est le fond de la page (bleu nuit) qui transparaissait : une bande blanche de la
   hauteur de la barre le remplace ; au défilement, c'est le contenu qui passe dessous, flouté. */
html:root body {
  background-image: linear-gradient(#FFFFFF, #FFFFFF);
  background-size: 100% calc(var(--b-hauteur-entete) + 2px);
  background-repeat: no-repeat;
}

/* T15c (01/11/2026, avenant 3) : le fin liseré dégradé de 1 px sous le bandeau (.entete::after) est retiré sur toutes
   les pages (Anthony : « le header de la page contact affiche une barre bleu en dessous c'est extrememat moche ») ;
   le trait sous le lien actif reste. */

.entete__logo--cartouche {
  padding: 0 40px 0 0;
  border: 0;
  background-color: transparent;
}

.entete__logo--cartouche::before {
  content: none;
}

.entete__logo img,
.entete__logo--cartouche img {
  display: block;
  height: 36px;
}

.entete__lien {
  transition: color 0.25s ease;
}

.entete__bouton.bouton {
  height: 40px;
  padding: 0 18px;
  gap: 8px;
  font-size: var(--b-menu-taille);
}

.entete__bouton.bouton .icone {
  width: 16px;
  height: 16px;
}

@media (min-width: 1200px) {
  .entete__nav {
    position: relative;
  }

  /* Le trait du lien courant devient un curseur fin (2 px) qui glisse sous le lien survolé et revient sous la page
     courante (src/js/charte.js) ; son dégradé coule doucement. Sans script : le trait fin, fixe, sous la page courante. */
  .entete__lien[aria-current="page"]::after {
    top: calc(100% + 9px);
    height: 2px;
    border-radius: 2px;
  }

  .entete__nav--curseur .entete__lien[aria-current="page"]::after {
    content: none;
  }

  .entete__curseur {
    position: absolute;
    left: 0;
    top: calc(100% + 9px);
    width: 0;
    height: 2px;
    border-radius: 2px;
    background-image: linear-gradient(90deg, #00C8FF, #7776FF, #C34BEE, #7776FF, #00C8FF);
    background-size: 200% 100%;
    opacity: 0;
    pointer-events: none;
  }

  html:root .entete__lien:hover {
    color: #0b1450;
  }
}

@media (min-width: 1200px) and (prefers-reduced-motion: no-preference) {
  .entete__curseur {
    transition: transform 0.4s cubic-bezier(0.3, 0.7, 0.2, 1), width 0.4s cubic-bezier(0.3, 0.7, 0.2, 1), opacity 0.2s ease;
    animation: b-curseur 3s linear infinite;
  }

  .entete__lien {
    transition: color 0.25s ease, transform 0.25s ease;
  }

  .entete__lien:hover {
    transform: translateY(-1px);
  }
}

@keyframes b-curseur {
  to { background-position: -200% 0; }
}

@media (max-width: 767px) {
  .entete__logo img,
  .entete__logo--cartouche img {
    height: 30px;
  }
}

/* ===================================================================================================================
   10. Pied de page (associé : fond blanc, pour le bon logo IA NOVATION ; « Interventions partout en France et en
   Suisse » retiré ; rubrique « Formations » ajoutée).
   =================================================================================================================== */
.pied {
  --fond-section: #FFFFFF;
  position: relative;
  padding: var(--b-espace-entete-contenu) 0 var(--b-espace-titre-texte);
  border-top: 0;
  background-color: #FFFFFF;
}

.pied::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  height: 1px;
  background-image: var(--degrade-accent);
  opacity: 0.7;
}

.pied__logo img {
  height: 40px;
  filter: none;
}

.pied__colonnes {
  grid-template-columns: minmax(0, 1.4fr) repeat(4, minmax(0, 1fr));
}

.pied__colonne {
  padding: 0 28px;
}

.pied__colonne + .pied__colonne {
  border-left: 1px solid rgba(11, 20, 80, 0.1);
}

.pied :is(.pied__signature, .pied__liens a, .pied__contact a, .pied__lieu, .pied__discret, .pied__barre p, .pied__legal a) {
  color: var(--texte-sur-clair);
}

.pied .pied__titre {
  color: var(--titre-sur-clair);
}

.pied :is(.pied__liens a, .pied__contact a, .pied__legal a):hover {
  color: var(--titre-sur-clair);
}

.pied__barre {
  border-top-color: rgba(11, 20, 80, 0.1);
}

.pied .reseau {
  color: var(--titre-sur-clair);
}

@media (max-width: 1199px) {
  .pied__colonnes {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    row-gap: 40px;
  }

  .pied__marque {
    grid-column: 1 / -1;
    padding: 0;
  }

  .pied__colonne {
    padding: 0 20px;
  }

  .pied__colonne:nth-child(2) {
    border-left: 0;
    padding-left: 0;
  }
}

@media (max-width: 767px) {
  .pied__colonnes {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .pied__colonne,
  .pied__colonne + .pied__colonne {
    padding: 0;
    border-left: 0;
  }
}

/* ===================================================================================================================
   11. Hauteurs (règle des hauteurs : haut de page 850 px menu compris, bandeau d'appel 550 px, à l'ordinateur ;
   « contenu centré dans chaque zone »). Associé : bandeaux du haut trop courts, « cette modification concerne tous les
   headers du site » ; la hauteur de l'Accueil (écran entier) est « validée ». Tablette et téléphone gardent les hauteurs
   réglées le 18/10 (A-45) ; téléphone tenu en paysage : réglage du 18/10 inchangé.
   =================================================================================================================== */
@media (min-width: 1200px) {
  .hero:not(.hero--erreur) {
    min-height: calc(var(--b-hauteur-haut-de-page) - var(--b-hauteur-entete));
  }

  .cta {
    height: auto;
    min-height: var(--b-hauteur-bandeau-appel);
    padding-top: 72px;
    padding-bottom: 72px;
  }
}

@media (min-width: 768px) and (max-width: 1199px) {
  .cta {
    height: auto;
    min-height: var(--b-hauteur-bandeau-appel);
    padding-top: 64px;
    padding-bottom: 64px;
  }
}

/* Bandeaux d'appel : tout centré, le bouton sous le texte (associé, Formations : « centrer tous les éléments de la
   section » ; Contact : « le bouton ne doit pas être positionné sur la droite, mais sous le texte, parfaitement
   centré »). */
.cta :is(.cta__contenu, .cta__texte) {
  text-align: center;
}

.cta :is(.cta__contenu, .cta__texte) > * {
  margin-left: auto;
  margin-right: auto;
}

.cta :is(.cta__contenu, .cta__texte) > :is(p:not(.surtitre)) {
  max-width: var(--b-conteneur-texte);
}

.cta .surtitre {
  justify-content: center;
}

.cta--contact .cta__texte {
  max-width: none;
}

.cta__actions {
  flex-direction: column;
  align-items: center;
  gap: var(--b-espace-texte-bouton);
  margin-top: var(--b-espace-entete-contenu);
}

.cta__cartes {
  justify-content: center;
  width: 100%;
  max-width: 960px;
}

.cta__carte {
  align-items: center;
  text-align: center;
}

/* ===================================================================================================================
   12. Demandes page par page (lot 3, PDF de l'associé « modif site ia novation v1 »).
   =================================================================================================================== */

/* Accueil, haut : « mettre en gras et en dégradé les mots accessible et concrète ; conserver le reste du texte en
   blanc, avec une graisse normale ». */
body[data-page="accueil"] .hero h1,
body[data-page="accueil"] .hero h1 .h1__suite {
  font-weight: 400;
  color: #fff;
}

body[data-page="accueil"] .hero h1 .degrade {
  font-weight: 700;
}

/* « Animer la flèche du bouton En savoir plus » : la flèche des boutons du haut de page avance et revient ; celle de
   tous les boutons avance au survol. Rien pour qui a demandé moins d'animations. */
.bouton > .icone:last-child {
  transition: transform 0.3s ease;
}

.bouton:is(:hover, :focus-visible) > .icone:last-child {
  transform: translateX(4px);
}

@media (prefers-reduced-motion: no-preference) {
  .hero .bouton > .icone:last-child {
    animation: b-fleche 1.8s ease-in-out infinite;
  }
}

@keyframes b-fleche {
  0%, 100% { transform: translateX(0); }
  50% { transform: translateX(5px); }
}

/* Textes entre parenthèses des titres de bloc (« Humanova Technology® ») : en Light, comme ceux des textes. */
.h3__suite {
  font-weight: 300;
}

/* Accueil, notre approche : « la photo n'est pas du tout bien intégrée ». Elle grandit (60 % de la largeur) et se
   fond dans le bleu nuit par un ovale, sans bords droits (avant : fondus en bandes en haut, en bas et à droite). Le
   bouton s'éloigne du texte (« trop proche ») : balise « contenu → boutons ». */
@media (min-width: 1000px) {
  body[data-page="accueil"] [data-section="approche"] > .section__image {
    width: 60%;
    -webkit-mask-image: radial-gradient(ellipse 62% 50% at 42% 50%, #000 40%, transparent 100%);
    mask-image: radial-gradient(ellipse 62% 50% at 42% 50%, #000 40%, transparent 100%);
  }

  body[data-page="accueil"] [data-section="approche"]::after {
    content: none;
  }
}

body[data-page="accueil"] [data-section="approche"] .etapes + .boutons {
  margin-top: var(--b-espace-contenu-boutons);
}

/* Accueil, notre différence : « conserver IA NOVATION en noir ». */
body[data-page="accueil"] [data-section="pourquoi"] .titre__suite--bleu {
  color: var(--titre-sur-clair);
}

/* Accueil, ils nous font confiance : « les logos sont trop petits » — tuiles de 136 × 120 à 184 × 152. */
.logo-client {
  width: 184px;
  height: 152px;
  padding: 10px;
}

@media (max-width: 767px) {
  .logo-client {
    width: 148px;
    height: 124px;
  }
}

/* Nos solutions, IA générative : photo retirée, tout centré (« supprimer la photo du coin supérieur gauche ;
   centrer tous les éléments ») ; le dégradé qui fondait la photo part avec elle. */
body[data-page="nos-solutions"] [data-section="generative"]::after {
  content: none;
}

body[data-page="nos-solutions"] [data-section="generative"] .section__colonne {
  max-width: var(--b-conteneur-texte);
  margin-left: auto;
  margin-right: auto;
  text-align: center;
}

body[data-page="nos-solutions"] [data-section="generative"] .section__colonne .surtitre {
  justify-content: center;
}

body[data-page="nos-solutions"] [data-section="generative"] .grille--generative {
  margin-top: var(--b-espace-entete-contenu);
}

/* Nos solutions, agents IA : « centrer le texte ». */
body[data-page="nos-solutions"] [data-section="agents"] .lead {
  margin-left: auto;
  margin-right: auto;
  text-align: center;
}

/* Formations en entreprise : « aligner les textes avec les blocs, aussi bien au début qu'à la fin » — le texte d'en-tête
   prend la largeur des blocs (bord gauche du premier, bord droit du dernier). À propos, notre mission : même demande
   (« plus large et aligné avec les éléments du bandeau des pictogrammes »), et plus d'espace avant ce bandeau. */
body[data-page="formations"] [data-section="entreprise"] .conteneur > :is(p:not(.surtitre), .entete-deux p),
body[data-page="a-propos"] [data-section="mission"] .conteneur > p:not(.surtitre) {
  max-width: none;
}

body[data-page="a-propos"] [data-section="mission"] .conteneur > .grille--mission {
  margin-top: var(--b-espace-entete-contenu);
}

/* Contact : « harmoniser la largeur de tous les blocs » — l'agenda prend la largeur du formulaire et des coordonnées. */
body[data-page="contact"] :is(.rdv, .rdv__agenda) {
  max-width: none;
}

/* ===================================================================================================================
   13. Revue 1 (formulaire d'Anthony, 22/10 : apercu-video/revue/reponses.json ; numéros = ceux du formulaire).
   =================================================================================================================== */

/* (8) Menu : « il manque la texture un peu numérique (un peu le même effet que le menu CCM) » ; revue 2 : « pas fan de
   la texture » ; choix d'Anthony le 22/10 parmi 49 propositions (formulaire, n° 8 : « 1 ») : des courbes de niveau,
   le relief des montagnes, au trait dégradé de la charte, qui dérivent très lentement (une boucle de 90 s) ; figées
   pour qui demande moins de mouvement. Dessin : atelier-ianovation-v2/charte/textures-menu-elab.py (« topographie »). */
html:root .entete {
  background-image: none;
}

html:root .entete::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1200' height='80' viewBox='0 0 1200 80'%3E%3Cdefs%3E%3ClinearGradient id='t' gradientUnits='userSpaceOnUse' x1='0' y1='0' x2='1200' y2='0' spreadMethod='repeat'%3E%3Cstop offset='0' stop-color='%2300C8FF'/%3E%3Cstop offset='0.33' stop-color='%237776FF'/%3E%3Cstop offset='0.66' stop-color='%23C34BEE'/%3E%3Cstop offset='1' stop-color='%2300C8FF'/%3E%3C/linearGradient%3E%3C/defs%3E%3Cg fill='none' stroke='url(%23t)' stroke-width='.9'%3E%3Cpath d='M0 4 L15 5.9 L30 7.5 L45 8.6 L60 9.2 L75 9.3 L90 9 L105 8.6 L120 8.4 L135 8.3 L150 8.6 L165 9 L180 9.4 L195 9.6 L210 9.5 L225 8.9 L240 7.9 L255 6.7 L270 5.6 L285 4.8 L300 4.5 L315 4.8 L330 5.6 L345 6.7 L360 7.9 L375 8.9 L390 9.5 L405 9.6 L420 9.4 L435 9 L450 8.6 L465 8.3 L480 8.4 L495 8.6 L510 9 L525 9.3 L540 9.2 L555 8.6 L570 7.5 L585 5.9 L600 4 L615 2.1 L630 0.5 L645 -0.6 L660 -1.2 L675 -1.3 L690 -1 L705 -0.6 L720 -0.4 L735 -0.3 L750 -0.6 L765 -1 L780 -1.4 L795 -1.6 L810 -1.5 L825 -0.9 L840 0.1 L855 1.3 L870 2.4 L885 3.2 L900 3.5 L915 3.2 L930 2.4 L945 1.3 L960 0.1 L975 -0.9 L990 -1.5 L1005 -1.6 L1020 -1.4 L1035 -1 L1050 -0.6 L1065 -0.3 L1080 -0.4 L1095 -0.6 L1110 -1 L1125 -1.3 L1140 -1.2 L1155 -0.6 L1170 0.5 L1185 2.1 L1200 4 L1215 5.9 L1230 7.5 L1245 8.6 L1260 9.2 L1275 9.3 L1290 9 L1305 8.6 L1320 8.4 L1335 8.3 L1350 8.6 L1365 9 L1380 9.4 L1395 9.6 L1410 9.5 L1425 8.9 L1440 7.9 L1455 6.7 L1470 5.6 L1485 4.8 L1500 4.5 L1515 4.8 L1530 5.6 L1545 6.7 L1560 7.9 L1575 8.9 L1590 9.5 L1605 9.6 L1620 9.4 L1635 9 L1650 8.6 L1665 8.3 L1680 8.4 L1695 8.6 L1710 9 L1725 9.3 L1740 9.2 L1755 8.6 L1770 7.5 L1785 5.9 L1800 4 L1815 2.1 L1830 0.5 L1845 -0.6 L1860 -1.2 L1875 -1.3 L1890 -1 L1905 -0.6 L1920 -0.4 L1935 -0.3 L1950 -0.6 L1965 -1 L1980 -1.4 L1995 -1.6 L2010 -1.5 L2025 -0.9 L2040 0.1 L2055 1.3 L2070 2.4 L2085 3.2 L2100 3.5 L2115 3.2 L2130 2.4 L2145 1.3 L2160 0.1 L2175 -0.9 L2190 -1.5 L2205 -1.6 L2220 -1.4 L2235 -1 L2250 -0.6 L2265 -0.3 L2280 -0.4 L2295 -0.6 L2310 -1 L2325 -1.3 L2340 -1.2 L2355 -0.6 L2370 0.5 L2385 2.1 L2400 4' stroke-opacity='0.18'/%3E%3Cpath d='M0 21.6 L15 21.3 L30 20.4 L45 19.1 L60 17.6 L75 16.2 L90 15.1 L105 14.4 L120 14.3 L135 14.5 L150 14.9 L165 15.4 L180 15.6 L195 15.5 L210 15.1 L225 14.6 L240 14.1 L255 13.9 L270 14.1 L285 14.7 L300 15.5 L315 16.5 L330 17.2 L345 17.5 L360 17.2 L375 16.4 L390 15 L405 13.4 L420 11.9 L435 10.5 L450 9.6 L465 9 L480 8.8 L495 8.7 L510 8.4 L525 8 L540 7.3 L555 6.3 L570 5.4 L585 4.7 L600 4.4 L615 4.7 L630 5.6 L645 6.9 L660 8.4 L675 9.8 L690 10.9 L705 11.6 L720 11.7 L735 11.5 L750 11.1 L765 10.6 L780 10.4 L795 10.5 L810 10.9 L825 11.4 L840 11.9 L855 12.1 L870 11.9 L885 11.3 L900 10.5 L915 9.5 L930 8.8 L945 8.5 L960 8.8 L975 9.6 L990 11 L1005 12.6 L1020 14.1 L1035 15.5 L1050 16.4 L1065 17 L1080 17.2 L1095 17.3 L1110 17.6 L1125 18 L1140 18.7 L1155 19.7 L1170 20.6 L1185 21.3 L1200 21.6 L1215 21.3 L1230 20.4 L1245 19.1 L1260 17.6 L1275 16.2 L1290 15.1 L1305 14.4 L1320 14.3 L1335 14.5 L1350 14.9 L1365 15.4 L1380 15.6 L1395 15.5 L1410 15.1 L1425 14.6 L1440 14.1 L1455 13.9 L1470 14.1 L1485 14.7 L1500 15.5 L1515 16.5 L1530 17.2 L1545 17.5 L1560 17.2 L1575 16.4 L1590 15 L1605 13.4 L1620 11.9 L1635 10.5 L1650 9.6 L1665 9 L1680 8.8 L1695 8.7 L1710 8.4 L1725 8 L1740 7.3 L1755 6.3 L1770 5.4 L1785 4.7 L1800 4.4 L1815 4.7 L1830 5.6 L1845 6.9 L1860 8.4 L1875 9.8 L1890 10.9 L1905 11.6 L1920 11.7 L1935 11.5 L1950 11.1 L1965 10.6 L1980 10.4 L1995 10.5 L2010 10.9 L2025 11.4 L2040 11.9 L2055 12.1 L2070 11.9 L2085 11.3 L2100 10.5 L2115 9.5 L2130 8.8 L2145 8.5 L2160 8.8 L2175 9.6 L2190 11 L2205 12.6 L2220 14.1 L2235 15.5 L2250 16.4 L2265 17 L2280 17.2 L2295 17.3 L2310 17.6 L2325 18 L2340 18.7 L2355 19.7 L2370 20.6 L2385 21.3 L2400 21.6' stroke-opacity='0.22'/%3E%3Cpath d='M0 22.8 L15 21.6 L30 20.5 L45 19.6 L60 19.3 L75 19.4 L90 20.1 L105 21.2 L120 22.3 L135 23.2 L150 23.7 L165 23.7 L180 23.2 L195 22.4 L210 21.5 L225 20.6 L240 20.1 L255 19.8 L270 19.8 L285 19.8 L300 19.6 L315 19.1 L330 18.3 L345 17 L360 15.6 L375 14.2 L390 13.1 L405 12.6 L420 12.7 L435 13.4 L450 14.5 L465 15.8 L480 17 L495 18 L510 18.6 L525 18.9 L540 19 L555 19.2 L570 19.5 L585 20.2 L600 21.2 L615 22.4 L630 23.5 L645 24.4 L660 24.7 L675 24.6 L690 23.9 L705 22.8 L720 21.7 L735 20.8 L750 20.3 L765 20.3 L780 20.8 L795 21.6 L810 22.5 L825 23.4 L840 23.9 L855 24.2 L870 24.2 L885 24.2 L900 24.4 L915 24.9 L930 25.7 L945 27 L960 28.4 L975 29.8 L990 30.9 L1005 31.4 L1020 31.3 L1035 30.6 L1050 29.5 L1065 28.2 L1080 27 L1095 26 L1110 25.4 L1125 25.1 L1140 25 L1155 24.8 L1170 24.5 L1185 23.8 L1200 22.8 L1215 21.6 L1230 20.5 L1245 19.6 L1260 19.3 L1275 19.4 L1290 20.1 L1305 21.2 L1320 22.3 L1335 23.2 L1350 23.7 L1365 23.7 L1380 23.2 L1395 22.4 L1410 21.5 L1425 20.6 L1440 20.1 L1455 19.8 L1470 19.8 L1485 19.8 L1500 19.6 L1515 19.1 L1530 18.3 L1545 17 L1560 15.6 L1575 14.2 L1590 13.1 L1605 12.6 L1620 12.7 L1635 13.4 L1650 14.5 L1665 15.8 L1680 17 L1695 18 L1710 18.6 L1725 18.9 L1740 19 L1755 19.2 L1770 19.5 L1785 20.2 L1800 21.2 L1815 22.4 L1830 23.5 L1845 24.4 L1860 24.7 L1875 24.6 L1890 23.9 L1905 22.8 L1920 21.7 L1935 20.8 L1950 20.3 L1965 20.3 L1980 20.8 L1995 21.6 L2010 22.5 L2025 23.4 L2040 23.9 L2055 24.2 L2070 24.2 L2085 24.2 L2100 24.4 L2115 24.9 L2130 25.7 L2145 27 L2160 28.4 L2175 29.8 L2190 30.9 L2205 31.4 L2220 31.3 L2235 30.6 L2250 29.5 L2265 28.2 L2280 27 L2295 26 L2310 25.4 L2325 25.1 L2340 25 L2355 24.8 L2370 24.5 L2385 23.8 L2400 22.8' stroke-opacity='0.26'/%3E%3Cpath d='M0 28 L15 27.7 L30 27.7 L45 28.1 L60 28.7 L75 29.4 L90 30 L105 30.2 L120 30 L135 29.1 L150 27.9 L165 26.4 L180 25 L195 23.9 L210 23.3 L225 23.2 L240 23.6 L255 24.3 L270 25 L285 25.6 L300 25.9 L315 26.1 L330 26.1 L345 26.1 L360 26.5 L375 27.3 L390 28.6 L405 30.2 L420 32 L435 33.7 L450 35 L465 35.7 L480 35.8 L495 35.4 L510 34.7 L525 34 L540 33.4 L555 33.1 L570 33.2 L585 33.5 L600 34 L615 34.3 L630 34.3 L645 33.9 L660 33.3 L675 32.6 L690 32 L705 31.8 L720 32 L735 32.9 L750 34.1 L765 35.6 L780 37 L795 38.1 L810 38.7 L825 38.8 L840 38.4 L855 37.7 L870 37 L885 36.4 L900 36.1 L915 35.9 L930 35.9 L945 35.9 L960 35.5 L975 34.7 L990 33.4 L1005 31.8 L1020 30 L1035 28.3 L1050 27 L1065 26.3 L1080 26.2 L1095 26.6 L1110 27.3 L1125 28 L1140 28.6 L1155 28.9 L1170 28.8 L1185 28.5 L1200 28 L1215 27.7 L1230 27.7 L1245 28.1 L1260 28.7 L1275 29.4 L1290 30 L1305 30.2 L1320 30 L1335 29.1 L1350 27.9 L1365 26.4 L1380 25 L1395 23.9 L1410 23.3 L1425 23.2 L1440 23.6 L1455 24.3 L1470 25 L1485 25.6 L1500 25.9 L1515 26.1 L1530 26.1 L1545 26.1 L1560 26.5 L1575 27.3 L1590 28.6 L1605 30.2 L1620 32 L1635 33.7 L1650 35 L1665 35.7 L1680 35.8 L1695 35.4 L1710 34.7 L1725 34 L1740 33.4 L1755 33.1 L1770 33.2 L1785 33.5 L1800 34 L1815 34.3 L1830 34.3 L1845 33.9 L1860 33.3 L1875 32.6 L1890 32 L1905 31.8 L1920 32 L1935 32.9 L1950 34.1 L1965 35.6 L1980 37 L1995 38.1 L2010 38.7 L2025 38.8 L2040 38.4 L2055 37.7 L2070 37 L2085 36.4 L2100 36.1 L2115 35.9 L2130 35.9 L2145 35.9 L2160 35.5 L2175 34.7 L2190 33.4 L2205 31.8 L2220 30 L2235 28.3 L2250 27 L2265 26.3 L2280 26.2 L2295 26.6 L2310 27.3 L2325 28 L2340 28.6 L2355 28.9 L2370 28.8 L2385 28.5 L2400 28' stroke-opacity='0.18'/%3E%3Cpath d='M0 35.7 L15 35.5 L30 35.6 L45 36 L60 36.3 L75 36.5 L90 36.4 L105 36 L120 35.4 L135 34.9 L150 34.6 L165 34.7 L180 35.5 L195 36.8 L210 38.6 L225 40.4 L240 42.2 L255 43.6 L270 44.5 L285 44.9 L300 44.9 L315 44.8 L330 44.7 L345 44.8 L360 45.2 L375 45.7 L390 46.3 L405 46.7 L420 46.7 L435 46.2 L450 45.3 L465 44 L480 42.7 L495 41.5 L510 40.8 L525 40.6 L540 41 L555 41.8 L570 42.8 L585 43.6 L600 44.3 L615 44.5 L630 44.4 L645 44 L660 43.7 L675 43.5 L690 43.6 L705 44 L720 44.6 L735 45.1 L750 45.4 L765 45.3 L780 44.5 L795 43.2 L810 41.4 L825 39.6 L840 37.8 L855 36.4 L870 35.5 L885 35.1 L900 35.1 L915 35.2 L930 35.3 L945 35.2 L960 34.8 L975 34.3 L990 33.7 L1005 33.3 L1020 33.3 L1035 33.8 L1050 34.7 L1065 36 L1080 37.3 L1095 38.5 L1110 39.2 L1125 39.4 L1140 39 L1155 38.2 L1170 37.2 L1185 36.4 L1200 35.7 L1215 35.5 L1230 35.6 L1245 36 L1260 36.3 L1275 36.5 L1290 36.4 L1305 36 L1320 35.4 L1335 34.9 L1350 34.6 L1365 34.7 L1380 35.5 L1395 36.8 L1410 38.6 L1425 40.4 L1440 42.2 L1455 43.6 L1470 44.5 L1485 44.9 L1500 44.9 L1515 44.8 L1530 44.7 L1545 44.8 L1560 45.2 L1575 45.7 L1590 46.3 L1605 46.7 L1620 46.7 L1635 46.2 L1650 45.3 L1665 44 L1680 42.7 L1695 41.5 L1710 40.8 L1725 40.6 L1740 41 L1755 41.8 L1770 42.8 L1785 43.6 L1800 44.3 L1815 44.5 L1830 44.4 L1845 44 L1860 43.7 L1875 43.5 L1890 43.6 L1905 44 L1920 44.6 L1935 45.1 L1950 45.4 L1965 45.3 L1980 44.5 L1995 43.2 L2010 41.4 L2025 39.6 L2040 37.8 L2055 36.4 L2070 35.5 L2085 35.1 L2100 35.1 L2115 35.2 L2130 35.3 L2145 35.2 L2160 34.8 L2175 34.3 L2190 33.7 L2205 33.3 L2220 33.3 L2235 33.8 L2250 34.7 L2265 36 L2280 37.3 L2295 38.5 L2310 39.2 L2325 39.4 L2340 39 L2355 38.2 L2370 37.2 L2385 36.4 L2400 35.7' stroke-opacity='0.22'/%3E%3Cpath d='M0 46.5 L15 47.8 L30 49.2 L45 50.4 L60 51.4 L75 52 L90 52.3 L105 52.5 L120 52.7 L135 53.2 L150 54 L165 55.1 L180 56.3 L195 57.4 L210 58 L225 58.1 L240 57.6 L255 56.6 L270 55.1 L285 53.7 L300 52.4 L315 51.4 L330 51 L345 50.9 L360 51.1 L375 51.3 L390 51.3 L405 51.1 L420 50.5 L435 49.8 L450 49.2 L465 48.8 L480 48.7 L495 49.2 L510 50.1 L525 51.1 L540 52.1 L555 52.8 L570 52.9 L585 52.5 L600 51.5 L615 50.2 L630 48.8 L645 47.6 L660 46.6 L675 46 L690 45.7 L705 45.5 L720 45.3 L735 44.8 L750 44 L765 42.9 L780 41.7 L795 40.6 L810 40 L825 39.9 L840 40.4 L855 41.4 L870 42.9 L885 44.3 L900 45.6 L915 46.6 L930 47 L945 47.1 L960 46.9 L975 46.7 L990 46.7 L1005 46.9 L1020 47.5 L1035 48.2 L1050 48.8 L1065 49.2 L1080 49.3 L1095 48.8 L1110 47.9 L1125 46.9 L1140 45.9 L1155 45.2 L1170 45.1 L1185 45.5 L1200 46.5 L1215 47.8 L1230 49.2 L1245 50.4 L1260 51.4 L1275 52 L1290 52.3 L1305 52.5 L1320 52.7 L1335 53.2 L1350 54 L1365 55.1 L1380 56.3 L1395 57.4 L1410 58 L1425 58.1 L1440 57.6 L1455 56.6 L1470 55.1 L1485 53.7 L1500 52.4 L1515 51.4 L1530 51 L1545 50.9 L1560 51.1 L1575 51.3 L1590 51.3 L1605 51.1 L1620 50.5 L1635 49.8 L1650 49.2 L1665 48.8 L1680 48.7 L1695 49.2 L1710 50.1 L1725 51.1 L1740 52.1 L1755 52.8 L1770 52.9 L1785 52.5 L1800 51.5 L1815 50.2 L1830 48.8 L1845 47.6 L1860 46.6 L1875 46 L1890 45.7 L1905 45.5 L1920 45.3 L1935 44.8 L1950 44 L1965 42.9 L1980 41.7 L1995 40.6 L2010 40 L2025 39.9 L2040 40.4 L2055 41.4 L2070 42.9 L2085 44.3 L2100 45.6 L2115 46.6 L2130 47 L2145 47.1 L2160 46.9 L2175 46.7 L2190 46.7 L2205 46.9 L2220 47.5 L2235 48.2 L2250 48.8 L2265 49.2 L2280 49.3 L2295 48.8 L2310 47.9 L2325 46.9 L2340 45.9 L2355 45.2 L2370 45.1 L2385 45.5 L2400 46.5' stroke-opacity='0.26'/%3E%3Cpath d='M0 65.9 L15 66.8 L30 67.2 L45 66.9 L60 66.1 L75 65.1 L90 64 L105 63.1 L120 62.4 L135 62.1 L150 61.9 L165 61.7 L180 61.3 L195 60.6 L210 59.5 L225 58.1 L240 56.7 L255 55.5 L270 54.7 L285 54.5 L300 54.9 L315 55.7 L330 56.7 L345 57.7 L360 58.4 L375 58.6 L390 58.4 L405 57.9 L420 57.2 L435 56.6 L450 56.1 L465 56 L480 56.2 L495 56.4 L510 56.5 L525 56.2 L540 55.6 L555 54.4 L570 53 L585 51.4 L600 50.1 L615 49.2 L630 48.8 L645 49.1 L660 49.9 L675 50.9 L690 52 L705 52.9 L720 53.6 L735 53.9 L750 54.1 L765 54.3 L780 54.7 L795 55.4 L810 56.5 L825 57.9 L840 59.3 L855 60.5 L870 61.3 L885 61.5 L900 61.1 L915 60.3 L930 59.3 L945 58.3 L960 57.6 L975 57.4 L990 57.6 L1005 58.1 L1020 58.8 L1035 59.4 L1050 59.9 L1065 60 L1080 59.8 L1095 59.6 L1110 59.5 L1125 59.8 L1140 60.4 L1155 61.6 L1170 63 L1185 64.6 L1200 65.9 L1215 66.8 L1230 67.2 L1245 66.9 L1260 66.1 L1275 65.1 L1290 64 L1305 63.1 L1320 62.4 L1335 62.1 L1350 61.9 L1365 61.7 L1380 61.3 L1395 60.6 L1410 59.5 L1425 58.1 L1440 56.7 L1455 55.5 L1470 54.7 L1485 54.5 L1500 54.9 L1515 55.7 L1530 56.7 L1545 57.7 L1560 58.4 L1575 58.6 L1590 58.4 L1605 57.9 L1620 57.2 L1635 56.6 L1650 56.1 L1665 56 L1680 56.2 L1695 56.4 L1710 56.5 L1725 56.2 L1740 55.6 L1755 54.4 L1770 53 L1785 51.4 L1800 50.1 L1815 49.2 L1830 48.8 L1845 49.1 L1860 49.9 L1875 50.9 L1890 52 L1905 52.9 L1920 53.6 L1935 53.9 L1950 54.1 L1965 54.3 L1980 54.7 L1995 55.4 L2010 56.5 L2025 57.9 L2040 59.3 L2055 60.5 L2070 61.3 L2085 61.5 L2100 61.1 L2115 60.3 L2130 59.3 L2145 58.3 L2160 57.6 L2175 57.4 L2190 57.6 L2205 58.1 L2220 58.8 L2235 59.4 L2250 59.9 L2265 60 L2280 59.8 L2295 59.6 L2310 59.5 L2325 59.8 L2340 60.4 L2355 61.6 L2370 63 L2385 64.6 L2400 65.9' stroke-opacity='0.18'/%3E%3Cpath d='M0 70.7 L15 69.2 L30 67.3 L45 65.5 L60 63.9 L75 62.7 L90 62.2 L105 62.2 L120 62.5 L135 63.1 L150 63.6 L165 63.8 L180 63.7 L195 63.4 L210 63 L225 62.7 L240 62.7 L255 63.1 L270 63.8 L285 64.8 L300 65.7 L315 66.3 L330 66.5 L345 66.1 L360 65.1 L375 63.9 L390 62.5 L405 61.3 L420 60.5 L435 60.2 L450 60.3 L465 60.7 L480 61.3 L495 61.7 L510 61.9 L525 61.9 L540 61.7 L555 61.5 L570 61.6 L585 62.2 L600 63.3 L615 64.8 L630 66.7 L645 68.5 L660 70.1 L675 71.3 L690 71.8 L705 71.8 L720 71.5 L735 70.9 L750 70.4 L765 70.2 L780 70.3 L795 70.6 L810 71 L825 71.3 L840 71.3 L855 70.9 L870 70.2 L885 69.2 L900 68.3 L915 67.7 L930 67.5 L945 67.9 L960 68.9 L975 70.1 L990 71.5 L1005 72.7 L1020 73.5 L1035 73.8 L1050 73.7 L1065 73.3 L1080 72.7 L1095 72.3 L1110 72.1 L1125 72.1 L1140 72.3 L1155 72.5 L1170 72.4 L1185 71.8 L1200 70.7 L1215 69.2 L1230 67.3 L1245 65.5 L1260 63.9 L1275 62.7 L1290 62.2 L1305 62.2 L1320 62.5 L1335 63.1 L1350 63.6 L1365 63.8 L1380 63.7 L1395 63.4 L1410 63 L1425 62.7 L1440 62.7 L1455 63.1 L1470 63.8 L1485 64.8 L1500 65.7 L1515 66.3 L1530 66.5 L1545 66.1 L1560 65.1 L1575 63.9 L1590 62.5 L1605 61.3 L1620 60.5 L1635 60.2 L1650 60.3 L1665 60.7 L1680 61.3 L1695 61.7 L1710 61.9 L1725 61.9 L1740 61.7 L1755 61.5 L1770 61.6 L1785 62.2 L1800 63.3 L1815 64.8 L1830 66.7 L1845 68.5 L1860 70.1 L1875 71.3 L1890 71.8 L1905 71.8 L1920 71.5 L1935 70.9 L1950 70.4 L1965 70.2 L1980 70.3 L1995 70.6 L2010 71 L2025 71.3 L2040 71.3 L2055 70.9 L2070 70.2 L2085 69.2 L2100 68.3 L2115 67.7 L2130 67.5 L2145 67.9 L2160 68.9 L2175 70.1 L2190 71.5 L2205 72.7 L2220 73.5 L2235 73.8 L2250 73.7 L2265 73.3 L2280 72.7 L2295 72.3 L2310 72.1 L2325 72.1 L2340 72.3 L2355 72.5 L2370 72.4 L2385 71.8 L2400 70.7' stroke-opacity='0.22'/%3E%3Cpath d='M0 69.2 L15 68.5 L30 68.3 L45 68.5 L60 69.3 L75 70.5 L90 71.9 L105 73.3 L120 74.4 L135 75 L150 75 L165 74.6 L180 73.9 L195 73.2 L210 72.7 L225 72.5 L240 72.6 L255 73 L270 73.4 L285 73.6 L300 73.5 L315 73.1 L330 72.3 L345 71.5 L360 70.9 L375 70.6 L390 71 L405 71.9 L420 73.3 L435 75.1 L450 76.8 L465 78.3 L480 79.4 L495 80.1 L510 80.3 L525 80.4 L540 80.5 L555 80.7 L570 81.3 L585 82 L600 82.8 L615 83.5 L630 83.7 L645 83.5 L660 82.7 L675 81.5 L690 80.1 L705 78.7 L720 77.6 L735 77 L750 77 L765 77.4 L780 78.1 L795 78.8 L810 79.3 L825 79.5 L840 79.4 L855 79 L870 78.6 L885 78.4 L900 78.5 L915 78.9 L930 79.7 L945 80.5 L960 81.1 L975 81.4 L990 81 L1005 80.1 L1020 78.7 L1035 76.9 L1050 75.2 L1065 73.7 L1080 72.6 L1095 71.9 L1110 71.7 L1125 71.6 L1140 71.5 L1155 71.3 L1170 70.7 L1185 70 L1200 69.2 L1215 68.5 L1230 68.3 L1245 68.5 L1260 69.3 L1275 70.5 L1290 71.9 L1305 73.3 L1320 74.4 L1335 75 L1350 75 L1365 74.6 L1380 73.9 L1395 73.2 L1410 72.7 L1425 72.5 L1440 72.6 L1455 73 L1470 73.4 L1485 73.6 L1500 73.5 L1515 73.1 L1530 72.3 L1545 71.5 L1560 70.9 L1575 70.6 L1590 71 L1605 71.9 L1620 73.3 L1635 75.1 L1650 76.8 L1665 78.3 L1680 79.4 L1695 80.1 L1710 80.3 L1725 80.4 L1740 80.5 L1755 80.7 L1770 81.3 L1785 82 L1800 82.8 L1815 83.5 L1830 83.7 L1845 83.5 L1860 82.7 L1875 81.5 L1890 80.1 L1905 78.7 L1920 77.6 L1935 77 L1950 77 L1965 77.4 L1980 78.1 L1995 78.8 L2010 79.3 L2025 79.5 L2040 79.4 L2055 79 L2070 78.6 L2085 78.4 L2100 78.5 L2115 78.9 L2130 79.7 L2145 80.5 L2160 81.1 L2175 81.4 L2190 81 L2205 80.1 L2220 78.7 L2235 76.9 L2250 75.2 L2265 73.7 L2280 72.6 L2295 71.9 L2310 71.7 L2325 71.6 L2340 71.5 L2355 71.3 L2370 70.7 L2385 70 L2400 69.2' stroke-opacity='0.26'/%3E%3CanimateTransform attributeName='transform' type='translate' from='0 0' to='-1200 0' dur='90s' repeatCount='indefinite'/%3E%3C/g%3E%3C/svg%3E");
  background-repeat: repeat-x;
  background-size: auto 100%;
}

@media (prefers-reduced-motion: reduce) {
  html:root .entete::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1200' height='80' viewBox='0 0 1200 80'%3E%3Cdefs%3E%3ClinearGradient id='t' gradientUnits='userSpaceOnUse' x1='0' y1='0' x2='1200' y2='0' spreadMethod='repeat'%3E%3Cstop offset='0' stop-color='%2300C8FF'/%3E%3Cstop offset='0.33' stop-color='%237776FF'/%3E%3Cstop offset='0.66' stop-color='%23C34BEE'/%3E%3Cstop offset='1' stop-color='%2300C8FF'/%3E%3C/linearGradient%3E%3C/defs%3E%3Cg fill='none' stroke='url(%23t)' stroke-width='.9'%3E%3Cpath d='M0 4 L15 5.9 L30 7.5 L45 8.6 L60 9.2 L75 9.3 L90 9 L105 8.6 L120 8.4 L135 8.3 L150 8.6 L165 9 L180 9.4 L195 9.6 L210 9.5 L225 8.9 L240 7.9 L255 6.7 L270 5.6 L285 4.8 L300 4.5 L315 4.8 L330 5.6 L345 6.7 L360 7.9 L375 8.9 L390 9.5 L405 9.6 L420 9.4 L435 9 L450 8.6 L465 8.3 L480 8.4 L495 8.6 L510 9 L525 9.3 L540 9.2 L555 8.6 L570 7.5 L585 5.9 L600 4 L615 2.1 L630 0.5 L645 -0.6 L660 -1.2 L675 -1.3 L690 -1 L705 -0.6 L720 -0.4 L735 -0.3 L750 -0.6 L765 -1 L780 -1.4 L795 -1.6 L810 -1.5 L825 -0.9 L840 0.1 L855 1.3 L870 2.4 L885 3.2 L900 3.5 L915 3.2 L930 2.4 L945 1.3 L960 0.1 L975 -0.9 L990 -1.5 L1005 -1.6 L1020 -1.4 L1035 -1 L1050 -0.6 L1065 -0.3 L1080 -0.4 L1095 -0.6 L1110 -1 L1125 -1.3 L1140 -1.2 L1155 -0.6 L1170 0.5 L1185 2.1 L1200 4 L1215 5.9 L1230 7.5 L1245 8.6 L1260 9.2 L1275 9.3 L1290 9 L1305 8.6 L1320 8.4 L1335 8.3 L1350 8.6 L1365 9 L1380 9.4 L1395 9.6 L1410 9.5 L1425 8.9 L1440 7.9 L1455 6.7 L1470 5.6 L1485 4.8 L1500 4.5 L1515 4.8 L1530 5.6 L1545 6.7 L1560 7.9 L1575 8.9 L1590 9.5 L1605 9.6 L1620 9.4 L1635 9 L1650 8.6 L1665 8.3 L1680 8.4 L1695 8.6 L1710 9 L1725 9.3 L1740 9.2 L1755 8.6 L1770 7.5 L1785 5.9 L1800 4 L1815 2.1 L1830 0.5 L1845 -0.6 L1860 -1.2 L1875 -1.3 L1890 -1 L1905 -0.6 L1920 -0.4 L1935 -0.3 L1950 -0.6 L1965 -1 L1980 -1.4 L1995 -1.6 L2010 -1.5 L2025 -0.9 L2040 0.1 L2055 1.3 L2070 2.4 L2085 3.2 L2100 3.5 L2115 3.2 L2130 2.4 L2145 1.3 L2160 0.1 L2175 -0.9 L2190 -1.5 L2205 -1.6 L2220 -1.4 L2235 -1 L2250 -0.6 L2265 -0.3 L2280 -0.4 L2295 -0.6 L2310 -1 L2325 -1.3 L2340 -1.2 L2355 -0.6 L2370 0.5 L2385 2.1 L2400 4' stroke-opacity='0.18'/%3E%3Cpath d='M0 21.6 L15 21.3 L30 20.4 L45 19.1 L60 17.6 L75 16.2 L90 15.1 L105 14.4 L120 14.3 L135 14.5 L150 14.9 L165 15.4 L180 15.6 L195 15.5 L210 15.1 L225 14.6 L240 14.1 L255 13.9 L270 14.1 L285 14.7 L300 15.5 L315 16.5 L330 17.2 L345 17.5 L360 17.2 L375 16.4 L390 15 L405 13.4 L420 11.9 L435 10.5 L450 9.6 L465 9 L480 8.8 L495 8.7 L510 8.4 L525 8 L540 7.3 L555 6.3 L570 5.4 L585 4.7 L600 4.4 L615 4.7 L630 5.6 L645 6.9 L660 8.4 L675 9.8 L690 10.9 L705 11.6 L720 11.7 L735 11.5 L750 11.1 L765 10.6 L780 10.4 L795 10.5 L810 10.9 L825 11.4 L840 11.9 L855 12.1 L870 11.9 L885 11.3 L900 10.5 L915 9.5 L930 8.8 L945 8.5 L960 8.8 L975 9.6 L990 11 L1005 12.6 L1020 14.1 L1035 15.5 L1050 16.4 L1065 17 L1080 17.2 L1095 17.3 L1110 17.6 L1125 18 L1140 18.7 L1155 19.7 L1170 20.6 L1185 21.3 L1200 21.6 L1215 21.3 L1230 20.4 L1245 19.1 L1260 17.6 L1275 16.2 L1290 15.1 L1305 14.4 L1320 14.3 L1335 14.5 L1350 14.9 L1365 15.4 L1380 15.6 L1395 15.5 L1410 15.1 L1425 14.6 L1440 14.1 L1455 13.9 L1470 14.1 L1485 14.7 L1500 15.5 L1515 16.5 L1530 17.2 L1545 17.5 L1560 17.2 L1575 16.4 L1590 15 L1605 13.4 L1620 11.9 L1635 10.5 L1650 9.6 L1665 9 L1680 8.8 L1695 8.7 L1710 8.4 L1725 8 L1740 7.3 L1755 6.3 L1770 5.4 L1785 4.7 L1800 4.4 L1815 4.7 L1830 5.6 L1845 6.9 L1860 8.4 L1875 9.8 L1890 10.9 L1905 11.6 L1920 11.7 L1935 11.5 L1950 11.1 L1965 10.6 L1980 10.4 L1995 10.5 L2010 10.9 L2025 11.4 L2040 11.9 L2055 12.1 L2070 11.9 L2085 11.3 L2100 10.5 L2115 9.5 L2130 8.8 L2145 8.5 L2160 8.8 L2175 9.6 L2190 11 L2205 12.6 L2220 14.1 L2235 15.5 L2250 16.4 L2265 17 L2280 17.2 L2295 17.3 L2310 17.6 L2325 18 L2340 18.7 L2355 19.7 L2370 20.6 L2385 21.3 L2400 21.6' stroke-opacity='0.22'/%3E%3Cpath d='M0 22.8 L15 21.6 L30 20.5 L45 19.6 L60 19.3 L75 19.4 L90 20.1 L105 21.2 L120 22.3 L135 23.2 L150 23.7 L165 23.7 L180 23.2 L195 22.4 L210 21.5 L225 20.6 L240 20.1 L255 19.8 L270 19.8 L285 19.8 L300 19.6 L315 19.1 L330 18.3 L345 17 L360 15.6 L375 14.2 L390 13.1 L405 12.6 L420 12.7 L435 13.4 L450 14.5 L465 15.8 L480 17 L495 18 L510 18.6 L525 18.9 L540 19 L555 19.2 L570 19.5 L585 20.2 L600 21.2 L615 22.4 L630 23.5 L645 24.4 L660 24.7 L675 24.6 L690 23.9 L705 22.8 L720 21.7 L735 20.8 L750 20.3 L765 20.3 L780 20.8 L795 21.6 L810 22.5 L825 23.4 L840 23.9 L855 24.2 L870 24.2 L885 24.2 L900 24.4 L915 24.9 L930 25.7 L945 27 L960 28.4 L975 29.8 L990 30.9 L1005 31.4 L1020 31.3 L1035 30.6 L1050 29.5 L1065 28.2 L1080 27 L1095 26 L1110 25.4 L1125 25.1 L1140 25 L1155 24.8 L1170 24.5 L1185 23.8 L1200 22.8 L1215 21.6 L1230 20.5 L1245 19.6 L1260 19.3 L1275 19.4 L1290 20.1 L1305 21.2 L1320 22.3 L1335 23.2 L1350 23.7 L1365 23.7 L1380 23.2 L1395 22.4 L1410 21.5 L1425 20.6 L1440 20.1 L1455 19.8 L1470 19.8 L1485 19.8 L1500 19.6 L1515 19.1 L1530 18.3 L1545 17 L1560 15.6 L1575 14.2 L1590 13.1 L1605 12.6 L1620 12.7 L1635 13.4 L1650 14.5 L1665 15.8 L1680 17 L1695 18 L1710 18.6 L1725 18.9 L1740 19 L1755 19.2 L1770 19.5 L1785 20.2 L1800 21.2 L1815 22.4 L1830 23.5 L1845 24.4 L1860 24.7 L1875 24.6 L1890 23.9 L1905 22.8 L1920 21.7 L1935 20.8 L1950 20.3 L1965 20.3 L1980 20.8 L1995 21.6 L2010 22.5 L2025 23.4 L2040 23.9 L2055 24.2 L2070 24.2 L2085 24.2 L2100 24.4 L2115 24.9 L2130 25.7 L2145 27 L2160 28.4 L2175 29.8 L2190 30.9 L2205 31.4 L2220 31.3 L2235 30.6 L2250 29.5 L2265 28.2 L2280 27 L2295 26 L2310 25.4 L2325 25.1 L2340 25 L2355 24.8 L2370 24.5 L2385 23.8 L2400 22.8' stroke-opacity='0.26'/%3E%3Cpath d='M0 28 L15 27.7 L30 27.7 L45 28.1 L60 28.7 L75 29.4 L90 30 L105 30.2 L120 30 L135 29.1 L150 27.9 L165 26.4 L180 25 L195 23.9 L210 23.3 L225 23.2 L240 23.6 L255 24.3 L270 25 L285 25.6 L300 25.9 L315 26.1 L330 26.1 L345 26.1 L360 26.5 L375 27.3 L390 28.6 L405 30.2 L420 32 L435 33.7 L450 35 L465 35.7 L480 35.8 L495 35.4 L510 34.7 L525 34 L540 33.4 L555 33.1 L570 33.2 L585 33.5 L600 34 L615 34.3 L630 34.3 L645 33.9 L660 33.3 L675 32.6 L690 32 L705 31.8 L720 32 L735 32.9 L750 34.1 L765 35.6 L780 37 L795 38.1 L810 38.7 L825 38.8 L840 38.4 L855 37.7 L870 37 L885 36.4 L900 36.1 L915 35.9 L930 35.9 L945 35.9 L960 35.5 L975 34.7 L990 33.4 L1005 31.8 L1020 30 L1035 28.3 L1050 27 L1065 26.3 L1080 26.2 L1095 26.6 L1110 27.3 L1125 28 L1140 28.6 L1155 28.9 L1170 28.8 L1185 28.5 L1200 28 L1215 27.7 L1230 27.7 L1245 28.1 L1260 28.7 L1275 29.4 L1290 30 L1305 30.2 L1320 30 L1335 29.1 L1350 27.9 L1365 26.4 L1380 25 L1395 23.9 L1410 23.3 L1425 23.2 L1440 23.6 L1455 24.3 L1470 25 L1485 25.6 L1500 25.9 L1515 26.1 L1530 26.1 L1545 26.1 L1560 26.5 L1575 27.3 L1590 28.6 L1605 30.2 L1620 32 L1635 33.7 L1650 35 L1665 35.7 L1680 35.8 L1695 35.4 L1710 34.7 L1725 34 L1740 33.4 L1755 33.1 L1770 33.2 L1785 33.5 L1800 34 L1815 34.3 L1830 34.3 L1845 33.9 L1860 33.3 L1875 32.6 L1890 32 L1905 31.8 L1920 32 L1935 32.9 L1950 34.1 L1965 35.6 L1980 37 L1995 38.1 L2010 38.7 L2025 38.8 L2040 38.4 L2055 37.7 L2070 37 L2085 36.4 L2100 36.1 L2115 35.9 L2130 35.9 L2145 35.9 L2160 35.5 L2175 34.7 L2190 33.4 L2205 31.8 L2220 30 L2235 28.3 L2250 27 L2265 26.3 L2280 26.2 L2295 26.6 L2310 27.3 L2325 28 L2340 28.6 L2355 28.9 L2370 28.8 L2385 28.5 L2400 28' stroke-opacity='0.18'/%3E%3Cpath d='M0 35.7 L15 35.5 L30 35.6 L45 36 L60 36.3 L75 36.5 L90 36.4 L105 36 L120 35.4 L135 34.9 L150 34.6 L165 34.7 L180 35.5 L195 36.8 L210 38.6 L225 40.4 L240 42.2 L255 43.6 L270 44.5 L285 44.9 L300 44.9 L315 44.8 L330 44.7 L345 44.8 L360 45.2 L375 45.7 L390 46.3 L405 46.7 L420 46.7 L435 46.2 L450 45.3 L465 44 L480 42.7 L495 41.5 L510 40.8 L525 40.6 L540 41 L555 41.8 L570 42.8 L585 43.6 L600 44.3 L615 44.5 L630 44.4 L645 44 L660 43.7 L675 43.5 L690 43.6 L705 44 L720 44.6 L735 45.1 L750 45.4 L765 45.3 L780 44.5 L795 43.2 L810 41.4 L825 39.6 L840 37.8 L855 36.4 L870 35.5 L885 35.1 L900 35.1 L915 35.2 L930 35.3 L945 35.2 L960 34.8 L975 34.3 L990 33.7 L1005 33.3 L1020 33.3 L1035 33.8 L1050 34.7 L1065 36 L1080 37.3 L1095 38.5 L1110 39.2 L1125 39.4 L1140 39 L1155 38.2 L1170 37.2 L1185 36.4 L1200 35.7 L1215 35.5 L1230 35.6 L1245 36 L1260 36.3 L1275 36.5 L1290 36.4 L1305 36 L1320 35.4 L1335 34.9 L1350 34.6 L1365 34.7 L1380 35.5 L1395 36.8 L1410 38.6 L1425 40.4 L1440 42.2 L1455 43.6 L1470 44.5 L1485 44.9 L1500 44.9 L1515 44.8 L1530 44.7 L1545 44.8 L1560 45.2 L1575 45.7 L1590 46.3 L1605 46.7 L1620 46.7 L1635 46.2 L1650 45.3 L1665 44 L1680 42.7 L1695 41.5 L1710 40.8 L1725 40.6 L1740 41 L1755 41.8 L1770 42.8 L1785 43.6 L1800 44.3 L1815 44.5 L1830 44.4 L1845 44 L1860 43.7 L1875 43.5 L1890 43.6 L1905 44 L1920 44.6 L1935 45.1 L1950 45.4 L1965 45.3 L1980 44.5 L1995 43.2 L2010 41.4 L2025 39.6 L2040 37.8 L2055 36.4 L2070 35.5 L2085 35.1 L2100 35.1 L2115 35.2 L2130 35.3 L2145 35.2 L2160 34.8 L2175 34.3 L2190 33.7 L2205 33.3 L2220 33.3 L2235 33.8 L2250 34.7 L2265 36 L2280 37.3 L2295 38.5 L2310 39.2 L2325 39.4 L2340 39 L2355 38.2 L2370 37.2 L2385 36.4 L2400 35.7' stroke-opacity='0.22'/%3E%3Cpath d='M0 46.5 L15 47.8 L30 49.2 L45 50.4 L60 51.4 L75 52 L90 52.3 L105 52.5 L120 52.7 L135 53.2 L150 54 L165 55.1 L180 56.3 L195 57.4 L210 58 L225 58.1 L240 57.6 L255 56.6 L270 55.1 L285 53.7 L300 52.4 L315 51.4 L330 51 L345 50.9 L360 51.1 L375 51.3 L390 51.3 L405 51.1 L420 50.5 L435 49.8 L450 49.2 L465 48.8 L480 48.7 L495 49.2 L510 50.1 L525 51.1 L540 52.1 L555 52.8 L570 52.9 L585 52.5 L600 51.5 L615 50.2 L630 48.8 L645 47.6 L660 46.6 L675 46 L690 45.7 L705 45.5 L720 45.3 L735 44.8 L750 44 L765 42.9 L780 41.7 L795 40.6 L810 40 L825 39.9 L840 40.4 L855 41.4 L870 42.9 L885 44.3 L900 45.6 L915 46.6 L930 47 L945 47.1 L960 46.9 L975 46.7 L990 46.7 L1005 46.9 L1020 47.5 L1035 48.2 L1050 48.8 L1065 49.2 L1080 49.3 L1095 48.8 L1110 47.9 L1125 46.9 L1140 45.9 L1155 45.2 L1170 45.1 L1185 45.5 L1200 46.5 L1215 47.8 L1230 49.2 L1245 50.4 L1260 51.4 L1275 52 L1290 52.3 L1305 52.5 L1320 52.7 L1335 53.2 L1350 54 L1365 55.1 L1380 56.3 L1395 57.4 L1410 58 L1425 58.1 L1440 57.6 L1455 56.6 L1470 55.1 L1485 53.7 L1500 52.4 L1515 51.4 L1530 51 L1545 50.9 L1560 51.1 L1575 51.3 L1590 51.3 L1605 51.1 L1620 50.5 L1635 49.8 L1650 49.2 L1665 48.8 L1680 48.7 L1695 49.2 L1710 50.1 L1725 51.1 L1740 52.1 L1755 52.8 L1770 52.9 L1785 52.5 L1800 51.5 L1815 50.2 L1830 48.8 L1845 47.6 L1860 46.6 L1875 46 L1890 45.7 L1905 45.5 L1920 45.3 L1935 44.8 L1950 44 L1965 42.9 L1980 41.7 L1995 40.6 L2010 40 L2025 39.9 L2040 40.4 L2055 41.4 L2070 42.9 L2085 44.3 L2100 45.6 L2115 46.6 L2130 47 L2145 47.1 L2160 46.9 L2175 46.7 L2190 46.7 L2205 46.9 L2220 47.5 L2235 48.2 L2250 48.8 L2265 49.2 L2280 49.3 L2295 48.8 L2310 47.9 L2325 46.9 L2340 45.9 L2355 45.2 L2370 45.1 L2385 45.5 L2400 46.5' stroke-opacity='0.26'/%3E%3Cpath d='M0 65.9 L15 66.8 L30 67.2 L45 66.9 L60 66.1 L75 65.1 L90 64 L105 63.1 L120 62.4 L135 62.1 L150 61.9 L165 61.7 L180 61.3 L195 60.6 L210 59.5 L225 58.1 L240 56.7 L255 55.5 L270 54.7 L285 54.5 L300 54.9 L315 55.7 L330 56.7 L345 57.7 L360 58.4 L375 58.6 L390 58.4 L405 57.9 L420 57.2 L435 56.6 L450 56.1 L465 56 L480 56.2 L495 56.4 L510 56.5 L525 56.2 L540 55.6 L555 54.4 L570 53 L585 51.4 L600 50.1 L615 49.2 L630 48.8 L645 49.1 L660 49.9 L675 50.9 L690 52 L705 52.9 L720 53.6 L735 53.9 L750 54.1 L765 54.3 L780 54.7 L795 55.4 L810 56.5 L825 57.9 L840 59.3 L855 60.5 L870 61.3 L885 61.5 L900 61.1 L915 60.3 L930 59.3 L945 58.3 L960 57.6 L975 57.4 L990 57.6 L1005 58.1 L1020 58.8 L1035 59.4 L1050 59.9 L1065 60 L1080 59.8 L1095 59.6 L1110 59.5 L1125 59.8 L1140 60.4 L1155 61.6 L1170 63 L1185 64.6 L1200 65.9 L1215 66.8 L1230 67.2 L1245 66.9 L1260 66.1 L1275 65.1 L1290 64 L1305 63.1 L1320 62.4 L1335 62.1 L1350 61.9 L1365 61.7 L1380 61.3 L1395 60.6 L1410 59.5 L1425 58.1 L1440 56.7 L1455 55.5 L1470 54.7 L1485 54.5 L1500 54.9 L1515 55.7 L1530 56.7 L1545 57.7 L1560 58.4 L1575 58.6 L1590 58.4 L1605 57.9 L1620 57.2 L1635 56.6 L1650 56.1 L1665 56 L1680 56.2 L1695 56.4 L1710 56.5 L1725 56.2 L1740 55.6 L1755 54.4 L1770 53 L1785 51.4 L1800 50.1 L1815 49.2 L1830 48.8 L1845 49.1 L1860 49.9 L1875 50.9 L1890 52 L1905 52.9 L1920 53.6 L1935 53.9 L1950 54.1 L1965 54.3 L1980 54.7 L1995 55.4 L2010 56.5 L2025 57.9 L2040 59.3 L2055 60.5 L2070 61.3 L2085 61.5 L2100 61.1 L2115 60.3 L2130 59.3 L2145 58.3 L2160 57.6 L2175 57.4 L2190 57.6 L2205 58.1 L2220 58.8 L2235 59.4 L2250 59.9 L2265 60 L2280 59.8 L2295 59.6 L2310 59.5 L2325 59.8 L2340 60.4 L2355 61.6 L2370 63 L2385 64.6 L2400 65.9' stroke-opacity='0.18'/%3E%3Cpath d='M0 70.7 L15 69.2 L30 67.3 L45 65.5 L60 63.9 L75 62.7 L90 62.2 L105 62.2 L120 62.5 L135 63.1 L150 63.6 L165 63.8 L180 63.7 L195 63.4 L210 63 L225 62.7 L240 62.7 L255 63.1 L270 63.8 L285 64.8 L300 65.7 L315 66.3 L330 66.5 L345 66.1 L360 65.1 L375 63.9 L390 62.5 L405 61.3 L420 60.5 L435 60.2 L450 60.3 L465 60.7 L480 61.3 L495 61.7 L510 61.9 L525 61.9 L540 61.7 L555 61.5 L570 61.6 L585 62.2 L600 63.3 L615 64.8 L630 66.7 L645 68.5 L660 70.1 L675 71.3 L690 71.8 L705 71.8 L720 71.5 L735 70.9 L750 70.4 L765 70.2 L780 70.3 L795 70.6 L810 71 L825 71.3 L840 71.3 L855 70.9 L870 70.2 L885 69.2 L900 68.3 L915 67.7 L930 67.5 L945 67.9 L960 68.9 L975 70.1 L990 71.5 L1005 72.7 L1020 73.5 L1035 73.8 L1050 73.7 L1065 73.3 L1080 72.7 L1095 72.3 L1110 72.1 L1125 72.1 L1140 72.3 L1155 72.5 L1170 72.4 L1185 71.8 L1200 70.7 L1215 69.2 L1230 67.3 L1245 65.5 L1260 63.9 L1275 62.7 L1290 62.2 L1305 62.2 L1320 62.5 L1335 63.1 L1350 63.6 L1365 63.8 L1380 63.7 L1395 63.4 L1410 63 L1425 62.7 L1440 62.7 L1455 63.1 L1470 63.8 L1485 64.8 L1500 65.7 L1515 66.3 L1530 66.5 L1545 66.1 L1560 65.1 L1575 63.9 L1590 62.5 L1605 61.3 L1620 60.5 L1635 60.2 L1650 60.3 L1665 60.7 L1680 61.3 L1695 61.7 L1710 61.9 L1725 61.9 L1740 61.7 L1755 61.5 L1770 61.6 L1785 62.2 L1800 63.3 L1815 64.8 L1830 66.7 L1845 68.5 L1860 70.1 L1875 71.3 L1890 71.8 L1905 71.8 L1920 71.5 L1935 70.9 L1950 70.4 L1965 70.2 L1980 70.3 L1995 70.6 L2010 71 L2025 71.3 L2040 71.3 L2055 70.9 L2070 70.2 L2085 69.2 L2100 68.3 L2115 67.7 L2130 67.5 L2145 67.9 L2160 68.9 L2175 70.1 L2190 71.5 L2205 72.7 L2220 73.5 L2235 73.8 L2250 73.7 L2265 73.3 L2280 72.7 L2295 72.3 L2310 72.1 L2325 72.1 L2340 72.3 L2355 72.5 L2370 72.4 L2385 71.8 L2400 70.7' stroke-opacity='0.22'/%3E%3Cpath d='M0 69.2 L15 68.5 L30 68.3 L45 68.5 L60 69.3 L75 70.5 L90 71.9 L105 73.3 L120 74.4 L135 75 L150 75 L165 74.6 L180 73.9 L195 73.2 L210 72.7 L225 72.5 L240 72.6 L255 73 L270 73.4 L285 73.6 L300 73.5 L315 73.1 L330 72.3 L345 71.5 L360 70.9 L375 70.6 L390 71 L405 71.9 L420 73.3 L435 75.1 L450 76.8 L465 78.3 L480 79.4 L495 80.1 L510 80.3 L525 80.4 L540 80.5 L555 80.7 L570 81.3 L585 82 L600 82.8 L615 83.5 L630 83.7 L645 83.5 L660 82.7 L675 81.5 L690 80.1 L705 78.7 L720 77.6 L735 77 L750 77 L765 77.4 L780 78.1 L795 78.8 L810 79.3 L825 79.5 L840 79.4 L855 79 L870 78.6 L885 78.4 L900 78.5 L915 78.9 L930 79.7 L945 80.5 L960 81.1 L975 81.4 L990 81 L1005 80.1 L1020 78.7 L1035 76.9 L1050 75.2 L1065 73.7 L1080 72.6 L1095 71.9 L1110 71.7 L1125 71.6 L1140 71.5 L1155 71.3 L1170 70.7 L1185 70 L1200 69.2 L1215 68.5 L1230 68.3 L1245 68.5 L1260 69.3 L1275 70.5 L1290 71.9 L1305 73.3 L1320 74.4 L1335 75 L1350 75 L1365 74.6 L1380 73.9 L1395 73.2 L1410 72.7 L1425 72.5 L1440 72.6 L1455 73 L1470 73.4 L1485 73.6 L1500 73.5 L1515 73.1 L1530 72.3 L1545 71.5 L1560 70.9 L1575 70.6 L1590 71 L1605 71.9 L1620 73.3 L1635 75.1 L1650 76.8 L1665 78.3 L1680 79.4 L1695 80.1 L1710 80.3 L1725 80.4 L1740 80.5 L1755 80.7 L1770 81.3 L1785 82 L1800 82.8 L1815 83.5 L1830 83.7 L1845 83.5 L1860 82.7 L1875 81.5 L1890 80.1 L1905 78.7 L1920 77.6 L1935 77 L1950 77 L1965 77.4 L1980 78.1 L1995 78.8 L2010 79.3 L2025 79.5 L2040 79.4 L2055 79 L2070 78.6 L2085 78.4 L2100 78.5 L2115 78.9 L2130 79.7 L2145 80.5 L2160 81.1 L2175 81.4 L2190 81 L2205 80.1 L2220 78.7 L2235 76.9 L2250 75.2 L2265 73.7 L2280 72.6 L2295 71.9 L2310 71.7 L2325 71.6 L2340 71.5 L2355 71.3 L2370 70.7 L2385 70 L2400 69.2' stroke-opacity='0.26'/%3E%3C/g%3E%3C/svg%3E");
  }
}

/* (15) Accueil, haut : « trop d'espace vide entre le texte et les pictos » — le texte et la colonne des pictos se
   serrent au centre (72 px entre eux) au lieu de s'écarter aux deux bords. */
@media (min-width: 1200px) {
  body[data-page="accueil"] .hero--accueil .hero__contenu {
    grid-template-columns: minmax(0, 780px) auto;
    justify-content: center;
    column-gap: 72px;
  }
}

/* (21, 49) Parenthèses à la ligne dans les blocs ; « (Humanova Technology®) » sous le titre de son bloc. */
.texte-carte > .leger,
.h3__suite {
  display: block;
}

/* (49) Agents IA : « que les 3 textes se terminent sur la même ligne » — les blocs partagent les rangées de la grille
   (picto, titre, sous-titre, texte, bouton) : chaque rangée prend la hauteur de la plus haute des trois. */
@media (min-width: 1000px) {
  body[data-page="nos-solutions"] .grille--agents > .carte--agent {
    display: grid;
    grid-row: span 5;
    grid-template-rows: subgrid;
    row-gap: 0;
    justify-items: center;
    align-items: start;
  }

  body[data-page="nos-solutions"] .grille--agents > .carte--agent > .bouton {
    align-self: end;
  }
}

/* (31) Le logo à la place de « IA NOVATION » dans « Pourquoi choisir … ? » (le nom reste lu, masqué à l'œil). */
.titre__logo {
  display: inline-block;
  width: auto;
  height: 0.8em;
  vertical-align: -0.04em;
}

.titre__suite--logo {
  white-space: nowrap;
}

/* (63) Bandeaux de fin : le texte est centré partout ; le voile, dense à gauche pour un texte à gauche, devient le même
   ovale centré que celui de l'Accueil (« il faut revoir les ombrages / voiles derrière, ce n'est plus adapté »). */
@media (min-width: 1200px) {
  .cta::before {
    background: radial-gradient(ellipse 62% 78% at 50% 50%, rgba(4, 20, 38, 0.84) 0%, rgba(4, 20, 38, 0.66) 55%,
      rgba(4, 20, 38, 0.42) 100%);
  }
}

/* (66) Contact : « enlever l'effet de nos coordonnées qui bouge ». */
#contenu .coordonnee__pastille > .icone {
  animation: none;
}

/* Bandeaux « Exemples de réalisations » remis (53, 56) : leurs textes sur les balises (le contrôle de la charte les
   comptait hors balise). */
.ex-galerie__titre {
  font-size: var(--b-surtitre-taille);
  font-weight: var(--b-surtitre-graisse);
  letter-spacing: var(--b-surtitre-espacement);
}

.ex-image__tag {
  font-size: var(--b-petit-taille);
}

.ex-image__titre {
  font-size: var(--b-h4-taille);
}

/* (40, 42) Notre mission : revenue au bandeau d'origine (trois colonnes séparées d'un trait, sans boîte : « pas fan des
   box ») ; pictos à la balise, titres en dégradé ; picto → titre à la balise (l'écart d'origine était de 28 px). */
body[data-page="a-propos"] .mission__point {
  gap: 0;
}

/* T15c (01/11/2026, avenant 6) : le filet vertical entre deux colonnes revient au milieu de l'écart RÉEL (la balise
   --b-espace-grille : 28 px, 24 px sous 1200 ; A-23 : « au milieu de l'écart »). Posé à -32 px pour l'écart de 64 px
   d'origine, il passait dans la colonne de gauche, et sous les dernières lettres du nouveau texte de « Simplifier » à
   1440 (seconde suite, CV-22). Les textes ne bougent pas. */
body[data-page="a-propos"] .mission__point + .mission__point::before {
  left: calc(var(--b-espace-grille) / -2);
}

/* ===================================================================================================================
   14. Revue 2 (formulaire d'Anthony, 22/10 ; numéros = ceux du formulaire).
   =================================================================================================================== */

/* (2) Accueil, nos solutions : « les textes ne finissent pas sur la même ligne » — les blocs partagent les rangées de
   la grille (picto, titre, texte, flèche), comme ceux des agents IA. */
@media (min-width: 768px) {
  body[data-page="accueil"] [data-section="solutions"] .grille > .carte--solution {
    display: grid;
    grid-row: span 4;
    grid-template-rows: subgrid;
    row-gap: 0;
    justify-items: center;
    align-items: start;
  }

  body[data-page="accueil"] [data-section="solutions"] .grille > .carte--solution > .fleche {
    align-self: end;
  }
}

/* (14) Titres « + de temps / performance / opportunités » : choix C, dégradé éclairci détaché par une ombre douce. */
.hero__carte :is(h4, .h4) {
  width: fit-content;
  max-width: 100%;
  background-image: linear-gradient(90deg, #8be9ff 0%, #b8b1ff 55%, #f2a8ff 100%);
  filter: drop-shadow(0 1px 6px rgba(4, 20, 38, 0.85));
}

.hero__carte .texte-avantage {
  color: rgba(255, 255, 255, 0.86);
}

/* (25) Notre approche : « le texte est juste bleu » — un titre court prenait toute la largeur de sa colonne et le
   dégradé s'étirait sur cette largeur : seul son début (bleu) passait sur les lettres. Le titre prend la largeur de son
   texte, le dégradé entier passe dessus. */
.etape__texte > h3 {
  width: fit-content;
  max-width: 100%;
}

/* (24) Notre approche : arrivée des étapes (approche.js) — numéro qui s'allume, texte décodé, trait qui descend. */
.etapes--anime .etape__numero,
.etapes--anime .etape__numero::before,
.etapes--anime .etape::after {
  animation: none !important;
}

.etapes--anime .etape__numero {
  transition: opacity 0.35s ease, transform 0.55s cubic-bezier(0.3, 1.6, 0.5, 1);
}

.etapes--anime .etape.e-attente .etape__numero {
  opacity: 0;
  transform: scale(0.4);
}

.etapes--anime .etape.e-attente .etape__texte {
  opacity: 0;
}

.etapes--anime .etape.e-allume .etape__numero {
  animation: b-onde 1.1s ease-out 1 !important;
}

@keyframes b-onde {
  from { box-shadow: 0 0 0 0 rgba(0, 200, 255, 0.75); }
  to { box-shadow: 0 0 0 20px rgba(0, 200, 255, 0); }
}

.etapes--anime .etape:not(:last-child)::before {
  transform: scaleY(0);
  transform-origin: top;
  transition: transform var(--e-ligne, 1100ms) linear;
}

.etapes--anime .etape.e-ligne::before {
  transform: scaleY(1);
}

/* (28, 29) Accueil, résultats attendus : l'associé demande de séparer le texte des pictogrammes, sans fondu, par une
   partie bleue distincte de l'image ; Anthony : « on parle du voile et pas d'un bandeau bleu » ; « essayons sans bloc ».
   La photo couvre toute la section, sans fondu ; la partie des bénéfices est couverte d'un voile bleu nuit
   translucide à bord net (la photo reste visible dessous), qui commence à mi-chemin entre le texte et les
   pictogrammes et descend jusqu'au bas de la section ; les bénéfices sont posés dessus, sans boîte, séparés d'un fin
   trait ; 120 px entre le texte et les bénéfices. */
body[data-page="accueil"] [data-section="benefices"] > .section__fond {
  height: 100%;
  object-position: 50% 0;
  -webkit-mask-image: none;
  mask-image: none;
}

body[data-page="accueil"] [data-section="benefices"]::before,
body[data-page="accueil"] [data-section="benefices"]::after {
  content: none;
}

body[data-page="accueil"] [data-section="benefices"] .conteneur > .grille--benefices {
  margin-top: var(--b-espace-section);
}

body[data-page="accueil"] [data-section="benefices"] {
  overflow: clip;
}

body[data-page="accueil"] [data-section="benefices"] .grille--benefices {
  position: relative;
}

body[data-page="accueil"] [data-section="benefices"] .grille--benefices::before {
  content: "";
  position: absolute;
  z-index: -1;
  top: calc(var(--b-espace-section) / -2);
  bottom: -100vh;
  left: 50%;
  width: 100vw;
  border-top: 1px solid rgba(255, 255, 255, 0.18);
  background-color: rgba(4, 14, 38, 0.58);
  -webkit-backdrop-filter: blur(6px);
  backdrop-filter: blur(6px);
  transform: translateX(-50%);
}

body[data-page="accueil"] [data-section="benefices"] .benefice {
  padding: 8px 24px;
  border: 0;
  border-radius: 0;
  background: none;
  animation: none;
}

@media (min-width: 1200px) {
  body[data-page="accueil"] [data-section="benefices"] .grille--benefices {
    column-gap: 0;
  }

  body[data-page="accueil"] [data-section="benefices"] .benefice:not(:first-child) {
    border-left: 1px solid rgba(255, 255, 255, 0.2);
  }
}

body[data-page="accueil"] [data-section="benefices"] .benefice .texte-carte {
  color: rgba(255, 255, 255, 0.88);
  text-shadow: 0 1px 2px rgba(4, 20, 38, 0.7), 0 0 18px rgba(4, 20, 38, 0.65);
}

/* (66) Contact : « rajouter le module nos coordonnées en dessous du formulaire » — une seule colonne ; les trois
   coordonnées côte à côte. */
@media (min-width: 1000px) {
  body[data-page="contact"] .grille.contact {
    grid-template-columns: minmax(0, 1fr);
  }

  body[data-page="contact"] .contact__carte--coordonnees .coordonnees {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--b-espace-grille);
  }
}

/* (14, revue 2 bis) « En termes de dégradé il n'y a aucune animation » : le reflet des autres mots en dégradé (toutes
   les 8 s) passe aussi sur ces trois titres, décalé d'un titre à l'autre. */
@media (prefers-reduced-motion: no-preference) {
  .js .hero__carte :is(h4, .h4) {
    background-image: linear-gradient(100deg, rgba(255, 255, 255, 0) 30%, rgba(255, 255, 255, 0.75) 50%, rgba(255, 255, 255, 0) 70%),
      linear-gradient(90deg, #8be9ff 0%, #b8b1ff 55%, #f2a8ff 100%);
    background-size: 50% 100%, 100% 100%;
    background-repeat: no-repeat;
    animation: reflet 8s linear infinite;
  }

  .js .hero__carte:nth-child(2) :is(h4, .h4) { animation-delay: -5.4s; }
  .js .hero__carte:nth-child(3) :is(h4, .h4) { animation-delay: -2.7s; }
}

/* ===================================================================================================================
   15. Revue 2, suite (messages d'Anthony du 22/10).
   =================================================================================================================== */

/* Menu : « agrandir les textes et qu'ils soient mieux répartis entre le bouton et le logo, un peu plus comme
   Humanova » (relevé sur humanova-ia.com le 22/10 : liens à 600, un fin trait vertical entre deux liens, la rangée
   occupe l'espace entre le logo et les boutons, à ≈ 40 px de chacun). Taille et graisse : balise « menu » (16 px,
   600). Ici : la rangée se centre dans l'espace libre entre le logo et le bouton, ses écarts grandissent avec la
   largeur, un trait dégradé fin sépare deux liens. */
@media (min-width: 1200px) {
  .entete__panneau {
    flex: 1;
    min-width: 0;
  }

  .entete__nav {
    display: flex;
    flex: 1;
    justify-content: center;
    min-width: 0;
  }

  .entete__liens {
    --menu-ecart: clamp(32px, 4.6vw - 4px, 64px);
    gap: var(--menu-ecart);
  }

  .entete__liens > li {
    position: relative;
  }

  .entete__liens > li + li::before {
    content: "";
    position: absolute;
    top: 50%;
    left: calc(var(--menu-ecart) / -2);
    width: 1.5px;
    height: 12px;
    border-radius: 1px;
    background-image: linear-gradient(180deg, #00C8FF, #C34BEE);
    opacity: 0.45;
    transform: translate(-50%, -50%);
  }
}

/* À propos, haut de page : « agrandir l'image/vidéo pour que la tête de la femme soit collée au niveau du menu ». La
   vidéo prend toute la hauteur du haut de page (au lieu de 88 %) ; le fondu du haut est retiré (la tête touche la
   barre), le fondu de gauche reste. */
@media (min-width: 1200px) {
  body[data-page="a-propos"] .hero > :is(.hero__image, video.apercu-video) {
    height: 100%;
    -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 32%);
    mask-image: linear-gradient(90deg, transparent 0, #000 32%);
  }
}

/* Contact (et Formations), haut de page : « il faut agrandir l'image/vidéo car un petit trait noir est apparu juste dessous ». Entre
   1200 et 1333 px de large, la vidéo (et entre 1200 et 1519 px, l'image) couvre le cadre par sa hauteur, et le calage
   « cheveux à 28 px sous la barre » la faisait descendre : une bande sombre (jusqu'à 23 px) apparaissait sous le menu.
   Le décalage ne descend plus jamais sous 0 : l'image touche toujours la barre.
   T19 (01/11/2026, Anthony : « Contact je vois tjrs le bandeau ») : la borne du bas est la hauteur RÉELLE du cadre
   (100 % = hauteur du cadre − hauteur rendue du média), comme Formations (95-v5.css), et non plus celle d'un haut de
   570 px : le haut de Contact en fait 635, la vidéo remontait jusqu'à 45 px et l'image jusqu'à 44 px, en laissant une
   bande bleu nuit au bas, de 1360 à 1800 px de large. */
@media (min-width: 1200px) {
  body[data-page="contact"] .hero > video.apercu-video {
    object-position: 60% min(0px, max(28px - 4.909cqw, 100%));
  }

  body[data-page="contact"] .hero > img.hero__image {
    object-position: 60% min(0px, max(28px - 4.297cqw, 100%));
  }

  /* Formations : même défaut entre 1200 et 1333 px (bande de 23 à 57 px sous le menu), même remède. */
  body[data-page="formations"] .hero > video.apercu-video {
    object-position: 50% min(0px, max(28px - 5.364cqw, 570px - 42.727cqw));
  }
}

/* Accueil, résultats attendus (revue 3, voile fondu) : « il faut que le voile soit beaucoup plus fondu et surtout
   améliorer la lisibilité des pictos et texte ». Le voile naît sous le texte, sans bord, et se fond sur 170 px jusqu'à
   sa pleine force (86 %, choix D d'Anthony) avant les pictogrammes ; son flou suit le même fondu. Pictos éclaircis et lumineux (leur
   couleur coule toujours), titres en dégradé éclairci (celui des « + de temps », choix C), textes blancs. Réglages
   (valeurs par défaut ci-dessous) : --voile-opacite, --voile-fondu. */
body[data-page="accueil"] [data-section="benefices"] .grille--benefices::before {
  top: calc(var(--b-espace-section) * -1);
  border-top: 0;
  background-color: rgba(4, 14, 38, var(--voile-opacite, 0.86));
  -webkit-mask-image: linear-gradient(180deg, transparent 0, #000 var(--voile-fondu, 170px));
  mask-image: linear-gradient(180deg, transparent 0, #000 var(--voile-fondu, 170px));
}

body[data-page="accueil"] [data-section="benefices"] .benefice > .icone {
  filter: brightness(1.45) saturate(0.9) drop-shadow(0 0 8px rgba(139, 233, 255, 0.45));
}

@media (prefers-reduced-motion: no-preference) {
  #contenu [data-section="benefices"] .benefice > .icone {
    animation-name: b-picto-vie-clair;
  }
}

@keyframes b-picto-vie-clair {
  0%, 100% { filter: hue-rotate(-25deg) brightness(1.45) saturate(0.9) drop-shadow(0 0 8px rgba(139, 233, 255, 0.45)); transform: scale(1); }
  14% { filter: hue-rotate(-12deg) brightness(1.5) saturate(0.9) drop-shadow(0 0 12px rgba(139, 233, 255, 0.6)); transform: scale(1.06); }
  32% { filter: hue-rotate(5deg) brightness(1.45) saturate(0.9) drop-shadow(0 0 8px rgba(184, 177, 255, 0.45)); transform: scale(1); }
  64% { filter: hue-rotate(38deg) brightness(1.5) saturate(0.9) drop-shadow(0 0 12px rgba(242, 168, 255, 0.55)); transform: scale(1.06); }
  82% { filter: hue-rotate(10deg) brightness(1.45) saturate(0.9) drop-shadow(0 0 8px rgba(184, 177, 255, 0.45)); transform: scale(1); }
}

body[data-page="accueil"] [data-section="benefices"] .benefice > h3 {
  width: fit-content;
  max-width: 100%;
  margin-inline: auto;
  background-image: linear-gradient(90deg, #8be9ff 0%, #b8b1ff 55%, #f2a8ff 100%);
  filter: drop-shadow(0 1px 6px rgba(4, 20, 38, 0.9));
}

body[data-page="accueil"] [data-section="benefices"] .benefice .texte-carte {
  color: rgba(255, 255, 255, 0.96);
  text-shadow: 0 1px 3px rgba(4, 14, 38, 0.9), 0 0 14px rgba(4, 14, 38, 0.7);
}

/* Sections illustrées (scenes.js, 22/10) : « Vos données » (Nos solutions) et « L'humain au centre » (À propos). Anthony :
   « l'animation comme la référence sur Humanova » ; « ce n'est pas joli l'animation en dessous, il faut que ce soit
   plutôt côte à côte, et surtout ne pas reprendre exactement la même animation ». Le texte à gauche, l'animation à
   droite (à l'ordinateur) ; dessous, centrée, sur tablette et téléphone. */
.conteneur--scene {
  display: grid;
  gap: 40px;
  justify-items: center;
}

.scene {
  width: min(100%, 520px);
}

.scene > svg {
  display: block;
  width: 100%;
  height: auto;
  overflow: visible;
}

@media (min-width: 1000px) {
  .conteneur--scene {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    align-items: center;
    column-gap: 72px;
  }

  .section--scene .scene-texte {
    justify-self: stretch;
    text-align: left;
  }

  .section--scene .scene-texte > :is(h2, p) {
    margin-inline: 0;
  }

  .section--scene .scene-texte > .surtitre {
    justify-content: flex-start;
  }

  .scene {
    width: 100%;
    max-width: 560px;
  }
}

/* Le texte passé dans sa colonne (.scene-texte) garde les espacements du conteneur d'une section (07-sections.css). */
.scene-texte > .surtitre + :is(h2, h3) {
  margin-top: var(--espace-surtitre-titre);
}

.scene-texte > :is(h2, h3) + :is(p, .lead) {
  margin-top: var(--espace-titre-texte);
}

.scene-texte > :is(p, .lead) + p {
  margin-top: var(--espace-paragraphes);
}

/* Accueil, Notre différence (Anthony, 22/10 : « il faut enlever le cadre sans voile et centrer le texte au-dessus » ;
   précisé ensuite : « le cadre sans voile » est la photo du coucher de soleil, qui passait sans voile — retirée plus
   bas — et les engagements GARDENT leurs petits cadres) : le texte du haut (Pourquoi choisir IA NOVATION, paragraphe,
   bouton) est centré sur la page, au-dessus des engagements. */

body[data-page="accueil"] [data-section="pourquoi"] .pourquoi__texte {
  max-width: 760px;
  margin-inline: auto;
  text-align: center;
}

body[data-page="accueil"] [data-section="pourquoi"] .pourquoi__texte > .surtitre {
  justify-content: center;
}

body[data-page="accueil"] [data-section="pourquoi"] .pourquoi__texte > .boutons {
  justify-content: center;
}

/* Accueil, Notre différence (Anthony, 22/10 : « il faut que le voile blanc ici soit bien uniforme de partout, enlever
   la petite échappée en haut à droite ») : la photo du coucher de soleil, à droite, ne passe plus à travers ; toute la
   section garde le fond clair uniforme de la page. */
body[data-page="accueil"] [data-section="pourquoi"] > .section__image {
  display: none;
}

/* … et la place que la photo prenait en haut de la section (332 px sur téléphone) est rendue : marge normale. */
body[data-page="accueil"] [data-section="pourquoi"] {
  padding-top: var(--b-espace-section);
}

/* Retouches demandees par Anthony le 22/10 : contraste sur photo, centrage optique,
   liens legaux, integration du visuel Outils metier et empilement stable des CTA. */
body[data-page="accueil"] [data-section="benefices"]::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background: radial-gradient(ellipse 65% 47% at 50% 29%, rgba(4, 14, 38, .88) 0%, rgba(4, 14, 38, .72) 48%, transparent 100%);
}
body[data-page="accueil"] [data-section="benefices"] .conteneur > p:not(.surtitre) {
  color: #FFFFFF;
}
body[data-page="accueil"] [data-section="benefices"] .conteneur > p:not(.surtitre):not(.lead) {
  font-weight: 400;
  line-height: 1.7;
  max-width: min(100%, 65ch);
}

.entete__logo--cartouche { padding-right: 0; }
.entete__logo img { transform: translateY(-6px); }
@media (min-width: 1200px) {
  .entete__barre, .entete__panneau { gap: 32px; }
}
@media (max-width: 767px) {
  .entete__logo img { transform: translateY(-3px); }
}

.pied { padding-bottom: 84px; }
.pied__barre { align-items: baseline; }
.pied .pied__legal {
  margin-inline-start: auto;
  align-items: baseline;
  justify-content: flex-end;
}
@media (max-width: 767px) {
  .pied__barre { align-items: center; text-align: center; }
  .pied .pied__legal { margin-inline: auto; justify-content: center; gap: 8px 16px; }
  .pied__legal li + li { margin-left: 0; padding-left: 0; border-left: 0; }
}

/* Aucun niveau negatif : la video, le voile et le texte restent dans le meme contexte,
   y compris quand le footer et les boutons survoles changent de couche de composition. */
.cta > :is(img.cta__image, video.apercu-video) { z-index: 0; }
.cta::before { z-index: 1; pointer-events: none; }
.cta > .conteneur { position: relative; z-index: 2; }

/* V4 — 22/10 : lisibilité intermédiaire, mots clés en gras et éléments plus espacés. */
main p strong, main li strong { font-weight: 700; }
.leger { font-weight: 400; }
.section .conteneur > :is(h2, h3) + :is(p, .lead),
.section__colonne > h2 + :is(p, .lead),
.hero__texte > h1 + .lead,
.cta__contenu > h2 + p { margin-top: var(--b-espace-titre-texte); }
.section .conteneur > :is(p, .lead) + p { margin-top: var(--b-espace-paragraphes); }
.hero__texte > .lead + .boutons { margin-top: var(--b-espace-texte-bouton); }

/* Fonds noirs pour les cartes posées sur une section blanche ou claire. */
:is(.section--clair, .section--blanc) :is(.carte--engagement, .carte--solution, .carte--agent, .carte--generative, .benefice, .chiffre-bloc) {
  --b-fond-bloc: #070A12;
  --fond-section: #070A12;
  color: #E2E9F4;
}
:is(.section--clair, .section--blanc) :is(.carte--engagement, .carte--solution, .carte--agent, .carte--generative, .benefice, .chiffre-bloc) :is(p, .texte-carte, .sous-titre-carte, .leger, li) {
  color: #E2E9F4;
}
:is(.section--clair, .section--blanc) :is(.carte--engagement, .carte--solution, .carte--agent, .carte--generative, .benefice, .chiffre-bloc) :is(h3, h4, .h4) {
  background-image: linear-gradient(90deg, #67DCFF, #B6A6FF 55%, #E5A1FF);
}
:is(.section--clair, .section--blanc) .carte--solution > .fleche {
  --fond-section: #070A12;
  color: #FFFFFF;
}

/* Réseaux : disque en dégradé, dessin blanc. */
.pied .reseau { border: 0; background: var(--degrade-bouton); color: #FFFFFF; }
.pied .reseau .icone { stroke: #FFFFFF !important; fill: none; }

/* Photographie fondue dans la barre, comme le fond clair des sections. */
html:root .entete::before {
  background-image: linear-gradient(90deg, rgba(255,255,255,.88), rgba(255,255,255,.72) 50%, rgba(255,255,255,.88)), url("/assets/img/clair-texture-1920.webp");
  background-size: cover;
  background-position: 50% 52%;
  opacity: 1;
  animation: none;
  transform: none;
}

/* Outils métier : image intégrée sur toute la section, avec voile progressif pour les textes. */
body[data-page="nos-solutions"] [data-section="outils"] {
  isolation: isolate;
  padding-top: var(--b-espace-section);
}
body[data-page="nos-solutions"] [data-section="outils"] > .section__image {
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 72% 50%;
  -webkit-mask-image: none;
  mask-image: none;
}
body[data-page="nos-solutions"] [data-section="outils"]::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background: linear-gradient(90deg, #041426 0%, rgba(4,20,38,.95) 34%, rgba(4,20,38,.6) 68%, rgba(4,20,38,.24)), linear-gradient(180deg, rgba(4,20,38,.25), transparent 24%, rgba(4,20,38,.55) 72%, #041426);
}
body[data-page="nos-solutions"] [data-section="outils"] > .conteneur { z-index: 2; }

/* Contrôle et sécurité : tout à gauche, y compris le bouton et les numéros. */
body[data-page="nos-solutions"] #controle-securite :is(.section__colonne, .etapes-securite, .etape-securite__texte, h2, h3, p) {
  text-align: left;
  margin-left: 0;
  margin-right: auto;
}
body[data-page="nos-solutions"] #controle-securite .surtitre,
body[data-page="nos-solutions"] #controle-securite .boutons { justify-content: flex-start; }
body[data-page="nos-solutions"] #controle-securite .etape-securite { align-items: start; }

@media (min-width: 768px) {
  .titre__groupe { white-space: nowrap; }
}
@media (min-width: 1000px) {
  body[data-page="nos-solutions"] [data-section="memoire"] .scene { grid-column: 1; grid-row: 1; }
  body[data-page="nos-solutions"] [data-section="memoire"] .scene-texte { grid-column: 2; grid-row: 1; text-align: right; }
  body[data-page="nos-solutions"] [data-section="memoire"] .scene-texte > :is(h2, p) { text-align: right; }
  body[data-page="nos-solutions"] [data-section="memoire"] .scene-texte > .surtitre { justify-content: flex-end; }
}
@media (max-width: 767px) {
  body[data-page="nos-solutions"] [data-section="outils"]::before {
    background: linear-gradient(180deg, rgba(4,20,38,.86), rgba(4,20,38,.86) 65%, #041426);
  }
  body[data-page="nos-solutions"] [data-section="outils"] > .section__image { object-position: 65% 50%; }
}


/* Les deux etapes restent a gauche pour liberer le visuel a droite. */
body[data-page="nos-solutions"] #controle-securite .etapes-securite {
  grid-template-columns: minmax(0, 1fr);
  row-gap: 32px;
  max-width: 680px;
}
body[data-page="nos-solutions"] #controle-securite .etape-securite + .etape-securite::before,
body[data-page="nos-solutions"] #controle-securite .etape-securite + .etape-securite::after { content: none; }
body[data-page="nos-solutions"] #controle-securite .etape-securite__texte > .texte-carte { margin-top: var(--b-espace-titre-texte-carte); }
.pied__contact li > :is(a, div) { min-width: 0; overflow-wrap: anywhere; }
@media (min-width: 768px) and (max-width: 1023px) {
  .pied__colonnes { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 40px 32px; }
  .pied__colonne:nth-child(2), .pied__colonne:nth-child(4) { padding-left: 0; border-left: 0; }
  .pied__colonne:nth-child(3), .pied__colonne:nth-child(5) { padding-left: 20px; border-left: 1px solid rgba(11,20,80,.1); }
}
