/* Automatisa : site vitrine statique, sans dépendance.
   Identité : bleu nuit (#101828) pour la structure, vert d'accent (#B8F36B) pour les actions et ce qui est validé,
   blanc cassé pour les surfaces claires, gris ardoise pour les textes secondaires.
   Le vert n'est jamais utilisé comme couleur de texte sur fond clair (contraste insuffisant) : on prend --accent-texte. */

@font-face { font-family: "Geist"; src: url("fonts/geist.woff2") format("woff2"); font-weight: 100 900; font-display: swap; }
@font-face { font-family: "Montserrat"; src: url("fonts/montserrat-700.woff2") format("woff2"); font-weight: 700; font-display: swap; }
@font-face { font-family: "Manrope"; src: url("fonts/manrope-variable.woff2") format("woff2"); font-weight: 200 800; font-display: swap; }
@font-face { font-family: "Geist Mono"; src: url("fonts/geist-mono.woff2") format("woff2"); font-weight: 100 900; font-display: swap; }

:root {
  color-scheme: light dark;
  interpolate-size: allow-keywords;
  --nuit: #101828;
  --nuit-2: #1d2939;
  --nuit-3: #344054;
  --vert: #b8f36b;
  --vert-fonce: #a3e050;
  --fond: #f8faf5;
  --fond-muet: #f2f3ee;
  --carte: #ffffff;
  --titre: #101828;
  --texte: #344054;
  --doux: #4b5563;
  --trait: #e4e7ec;
  --trait-fort: #d0d5dd;
  --primaire: #101828;
  --sur-primaire: #ffffff;
  --accent: #b8f36b;
  --sur-accent: #101828;
  --accent-texte: #3f6212;
  --accent-pale: #f1fbe3;
  --accent-bord: #c9eb9b;
  --rouge: #b42318;
  --rouge-pale: #fef3f2;
  --ambre: #93370d;
  --ambre-pale: #fffaeb;
  --grille: rgba(16, 24, 40, 0.06);
  --ombre: 0 1px 2px rgba(16, 24, 40, 0.05), 0 8px 24px -12px rgba(16, 24, 40, 0.14);
  --ombre-forte: 0 1px 2px rgba(16, 24, 40, 0.06), 0 28px 60px -28px rgba(16, 24, 40, 0.35);
  --logo-a: #101828;
  --logo-fleche: #7fdd44;
  --rayon: 14px;
  --entete: 68px;
  --police: "Geist", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --police-marque: "Montserrat", var(--police);
  --police-signature: "Manrope", var(--police);
  --mono: "Geist Mono", ui-monospace, SFMono-Regular, Menlo, monospace;
  --sortie: cubic-bezier(0.16, 1, 0.3, 1);
}

@media (prefers-color-scheme: dark) {
  :root {
    --logo-a: #ffffff;
    --logo-fleche: #8ee350;
    --fond: #0b111d;
    --fond-muet: #0f1726;
    --carte: #131c2e;
    --titre: #f5f7fa;
    --texte: #d0d5dd;
    --doux: #98a2b3;
    --trait: #1f2a3d;
    --trait-fort: #344054;
    --primaire: #f5f7fa;
    --sur-primaire: #101828;
    --accent-texte: #b8f36b;
    --accent-pale: rgba(184, 243, 107, 0.1);
    --accent-bord: rgba(184, 243, 107, 0.32);
    --rouge: #fda29b;
    --rouge-pale: rgba(240, 68, 56, 0.14);
    --ambre: #fec84b;
    --ambre-pale: rgba(247, 144, 9, 0.14);
    --grille: rgba(255, 255, 255, 0.05);
    --ombre: 0 1px 2px rgba(0, 0, 0, 0.4), 0 8px 24px -12px rgba(0, 0, 0, 0.6);
    --ombre-forte: 0 1px 2px rgba(0, 0, 0, 0.4), 0 28px 60px -28px rgba(0, 0, 0, 0.85);
  }
}

/* Base */
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: calc(var(--entete) + 24px); -webkit-text-size-adjust: 100%; }
body { margin: 0; font-family: var(--police); font-size: 16.5px; line-height: 1.65; color: var(--texte); background: var(--fond); -webkit-font-smoothing: antialiased; font-feature-settings: "ss01"; }
h1, h2, h3, h4 { color: var(--titre); margin: 0; font-weight: 650; letter-spacing: -0.025em; text-wrap: balance; }
h1 { font-size: clamp(2.35rem, 5.2vw, 4rem); line-height: 1.03; letter-spacing: -0.045em; font-weight: 700; }
h2 { font-size: clamp(1.8rem, 3.3vw, 2.7rem); line-height: 1.1; letter-spacing: -0.04em; }
h3 { font-size: 1.1rem; line-height: 1.35; letter-spacing: -0.015em; }
h4 { font-size: 0.98rem; line-height: 1.4; }
p { margin: 0; text-wrap: pretty; }
a { color: var(--titre); text-underline-offset: 3px; }
ul, ol { margin: 0; }
code, .code { font-family: var(--mono); font-size: 0.86em; }
::selection { background: var(--vert); color: var(--nuit); }
:focus-visible { outline: 2px solid var(--titre); outline-offset: 3px; border-radius: 6px; }
.skip { position: absolute; left: -999px; top: 0; background: var(--nuit); color: #fff; padding: 10px 16px; z-index: 40; border-radius: 8px; }
.skip:focus { left: 12px; top: 12px; }
.sr { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }

.conteneur { width: min(1160px, 100% - 48px); margin-inline: auto; }
.conteneur--etroit { width: min(780px, 100% - 48px); }

/* En-tête */
.entete { position: sticky; top: 0; z-index: 30; background: color-mix(in srgb, var(--fond) 86%, transparent); backdrop-filter: blur(12px) saturate(140%); -webkit-backdrop-filter: blur(12px) saturate(140%); border-bottom: 1px solid transparent; transition: border-color 0.3s ease; }
.entete.est-defile { border-bottom-color: var(--trait); }
.entete__barre { display: flex; align-items: center; gap: 20px; min-height: var(--entete); }
.marque { display: inline-flex; align-items: center; gap: 10px; min-height: 44px; color: var(--titre); text-decoration: none; font-weight: 700; font-size: 1.12rem; letter-spacing: -0.035em; }
.marque__logo { flex-shrink: 0; overflow: visible; }
.marque__texte { display: grid; line-height: 1.1; }
.marque__nom { font-family: var(--police-marque); font-weight: 700; font-size: 1.22rem; letter-spacing: -0.03em; }
.marque__descripteur { font-family: var(--police-signature); font-size: 0.72rem; font-weight: 400; letter-spacing: 0; color: var(--doux); }
.logo-a-trait { stroke: var(--logo-a); }
.logo-a-fond { fill: var(--logo-a); }
.logo-fleche { fill: var(--logo-fleche); stroke: var(--logo-fleche); }
.nav { display: flex; align-items: center; gap: 2px; margin-left: auto; }
.nav a { display: inline-flex; align-items: center; min-height: 40px; padding: 0 11px; border-radius: 8px; color: var(--doux); text-decoration: none; font-size: 0.92rem; font-weight: 500; transition: color 0.2s ease, background-color 0.2s ease; }
.nav a:hover, .nav a[aria-current="page"] { color: var(--titre); background: var(--fond-muet); }
.entete__cta .court { display: none; }
.nav-mobile { display: none; }

/* Boutons : vert = action principale, nuit = action secondaire forte, contour = action tertiaire */
.bouton { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 46px; padding: 0 22px; border-radius: 10px; border: 1px solid var(--vert-fonce); background: var(--vert); color: var(--nuit); font: inherit; font-weight: 600; font-size: 0.96rem; letter-spacing: -0.01em; text-decoration: none; white-space: nowrap; cursor: pointer; transition: background-color 0.2s ease, transform 0.2s var(--sortie), box-shadow 0.2s ease; }
.bouton:hover { background: var(--vert-fonce); box-shadow: 0 6px 18px -8px rgba(120, 180, 40, 0.6); }
.bouton:active { transform: scale(0.98); }
.bouton:disabled { opacity: 0.6; cursor: progress; }
.bouton svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.bouton--petit { min-height: 40px; padding: 0 15px; font-size: 0.9rem; }
.bouton--sombre { background: var(--primaire); border-color: var(--primaire); color: var(--sur-primaire); }
.bouton--sombre:hover { background: var(--primaire); opacity: 0.9; box-shadow: none; }
.bouton--contour { background: transparent; color: var(--titre); border-color: var(--trait-fort); }
.bouton--contour:hover { background: var(--fond-muet); box-shadow: none; }
.lien-fleche { display: inline-flex; align-items: center; gap: 6px; min-height: 44px; font-weight: 600; color: var(--titre); text-decoration: none; }
.lien-fleche::after { content: "→"; transition: transform 0.2s var(--sortie); }
.lien-fleche:hover::after { transform: translateX(3px); }
.lien-fleche:hover { text-decoration: underline; }

/* Petits éléments */
.badge { display: inline-flex; align-items: center; gap: 8px; padding: 5px 12px 5px 10px; border: 1px solid var(--trait); border-radius: 999px; background: var(--carte); font-size: 0.82rem; font-weight: 500; color: var(--texte); }
.badge__point { position: relative; width: 8px; height: 8px; border-radius: 50%; background: var(--vert); flex-shrink: 0; }
.surtitre { font-family: var(--mono); font-size: 0.78rem; font-weight: 500; letter-spacing: 0.06em; text-transform: uppercase; color: var(--accent-texte); margin-bottom: 14px; }
.tag { display: inline-flex; align-items: center; font-size: 0.74rem; font-weight: 600; padding: 2px 8px; border-radius: 6px; border: 1px solid var(--trait); background: var(--fond-muet); color: var(--texte); }
.tag--rouge { border-color: transparent; background: var(--rouge-pale); color: var(--rouge); }
.tag--ambre { border-color: transparent; background: var(--ambre-pale); color: var(--ambre); }
.tag--vert { border-color: var(--accent-bord); background: var(--accent-pale); color: var(--accent-texte); }
.icone { width: 42px; height: 42px; padding: 10px; border-radius: 11px; border: 1px solid var(--trait); background: var(--carte); fill: none; stroke: var(--titre); stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; margin-bottom: 16px; flex-shrink: 0; }
.carte { background: var(--carte); border: 1px solid var(--trait); border-radius: var(--rayon); transition: border-color 0.25s ease, box-shadow 0.25s ease, transform 0.25s var(--sortie); }
.note { margin-top: 18px; font-size: 0.86rem; color: var(--doux); }
.mention-simulation { display: inline-flex; align-items: center; gap: 8px; font-family: var(--mono); font-size: 0.74rem; letter-spacing: 0.03em; text-transform: uppercase; color: var(--ambre); background: var(--ambre-pale); border-radius: 6px; padding: 3px 8px; }

/* Héros : bandeau bleu nuit, identique en mode clair et sombre */
.hero { position: relative; padding: 96px 0 104px; overflow: hidden; background: var(--nuit); color: #d0d5dd; }
.hero::before { content: ""; position: absolute; inset: 0; background-image: linear-gradient(rgba(255, 255, 255, 0.05) 1px, transparent 1px), linear-gradient(90deg, rgba(255, 255, 255, 0.05) 1px, transparent 1px); background-size: 56px 56px; mask-image: radial-gradient(ellipse 80% 70% at 70% 30%, #000 20%, transparent 75%); -webkit-mask-image: radial-gradient(ellipse 80% 70% at 70% 30%, #000 20%, transparent 75%); pointer-events: none; }
.hero__grille { position: relative; z-index: 1; display: grid; grid-template-columns: 1.08fr 0.92fr; gap: 64px; align-items: center; }
.hero h1 { color: #fff; margin-top: 22px; }
.hero h1 em { font-style: normal; color: var(--vert); }
.hero .badge { background: rgba(255, 255, 255, 0.06); border-color: rgba(255, 255, 255, 0.14); color: #e4e7ec; }
.hero__chapo { font-size: 1.15rem; color: #b6bfcc; margin-top: 24px; max-width: 35em; }
.hero__actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 32px; }
.hero .bouton--contour { color: #fff; border-color: rgba(255, 255, 255, 0.28); }
.hero .bouton--contour:hover { background: rgba(255, 255, 255, 0.08); }
.reassurance { list-style: none; padding: 0; margin: 34px 0 0; display: grid; gap: 10px; }
.reassurance li { display: flex; align-items: flex-start; gap: 10px; font-size: 0.93rem; color: #b6bfcc; line-height: 1.5; }
.reassurance svg { width: 20px; height: 20px; flex-shrink: 0; margin-top: 1px; padding: 4px; border-radius: 50%; background: rgba(184, 243, 107, 0.16); fill: none; stroke: var(--vert); stroke-width: 3; stroke-linecap: round; stroke-linejoin: round; }
.reassurance strong { color: #fff; font-weight: 600; }
.hero__suite { margin-top: 22px; font-size: 0.92rem; color: #b6bfcc; max-width: 36em; }
.hero__suite a { color: #fff; font-weight: 600; }

/* Schéma de flux du héros */
.schema { margin: 0; padding: 22px; border-radius: 18px; border: 1px solid rgba(255, 255, 255, 0.12); background: linear-gradient(180deg, rgba(255, 255, 255, 0.06), rgba(255, 255, 255, 0.02)); box-shadow: 0 30px 80px -40px rgba(0, 0, 0, 0.8); }
.schema__titre { display: flex; justify-content: space-between; align-items: center; gap: 12px; font-family: var(--mono); font-size: 0.76rem; color: #98a2b3; margin-bottom: 16px; }
.schema ol { list-style: none; padding: 0; display: grid; gap: 0; }
.schema li { position: relative; display: grid; grid-template-columns: 40px 1fr auto; gap: 14px; align-items: center; padding: 12px 14px; border-radius: 12px; }
.schema li + li::before { content: ""; position: absolute; left: 33px; top: -10px; height: 20px; width: 2px; background: rgba(255, 255, 255, 0.14); }
.schema__icone { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 11px; background: rgba(255, 255, 255, 0.07); border: 1px solid rgba(255, 255, 255, 0.12); }
.schema__icone svg { width: 20px; height: 20px; fill: none; stroke: #e4e7ec; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.schema strong { display: block; color: #fff; font-weight: 600; font-size: 0.97rem; line-height: 1.3; }
.schema span.schema__detail { display: block; color: #98a2b3; font-size: 0.84rem; line-height: 1.4; }
.schema__etat { font-family: var(--mono); font-size: 0.7rem; color: #98a2b3; white-space: nowrap; }
.schema li.schema__humain { background: rgba(184, 243, 107, 0.1); border: 1px solid rgba(184, 243, 107, 0.35); }
.schema li.schema__humain .schema__icone { background: var(--vert); border-color: var(--vert); }
.schema li.schema__humain .schema__icone svg { stroke: var(--nuit); }
.schema li.schema__humain .schema__etat { color: var(--vert); }
.schema__pied { margin-top: 14px; padding-top: 14px; border-top: 1px solid rgba(255, 255, 255, 0.1); font-size: 0.82rem; color: #98a2b3; }
.js .schema[data-anime] li { transition: opacity 0.5s var(--sortie), transform 0.5s var(--sortie); }
.js .schema[data-anime] li:not(.actif) { opacity: 0.35; }

/* Sections */
.section { padding: 112px 0; }
.section--muet { background: var(--fond-muet); border-block: 1px solid var(--trait); }
.section--nuit { background: var(--nuit); color: #d0d5dd; }
.section--nuit h2, .section--nuit h3 { color: #fff; }
.section--nuit .surtitre { color: var(--vert); }
.section__entete { max-width: 680px; margin-bottom: 52px; }
.section__entete > p:not(.surtitre) { color: var(--doux); font-size: 1.07rem; margin-top: 16px; }
.section--nuit .section__entete > p:not(.surtitre) { color: #b6bfcc; }
.section__entete--centre { margin-inline: auto; text-align: center; }
.section__suite { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 20px; margin-top: 40px; }
.section__suite p { color: var(--doux); font-size: 0.95rem; }

/* Démonstration interactive */
.simu { display: grid; grid-template-columns: 300px 1fr; border: 1px solid var(--trait); border-radius: 18px; background: var(--carte); box-shadow: var(--ombre-forte); overflow: hidden; }
.simu__barre { grid-column: 1 / -1; display: flex; flex-wrap: wrap; align-items: center; gap: 10px 16px; padding: 14px 18px; border-bottom: 1px solid var(--trait); background: var(--fond-muet); }
.simu__barre-titre { font-family: var(--mono); font-size: 0.8rem; color: var(--doux); }
.simu__barre .mention-simulation { margin-left: auto; }
.simu__boite { border-right: 1px solid var(--trait); padding: 14px; display: grid; gap: 8px; align-content: start; }
.simu__boite-titre { font-size: 0.78rem; font-weight: 600; color: var(--doux); text-transform: uppercase; letter-spacing: 0.05em; padding: 4px 6px; }
.simu__mail { display: block; width: 100%; text-align: left; font: inherit; color: inherit; padding: 12px 14px; border-radius: 10px; border: 1px solid var(--trait); background: var(--carte); cursor: pointer; transition: border-color 0.2s ease, background-color 0.2s ease; }
.simu__mail:hover { border-color: var(--trait-fort); }
.simu__mail[aria-pressed="true"] { border-color: var(--nuit-3); background: var(--fond-muet); box-shadow: inset 3px 0 0 var(--vert-fonce); }
.simu__mail-de { display: flex; justify-content: space-between; gap: 8px; font-size: 0.8rem; color: var(--doux); }
.simu__mail-objet { display: block; font-weight: 600; color: var(--titre); font-size: 0.92rem; line-height: 1.35; margin-top: 2px; }
.simu__scene { padding: 22px 24px 24px; min-width: 0; }
.simu__etapes { list-style: none; padding: 0; display: grid; grid-template-columns: repeat(5, 1fr); gap: 6px; margin-bottom: 22px; counter-reset: simu; }
.simu__etapes li { counter-increment: simu; font-size: 0.76rem; font-weight: 500; color: var(--doux); padding-top: 10px; border-top: 3px solid var(--trait); line-height: 1.3; }
.simu__etapes li::before { content: counter(simu) ". "; font-family: var(--mono); }
.simu__etapes li.fait { border-top-color: var(--nuit-3); color: var(--titre); }
.simu__etapes li.courant { border-top-color: var(--vert-fonce); color: var(--titre); font-weight: 600; }
.simu__bloc { padding: 16px 18px; border: 1px solid var(--trait); border-radius: 12px; background: var(--carte); }
.simu__bloc + .simu__bloc { margin-top: 12px; }
.simu__label { font-family: var(--mono); font-size: 0.74rem; text-transform: uppercase; letter-spacing: 0.05em; color: var(--doux); margin-bottom: 8px; }
.simu__email-texte { font-size: 0.94rem; }
.simu__tags { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.simu__tags p { font-size: 0.88rem; color: var(--doux); width: 100%; margin-top: 6px; }
.simu__masque { font-size: 0.92rem; line-height: 1.9; }
.simu__brouillon { font-size: 0.94rem; white-space: pre-line; }
.simu__bloc--validation { border-color: var(--accent-bord); background: var(--accent-pale); }
.simu__actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 14px; }
.simu__resultat { margin-top: 12px; font-weight: 600; color: var(--titre); }
.simu__resultat:empty { display: none; }
.simu__suivant { margin-top: 16px; }
.simu__note { margin-top: 14px; font-size: 0.84rem; color: var(--doux); }
.simu code { padding: 1px 6px; border-radius: 6px; background: var(--accent-pale); border: 1px solid var(--accent-bord); color: var(--accent-texte); font-weight: 500; }

/* Bénéfices */
.benefices { display: grid; grid-template-columns: repeat(6, 1fr); gap: 16px; }
.benefices > * { grid-column: span 2; padding: 26px; }
.benefices > :nth-child(n+4) { grid-column: span 3; }
.benefices h3 { margin-bottom: 8px; }
.benefices p { color: var(--doux); font-size: 0.95rem; }

/* Agents */
.agents { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; }
.agent { display: flex; flex-direction: column; padding: 28px; }
.agent:hover { border-color: var(--trait-fort); box-shadow: var(--ombre); }
.agent__haut { display: flex; gap: 16px; align-items: flex-start; }
.agent__haut .icone { margin-bottom: 0; }
.agent__pour { font-size: 0.86rem; color: var(--doux); margin-top: 2px; }
.agent dl { margin: 20px 0 0; display: grid; gap: 12px; }
.agent dt { font-family: var(--mono); font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.06em; color: var(--accent-texte); }
.agent dd { margin: 2px 0 0; font-size: 0.95rem; color: var(--texte); }
.agent dd.agent__limite { color: var(--doux); }
.agent__pied { margin-top: auto; padding-top: 18px; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 16px; border-top: 1px dashed var(--trait-fort); margin-block-start: 22px; }
.agent__prix { font-size: 0.86rem; color: var(--doux); }

/* Fonctionnement */
.fonctionnement { list-style: none; padding: 0; display: grid; grid-template-columns: repeat(5, 1fr); gap: 0; border: 1px solid rgba(255, 255, 255, 0.12); border-radius: 18px; overflow: hidden; counter-reset: f; }
.fonctionnement li { counter-increment: f; padding: 26px 22px; border-left: 1px solid rgba(255, 255, 255, 0.12); }
.fonctionnement li:first-child { border-left: 0; }
.fonctionnement li::before { content: "0" counter(f); display: block; font-family: var(--mono); font-size: 0.8rem; color: var(--vert); margin-bottom: 14px; }
.fonctionnement h3 { font-size: 1.02rem; margin-bottom: 8px; }
.fonctionnement p { font-size: 0.9rem; color: #b6bfcc; }
.fonctionnement li.humain { background: rgba(184, 243, 107, 0.08); }
.outils { margin-top: 28px; display: flex; flex-wrap: wrap; gap: 8px; align-items: center; font-size: 0.9rem; color: #b6bfcc; }
.outils span { padding: 4px 10px; border-radius: 999px; border: 1px solid rgba(255, 255, 255, 0.16); color: #e4e7ec; font-size: 0.84rem; }

/* Sécurité : démonstration du masquage */
.masquage { display: grid; grid-template-columns: 1fr auto 1fr; gap: 20px; align-items: stretch; padding: 24px; margin-bottom: 20px; background: var(--carte); border: 1px solid var(--trait); border-radius: 18px; box-shadow: var(--ombre); }
.masquage__col { padding: 18px 20px; border: 1px solid var(--trait); border-radius: 12px; background: var(--fond-muet); }
.masquage__col--ia { border-color: var(--accent-bord); background: var(--accent-pale); }
.masquage__label { display: flex; align-items: center; gap: 8px; font-family: var(--mono); font-size: 0.75rem; text-transform: uppercase; letter-spacing: 0.04em; color: var(--doux); margin-bottom: 10px; }
.masquage__col--ia .masquage__label { color: var(--accent-texte); }
.masquage__label svg { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.masquage__texte { font-size: 1.02rem; line-height: 1.9; color: var(--titre); }
.masquage mark { overflow-wrap: anywhere; background: transparent; color: var(--titre); font-weight: 600; text-decoration: underline; text-decoration-color: var(--trait-fort); text-underline-offset: 4px; }
.masquage code { display: inline; overflow-wrap: anywhere; padding: 2px 7px; border-radius: 6px; background: var(--carte); border: 1px solid var(--accent-bord); color: var(--accent-texte); font-weight: 500; -webkit-box-decoration-break: clone; box-decoration-break: clone; transition: background-color 0.3s ease, color 0.3s ease, border-color 0.3s ease; }
.masquage code.clair { background: var(--fond-muet); border-color: var(--trait); color: var(--titre); font-family: var(--police); font-weight: 600; }
.masquage code.bascule { animation: bascule 0.6s var(--sortie); }
@keyframes bascule { 0% { background: var(--vert); color: var(--nuit); } 100% { background: var(--carte); color: var(--accent-texte); } }
.masquage__fleche { display: grid; place-items: center; }
.masquage__fleche svg { width: 40px; height: 40px; padding: 10px; border-radius: 50%; border: 1px solid var(--trait); background: var(--carte); fill: none; stroke: var(--titre); stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.masquage__note { grid-column: 1 / -1; font-size: 0.88rem; color: var(--doux); }

.piliers { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; background: var(--trait); border: 1px solid var(--trait); border-radius: 18px; overflow: hidden; }
.piliers article { padding: 28px; background: var(--carte); }
.piliers h3 { margin-bottom: 6px; }
.piliers p { color: var(--doux); font-size: 0.94rem; }

/* Crédibilité */
.preuves { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.preuves article { padding: 26px; }
.preuves h3 { margin-bottom: 8px; }
.preuves p { color: var(--doux); font-size: 0.94rem; }
.certifs { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 14px; }
.certifs span { font-family: var(--mono); font-size: 0.76rem; padding: 3px 8px; border-radius: 6px; background: var(--fond-muet); border: 1px solid var(--trait); color: var(--titre); }

/* Atelier */
.offre { display: grid; grid-template-columns: 1.1fr 0.9fr; gap: 20px; align-items: stretch; }
.offre__carte { padding: 32px; }
.offre__prix { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 12px; margin: 10px 0 16px; }
.offre__montant { font-size: 2.6rem; font-weight: 700; letter-spacing: -0.04em; color: var(--titre); line-height: 1; }
.offre__unite { color: var(--doux); font-size: 0.95rem; }
.coches { list-style: none; padding: 0; display: grid; gap: 10px; margin-top: 16px; }
.coches li { position: relative; padding-left: 28px; font-size: 0.95rem; }
.coches li::before { content: ""; position: absolute; left: 0; top: 0.3em; width: 18px; height: 18px; border-radius: 50%; background: var(--vert) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23101828' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6L9 17l-5-5'/%3E%3C/svg%3E") center / 11px no-repeat; }
.conditions { padding: 28px; display: grid; gap: 18px; align-content: start; }
.conditions h3 { font-size: 1rem; margin-bottom: 4px; }
.conditions p { color: var(--doux); font-size: 0.93rem; }
.offre__actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 24px; }

.etapes { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; counter-reset: etape; }
.etapes li { counter-increment: etape; position: relative; padding-top: 56px; }
.etapes li::before { content: "0" counter(etape); position: absolute; top: 0; left: 0; display: grid; place-items: center; width: 38px; height: 38px; border-radius: 10px; background: var(--nuit); font-family: var(--mono); font-size: 0.82rem; color: var(--vert); z-index: 1; }
.etapes li::after { content: ""; position: absolute; top: 19px; left: 50px; right: -12px; height: 1px; background: var(--trait-fort); }
.etapes li:last-child::after { display: none; }
.etape__delai { display: inline-block; font-family: var(--mono); font-size: 0.75rem; color: var(--accent-texte); margin-bottom: 4px; }
.etapes p { color: var(--doux); font-size: 0.93rem; margin-top: 6px; }

/* FAQ */
.faq { border-top: 1px solid var(--trait); }
.faq details { border-bottom: 1px solid var(--trait); }
.faq details::details-content { block-size: 0; overflow: hidden; transition: block-size 0.35s var(--sortie), content-visibility 0.35s allow-discrete; }
.faq details[open]::details-content { block-size: auto; }
.faq summary { cursor: pointer; list-style: none; position: relative; display: flex; align-items: center; min-height: 64px; padding: 16px 44px 16px 0; font-weight: 600; color: var(--titre); }
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: ""; position: absolute; right: 8px; top: 50%; width: 8px; height: 8px; border-right: 1.5px solid var(--doux); border-bottom: 1.5px solid var(--doux); transform: translateY(-70%) rotate(45deg); transition: transform 0.3s var(--sortie); }
.faq details[open] summary::after { transform: translateY(-30%) rotate(-135deg); }
.faq details > p, .faq details > ul { color: var(--doux); padding: 0 44px 20px 0; }
.faq details > ul { padding-left: 20px; }

/* Appel à l'action final */
.cta-final { padding: 0 0 112px; }
.cta-final__boite { position: relative; overflow: hidden; display: grid; grid-template-columns: 1.2fr 0.8fr; align-items: center; gap: 40px; padding: 56px; border-radius: 24px; background: var(--nuit); }
.cta-final__boite::after { content: ""; position: absolute; right: -80px; bottom: -120px; width: 360px; height: 360px; border-radius: 50%; border: 56px solid rgba(184, 243, 107, 0.12); pointer-events: none; }
.cta-final__boite > * { position: relative; z-index: 1; }
.cta-final h2 { color: #fff; }
.cta-final__boite > div > p { color: #b6bfcc; margin-top: 12px; }
.cta-final__actions { display: grid; gap: 12px; justify-items: stretch; }
.cta-final__actions .bouton--contour { color: #fff; border-color: rgba(255, 255, 255, 0.3); }
.cta-final__actions .bouton--contour:hover { background: rgba(255, 255, 255, 0.08); }
.cta-final__actions p { color: #98a2b3; font-size: 0.84rem; text-align: center; }

/* Pied de page */
.pied { border-top: 1px solid var(--trait); padding: 56px 0 32px; font-size: 0.9rem; color: var(--doux); }
.pied__grille { display: grid; grid-template-columns: 1.6fr 1fr 1fr 0.8fr; gap: 24px 40px; align-items: start; }
.pied__intro p:not(.pied__marque) { margin: 6px 0 18px; max-width: 30em; }
.pied__marque { font-family: var(--police-marque); color: var(--titre); font-weight: 700; font-size: 1.05rem; letter-spacing: -0.03em; }
.pied__titre { color: var(--titre); font-weight: 600; margin-bottom: 6px; }
.pied nav { display: grid; align-content: start; }
.pied nav a { display: inline-flex; align-items: center; min-height: 36px; color: var(--doux); text-decoration: none; }
.pied nav a:hover, .pied nav a[aria-current="page"] { color: var(--titre); text-decoration: underline; }
.pied__mention { grid-column: 1 / -1; padding-top: 20px; border-top: 1px solid var(--trait); font-size: 0.82rem; }

/* Pages intérieures (aucun style en ligne : la politique de sécurité les interdit) */
.mt-l { margin-top: 40px; }
.bloc-titre { margin-bottom: 28px; }
.page-hero { padding: 72px 0 64px; border-bottom: 1px solid var(--trait); background: var(--fond-muet); }
.fil { display: flex; flex-wrap: wrap; gap: 6px; list-style: none; padding: 0; margin-bottom: 22px; font-size: 0.86rem; color: var(--doux); }
.fil li + li::before { content: "/"; margin-right: 6px; color: var(--trait-fort); }
.fil a { color: var(--doux); }
.page-hero h1 { font-size: clamp(2.1rem, 4.4vw, 3.3rem); max-width: 18em; }
.page-hero__chapo { font-size: 1.15rem; color: var(--doux); margin-top: 20px; max-width: 40em; }
.page-hero .hero__actions { margin-top: 28px; }
.definition { margin-top: 28px; max-width: 46em; padding: 18px 20px; border-left: 3px solid var(--vert-fonce); background: var(--carte); border-radius: 0 12px 12px 0; }
.definition p { color: var(--texte); }
.contenu { padding: 80px 0; }
.contenu--muet { background: var(--fond-muet); border-block: 1px solid var(--trait); }
.prose { max-width: 46em; }
.prose h2 { font-size: clamp(1.5rem, 2.6vw, 2rem); margin: 0 0 16px; }
.prose h3 { margin: 28px 0 8px; }
.prose p, .prose ul, .prose ol { color: var(--texte); }
.prose p + p, .prose p + ul, .prose ul + p, .prose p + ol, .prose ol + p { margin-top: 14px; }
.prose ul, .prose ol { padding-left: 22px; display: grid; gap: 6px; }
.prose a { color: var(--titre); }
.colonnes { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; }
.colonnes--3 { grid-template-columns: repeat(3, 1fr); }
.colonnes > .carte { padding: 26px; }
.colonnes h3 { margin-bottom: 8px; }
.colonnes .carte p, .colonnes .carte li { color: var(--doux); font-size: 0.95rem; }
.colonnes .carte ul { padding-left: 20px; display: grid; gap: 6px; }
.carte--limite { border-style: dashed; }
.liens-associes { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin-top: 8px; }
.liens-associes a { display: block; padding: 18px 20px; border: 1px solid var(--trait); border-radius: 12px; background: var(--carte); text-decoration: none; color: var(--titre); font-weight: 600; transition: border-color 0.2s ease; }
.liens-associes a:hover { border-color: var(--trait-fort); }
.liens-associes a span { display: block; font-weight: 400; color: var(--doux); font-size: 0.88rem; margin-top: 4px; }
.page-texte { padding: 64px 0 96px; }
.page-texte h1 { margin-bottom: 18px; font-size: clamp(2rem, 4vw, 2.8rem); }
.page-texte h2 { font-size: 1.2rem; margin: 32px 0 8px; }
.page-texte p { color: var(--doux); }

/* Scénarios (pages agents) */
.scenario { padding: 30px; }
.scenario__titre { display: flex; gap: 16px; align-items: flex-start; margin-bottom: 28px; }
.scenario__titre .icone { margin-bottom: 0; }
.scenario__titre p { color: var(--doux); margin-top: 2px; font-size: 0.95rem; }
.flux { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.flux li { position: relative; display: flex; flex-direction: column; padding-top: 16px; }
.flux li::before { content: ""; position: absolute; top: 0; left: 0; right: 0; height: 3px; border-radius: 2px; background: var(--vert-fonce); }
.flux__heure { font-family: var(--mono); font-size: 0.75rem; color: var(--accent-texte); }
.flux__etape { font-weight: 600; color: var(--titre); margin: 2px 0 10px; font-size: 0.95rem; }
.ecran { flex: 1; background: var(--fond-muet); border: 1px solid var(--trait); border-radius: 10px; padding: 14px; font-size: 0.88rem; }
.ecran p + p { margin-top: 8px; }
.ecran__ligne { color: var(--doux); }
.ecran__chiffre { font-size: 1.4rem; font-weight: 650; letter-spacing: -0.03em; color: var(--titre); font-variant-numeric: tabular-nums; }
.ecran__boutons { display: flex; gap: 6px; flex-wrap: wrap; }
.ecran__boutons span { font-size: 0.78rem; font-weight: 600; padding: 4px 10px; border-radius: 6px; border: 1px solid var(--trait-fort); background: var(--carte); color: var(--texte); }
.ecran__boutons .ok { background: var(--vert); border-color: var(--vert-fonce); color: var(--nuit); }
.ecran--succes { background: var(--accent-pale); border-color: var(--accent-bord); }
.ecran--succes .ecran__ligne, .ecran--succes strong { color: var(--accent-texte); }
.conversation { max-width: 720px; display: grid; gap: 10px; }
.bulle { border-radius: 14px; padding: 12px 16px; font-size: 0.93rem; }
.bulle--question { justify-self: end; max-width: 80%; background: var(--nuit); color: #fff; border-bottom-right-radius: 4px; }
.bulle--reponse { max-width: 88%; background: var(--fond-muet); border: 1px solid var(--trait); border-bottom-left-radius: 4px; }
.bulle__total { margin-top: 8px; font-weight: 600; color: var(--titre); }
.bulle__source { margin-top: 8px; font-family: var(--mono); font-size: 0.75rem; color: var(--doux); }

/* Tableaux */
.tableau { border: 1px solid var(--trait); border-radius: 12px; overflow-x: auto; background: var(--carte); }
.tableau table { width: 100%; border-collapse: collapse; font-size: 0.93rem; }
.tableau caption { text-align: left; padding: 14px 16px 0; font-weight: 600; color: var(--titre); }
.tableau th { text-align: left; font-size: 0.8rem; font-weight: 600; color: var(--titre); padding: 12px 16px; background: var(--fond-muet); border-bottom: 1px solid var(--trait); vertical-align: bottom; }
.tableau tbody th { font-size: 0.93rem; background: transparent; font-weight: 600; vertical-align: top; }
.tableau td { padding: 12px 16px; border-bottom: 1px solid var(--trait); vertical-align: top; color: var(--texte); }
.tableau tbody tr:last-child td, .tableau tbody tr:last-child th { border-bottom: 0; }

/* Formulaires */
.formulaire { display: grid; gap: 20px; }
.formulaire fieldset { border: 0; padding: 0; margin: 0; display: grid; gap: 20px; }
.formulaire legend { font-weight: 650; color: var(--titre); font-size: 1.05rem; margin-bottom: 4px; padding: 0; }
.champs { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.champ { display: grid; gap: 6px; align-content: start; }
.champ--large { grid-column: 1 / -1; }
.champ > label, .champ > .champ__label { font-weight: 600; color: var(--titre); font-size: 0.93rem; }
.champ__aide { font-size: 0.84rem; color: var(--doux); }
.optionnel { font-weight: 400; color: var(--doux); }
.champ input[type="text"], .champ input[type="email"], .champ input[type="tel"], .champ input[type="number"], .champ select, .champ textarea {
  width: 100%; min-height: 48px; padding: 10px 14px; font: inherit; font-size: 1rem; color: var(--titre); background: var(--carte);
  border: 1px solid var(--trait-fort); border-radius: 10px; transition: border-color 0.2s ease, box-shadow 0.2s ease;
}
.champ textarea { min-height: 110px; resize: vertical; }
.champ input:focus, .champ select:focus, .champ textarea:focus { outline: none; border-color: var(--nuit-3); box-shadow: 0 0 0 3px color-mix(in srgb, var(--vert) 55%, transparent); }
.champ [aria-invalid="true"] { border-color: var(--rouge); }
.champ__erreur { font-size: 0.86rem; font-weight: 500; color: var(--rouge); }
.champ__erreur:empty { display: none; }
.choix { display: grid; grid-template-columns: repeat(2, 1fr); gap: 8px; }
.choix label { display: flex; align-items: flex-start; gap: 10px; min-height: 48px; padding: 12px 14px; border: 1px solid var(--trait-fort); border-radius: 10px; background: var(--carte); cursor: pointer; font-size: 0.94rem; color: var(--titre); }
.choix label:has(input:checked) { border-color: var(--nuit-3); background: var(--accent-pale); }
.choix label:has(input:focus-visible) { outline: 2px solid var(--titre); outline-offset: 2px; }
.choix input { width: 18px; height: 18px; margin: 2px 0 0; accent-color: var(--nuit); flex-shrink: 0; }
.piege { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.formulaire__envoi { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 20px; }
.formulaire__rgpd { font-size: 0.85rem; color: var(--doux); }
.message-formulaire { padding: 16px 18px; border-radius: 12px; font-size: 0.95rem; }
.message-formulaire:empty { display: none; }
.message-formulaire.est-erreur { background: var(--rouge-pale); color: var(--rouge); border: 1px solid color-mix(in srgb, var(--rouge) 30%, transparent); }
.message-formulaire.est-attente { background: var(--fond-muet); color: var(--texte); border: 1px solid var(--trait); }
.confirmation { padding: 32px; border-radius: 18px; border: 1px solid var(--accent-bord); background: var(--accent-pale); }
.confirmation h2 { font-size: 1.6rem; margin-bottom: 10px; }
.confirmation p + p { margin-top: 10px; }
.confirmation:focus { outline: none; }
.erreurs-resume { padding: 16px 18px; border-radius: 12px; border: 1px solid color-mix(in srgb, var(--rouge) 30%, transparent); background: var(--rouge-pale); color: var(--rouge); }
.erreurs-resume ul { padding-left: 20px; margin-top: 6px; }
.erreurs-resume a { color: var(--rouge); }
.contact-grille { display: grid; grid-template-columns: 1.35fr 0.65fr; gap: 40px; align-items: start; }
.contact-cote { display: grid; gap: 16px; position: sticky; top: calc(var(--entete) + 24px); }
.contact-cote .carte { padding: 24px; }
.contact-cote h2 { font-size: 1.1rem; margin-bottom: 8px; }
.contact-cote p, .contact-cote li { color: var(--doux); font-size: 0.93rem; }
.contact-cote ol { padding-left: 20px; display: grid; gap: 6px; }

/* Calculateur */
.calcul { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; align-items: start; }
.calcul__entrees { padding: 28px; display: grid; gap: 22px; }
.curseur { display: grid; gap: 8px; }
.curseur__haut { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; }
.curseur__haut label { font-weight: 600; color: var(--titre); font-size: 0.95rem; }
.curseur__valeur { display: flex; align-items: center; gap: 6px; }
.curseur__valeur input { width: 90px; min-height: 40px; padding: 6px 10px; font: inherit; text-align: right; color: var(--titre); background: var(--carte); border: 1px solid var(--trait-fort); border-radius: 8px; font-variant-numeric: tabular-nums; }
.curseur__valeur span { color: var(--doux); font-size: 0.88rem; }
.curseur input[type="range"] { width: 100%; accent-color: var(--nuit); min-height: 28px; }
.calcul__resultats { padding: 28px; background: var(--nuit); color: #d0d5dd; border-color: var(--nuit); position: sticky; top: calc(var(--entete) + 24px); }
.calcul__resultats h2 { color: #fff; font-size: 1.3rem; margin-bottom: 18px; }
.calcul__ligne { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; padding: 12px 0; border-bottom: 1px solid rgba(255, 255, 255, 0.1); }
.calcul__ligne dt { color: #b6bfcc; font-size: 0.93rem; }
.calcul__ligne dd { margin: 0; color: #fff; font-weight: 650; font-size: 1.15rem; font-variant-numeric: tabular-nums; text-align: right; }
.calcul__ligne--fort dd { color: var(--vert); font-size: 1.5rem; }
.calcul__resultats dl { margin: 0; }
.calcul__avertissement { margin-top: 18px; font-size: 0.84rem; color: #98a2b3; }
.calcul__resultats .bouton { margin-top: 20px; width: 100%; }

/* Grille de ressources */
.ressources { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; }
.ressource { display: flex; flex-direction: column; padding: 26px; text-decoration: none; color: inherit; }
.ressource:hover { border-color: var(--trait-fort); box-shadow: var(--ombre); }
.ressource h3 { margin: 8px 0; }
.ressource p { color: var(--doux); font-size: 0.95rem; }
.ressource .lien-fleche { margin-top: auto; padding-top: 12px; }

/* Apparitions au défilement (le contenu reste visible sans script) */
.js [data-reveal] { opacity: 0; transform: translateY(16px); transition: opacity 0.7s var(--sortie), transform 0.7s var(--sortie); }
.js [data-reveal].visible { opacity: 1; transform: none; }

/* Responsive */
@media (max-width: 1240px) {
  .marque__descripteur { display: none; }
}
@media (max-width: 1080px) {
  .nav a:nth-child(n+5) { display: none; }
}
@media (max-width: 1000px) {
  html { scroll-padding-top: calc(var(--entete) + 72px); }
  .nav { display: none; }
  .entete__barre { justify-content: space-between; }
  .nav-mobile { display: flex; gap: 6px; overflow-x: auto; padding: 0 16px 10px; scrollbar-width: none; }
  .nav-mobile::-webkit-scrollbar { display: none; }
  .nav-mobile a { flex-shrink: 0; display: inline-flex; align-items: center; min-height: 44px; padding: 0 14px; border-radius: 999px; border: 1px solid var(--trait); background: var(--carte); color: var(--texte); text-decoration: none; font-size: 0.88rem; font-weight: 500; }
  .nav-mobile a[aria-current="page"] { border-color: var(--nuit-3); color: var(--titre); }
  .hero__grille, .offre, .contact-grille, .calcul, .cta-final__boite { grid-template-columns: 1fr; gap: 40px; }
  .simu { grid-template-columns: 1fr; }
  .simu__boite { border-right: 0; border-bottom: 1px solid var(--trait); grid-template-columns: repeat(3, minmax(220px, 1fr)); overflow-x: auto; }
  .simu__boite-titre { grid-column: 1 / -1; }
  .benefices { grid-template-columns: 1fr 1fr; }
  .benefices > *, .benefices > :nth-child(n+4) { grid-column: auto; }
  .benefices > :last-child { grid-column: 1 / -1; }
  .agents, .preuves, .colonnes--3, .liens-associes { grid-template-columns: 1fr 1fr; }
  .fonctionnement { grid-template-columns: 1fr; }
  .fonctionnement li { border-left: 0; border-top: 1px solid rgba(255, 255, 255, 0.12); }
  .fonctionnement li:first-child { border-top: 0; }
  .piliers { grid-template-columns: 1fr 1fr; }
  .flux { grid-template-columns: 1fr 1fr; gap: 24px 16px; }
  .etapes { grid-template-columns: 1fr 1fr; gap: 32px 24px; }
  .etapes li::after { display: none; }
  .masquage { grid-template-columns: 1fr; }
  .masquage__fleche svg { transform: rotate(90deg); }
  .contact-cote, .calcul__resultats { position: static; }
  .pied__grille { grid-template-columns: 1fr 1fr; }
  .pied__intro { grid-column: 1 / -1; }
}
@media (max-width: 640px) {
  body { font-size: 16px; }
  .conteneur, .conteneur--etroit { width: calc(100% - 32px); }
  .entete__cta .long { display: none; }
  .entete__cta .court { display: inline; }
  .section { padding: 76px 0; }
  .hero { padding: 52px 0 64px; }
  .hero__actions .bouton, .page-hero .hero__actions .bouton { flex: 1 1 100%; }
  .schema { padding: 14px; }
  .schema li { grid-template-columns: 36px 1fr; padding: 10px 8px; }
  .schema__etat { display: none; }
  .schema li + li::before { left: 25px; }
  .simu__scene { padding: 18px 16px 20px; }
  .simu__etapes { grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 4px; }
  .simu__etapes li { font-size: 0; }
  .simu__etapes li::before { font-size: 0.78rem; }
  .simu__boite { grid-template-columns: repeat(3, minmax(210px, 1fr)); }
  .benefices, .agents, .preuves, .piliers, .colonnes, .colonnes--3, .liens-associes, .flux, .etapes, .champs, .choix, .ressources { grid-template-columns: 1fr; }
  .scenario, .masquage, .offre__carte, .conditions, .calcul__entrees, .calcul__resultats { padding: 20px 16px; }
  .agent { padding: 22px 18px; }
  .cta-final { padding-bottom: 76px; }
  .cta-final__boite { padding: 36px 22px; }
  .page-hero { padding: 44px 0 44px; }
  .contenu { padding: 56px 0; }
  .pied__grille { grid-template-columns: 1fr; }
  .bulle--question, .bulle--reponse { max-width: 100%; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation: none !important; transition: none !important; }
  .js [data-reveal] { opacity: 1; transform: none; }
  .js .schema[data-anime] li:not(.actif) { opacity: 1; }
}