/* Site www.inedee.com — feuille commune (charte d'octobre 2026).
   Le marine du logo porte le site, le bleu est réservé aux actions, les quatre couleurs du symbole servent de repères.
   Titres en Newsreader, texte en Schibsted Grotesk ; ni vagues ni pilules ; preuves et écrans réels plutôt que photos. */

/* ---------- Jetons ---------- */
:root {
  --encre: #001440;         /* titres, bandes sombres (couleur du nom dans le logo) */
  --texte: #4B556B;         /* texte courant (7,5:1 sur blanc) */
  --action: #0055D1;        /* liens et boutons */
  --action-survol: #0046AD;
  --fond: #FFFFFF;
  --papier: #F5F7FA;
  --brume: #E8ECF2;
  --trait: #D3DAE4;
  --ciel: #AFC0DE;          /* texte sur bande sombre */
  --filet-encre: rgba(175, 192, 222, .28);
  --logo-orange: #FFA10B;   /* couleurs du symbole du logo : repères de famille seulement, jamais en aplat */
  --logo-violet: #9B0BD9;
  --logo-rose: #F21D92;
  --logo-bleu: #0055D1;
  --repere-eteint: #D3DAE4;
  --serif: "Newsreader", Georgia, "Times New Roman", serif;
  --sans: "Schibsted Grotesk", "Segoe UI", system-ui, -apple-system, sans-serif;
  --ombre: 0 1px 2px rgba(0, 20, 64, .06), 0 16px 40px rgba(0, 20, 64, .10);
  --ombre-douce: 0 1px 2px rgba(0, 20, 64, .08), 0 6px 16px rgba(0, 20, 64, .06);
  --rayon: 12px;
  --rayon-btn: 6px;
  --conteneur: 1200px;
  --gouttiere: 24px;
  --entete: 72px;
  /* anciens noms, encore lus par les feuilles de pages */
  --marine: var(--encre);
  --gris: var(--texte);
  --gris-clair: var(--papier);
  --bleu-clair: #DCE7F8;
  --titre-menu: var(--encre);
  --poppins: var(--sans);
  --open: var(--sans);
  /* les anciennes couleurs d'accent des pages (aplats orange, violets, roses) deviennent toutes l'action */
  --orange: var(--action);
  --violet: var(--action);
  --rose: var(--action);
  --bleu: var(--action);
}

/* ---------- Base ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { line-height: 1.15; -webkit-text-size-adjust: 100%; scroll-padding-top: calc(var(--entete) + 16px); }
/* clip et non hidden : hidden ferait de body un conteneur de défilement et l'en-tête ne collerait plus */
html, body { max-width: 100%; overflow-x: clip; }
body { margin: 0; background: var(--fond); color: var(--texte); font-family: var(--sans); font-size: 16px; font-weight: 400; line-height: 1.6;
  -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }
h1, h2, h3, h4, h5, h6 { margin: 0; font-family: var(--sans); font-weight: 600; color: var(--encre); text-wrap: balance; }
h1, h2 { font-family: var(--serif); font-weight: 500; letter-spacing: -.012em; }
p { margin: 0 0 .9rem; }
a { color: inherit; text-decoration: none; }
img, video { display: block; max-width: 100%; height: auto; }
ul { margin: 0; padding: 0; list-style: none; }
strong, b { font-weight: 600; }
button, input, select, textarea { font: inherit; color: inherit; }
svg { display: block; fill: currentColor; }
:focus-visible { outline: 2px solid var(--action); outline-offset: 2px; }
/* lien d'évitement : visible seulement au clavier, au-dessus de l'en-tête collant */
.evitement { position: fixed; left: 12px; top: 12px; z-index: 200; padding: 10px 16px; border-radius: var(--rayon-btn); background: var(--encre); color: #fff; font-weight: 600; }
.evitement:not(:focus) { width: 1px; height: 1px; padding: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.sr { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.picto { fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
.repere { --repere-eteint: var(--trait); flex: none; width: 28px; height: 28px; }
.repere--1 { --r-orange: var(--logo-orange); }
.repere--2 { --r-orange: var(--logo-orange); --r-bleu: var(--logo-bleu); }
.repere--4 { --r-orange: var(--logo-orange); --r-bleu: var(--logo-bleu); --r-violet: var(--logo-violet); --r-rose: var(--logo-rose); }

.conteneur { width: 100%; max-width: calc(var(--conteneur) + 2 * var(--gouttiere)); margin-inline: auto; padding-inline: var(--gouttiere); }
.bande { padding-block: clamp(56px, 7vw, 96px); }
.bande--papier { background: var(--papier); }
.bande--encre { background: var(--encre); color: var(--ciel); }
.bande--encre h2, .bande--encre h3 { color: #fff; }
.bande--filet { border-top: 1px solid var(--trait); }

/* ---------- Typographie commune ---------- */
.surtitre { display: block; font-family: var(--sans); font-size: 13px; font-weight: 600; line-height: 16px; letter-spacing: .12em; text-transform: uppercase; color: var(--texte); }
.bande--encre .surtitre { color: var(--ciel); }
.titre-section { font-family: var(--serif); font-size: clamp(32px, 3.8vw, 46px); font-weight: 500; line-height: 1.1; letter-spacing: -.012em; color: var(--encre); }
.titre-section strong { font-weight: inherit; }
.titre-section br { display: none; }
/* H2 qui passe en surtitre, suivi d'une promesse en gros (.accroche), sur le modèle du H1 de l'accueil */
.titre-surtitre { font-family: var(--sans); font-size: 13px; font-weight: 600; line-height: 16px; letter-spacing: .12em; text-transform: uppercase; color: var(--texte); }
.titre-surtitre strong { font-weight: inherit; }
.titre-surtitre br { display: none; }
.bande--encre .titre-surtitre { color: var(--ciel); }
.accroche { margin: 0; font-family: var(--serif); font-size: clamp(30px, 3.6vw, 44px); font-weight: 500; line-height: 1.1; letter-spacing: -.012em; color: var(--encre); text-wrap: balance; }
.bande--encre .accroche { color: #fff; }
.chapo { font-size: clamp(17px, 1.6vw, 20px); line-height: 1.55; color: var(--encre); }
.tete-section { display: grid; gap: 14px; max-width: 760px; margin-bottom: 40px; }
.tete-section p { margin: 0; max-width: 64ch; }
.tete-section--centre { margin-inline: auto; text-align: center; justify-items: center; }
/* en ligne (pas en flex) : sur deux lignes, la flèche suit le dernier mot au lieu de se détacher à droite */
.lien-fleche { display: inline; font-weight: 600; color: var(--action); }
.lien-fleche svg { display: inline-block; width: 18px; height: 18px; margin-left: 6px; vertical-align: -4px; transition: transform .2s; }
.lien-fleche:hover { color: var(--action-survol); }
.lien-fleche:hover svg { transform: translateX(3px); }

/* ---------- Boutons ---------- */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 12px 20px; border: 1px solid var(--action); border-radius: var(--rayon-btn);
  background: var(--action); color: #fff; font-family: var(--sans); font-size: 15px; font-weight: 600; line-height: 20px; text-transform: none; white-space: nowrap;
  cursor: pointer; transition: background-color .2s, border-color .2s, color .2s; }
.btn:hover { border-color: var(--action-survol); background: var(--action-survol); color: #fff; }
.btn svg { width: 18px; height: 18px; }
.btn--clair, .btn--second { border-color: var(--encre); background: transparent; color: var(--encre); }
.btn--clair:hover, .btn--second:hover { border-color: var(--encre); background: var(--brume); color: var(--encre); }
.btn--blanc { border-color: #fff; background: #fff; color: var(--encre); }
.btn--blanc:hover { border-color: var(--brume); background: var(--brume); color: var(--encre); }
.btn--moyen { font-weight: 600; }
/* les anciennes couleurs de boutons deviennent toutes l'action */
.btn--orange, .btn--violet, .btn--bleu { border-color: var(--action); background: var(--action); }
.btn-cadre { align-self: flex-start; display: inline-flex; align-items: center; gap: 8px; padding: 8px 14px; border: 1px solid currentColor; border-radius: var(--rayon-btn);
  font-size: 14px; font-weight: 600; line-height: 20px; }
.btn-cadre svg { width: 8px; height: 14px; }

/* Vagues : supprimées par la charte (vague() ne rend plus rien), règle gardée pour un éventuel reste */
.vague { display: none; }

/* ========== En-tête ========== */
.entete { position: sticky; top: 0; z-index: 95; height: var(--entete); background: rgba(255, 255, 255, .97); border-bottom: 1px solid var(--trait);
  -webkit-backdrop-filter: saturate(1.4) blur(8px); backdrop-filter: saturate(1.4) blur(8px); }
.entete__barre { display: flex; align-items: center; gap: 28px; max-width: calc(1280px + 2 * var(--gouttiere)); height: 100%; margin-inline: auto; padding-inline: var(--gouttiere); }
.entete__logo { flex: none; display: flex; align-items: center; color: var(--encre); }
/* Logo de la V3 : « IA » en exposant au-dessus du nom ; le nom garde sa taille et reste centré dans la barre. */
.entete__logo svg { width: 144px; height: 43px; margin-top: -15px; }
.entete__droite { flex: 1; display: flex; align-items: center; justify-content: flex-end; gap: 16px; }
.entete__demo { padding: 10px 18px; }

.menu { display: flex; align-items: center; gap: 2px; margin-right: auto; }
/* titre = lien vers la page d'ensemble ; flèche = bouton qui ouvre le panneau (le survol aussi, sur ordinateur) */
.menu__tete { display: flex; align-items: center; border-radius: var(--rayon-btn); }
.menu__tete:hover, .menu__item.ouvert .menu__tete { background: var(--papier); }
.menu__titre { display: flex; align-items: center; padding: 10px 12px; font-family: var(--sans); font-size: 15px; font-weight: 500; line-height: 20px; color: var(--encre); white-space: nowrap; }
.menu__tete:has(.menu__ouvrir) .menu__titre { padding-right: 2px; }
.menu__titre:hover { color: var(--action); }
.menu__ouvrir { display: flex; align-items: center; padding: 10px 10px 10px 4px; border: 0; border-radius: var(--rayon-btn); background: none; color: var(--encre); cursor: pointer; }
.menu__ouvrir svg { width: 14px; height: 14px; transition: transform .2s; }
.menu__item.ouvert .menu__ouvrir svg { transform: rotate(180deg); }
.menu__panneau { position: fixed; left: 0; right: 0; top: var(--entete); display: none; z-index: 95; max-height: calc(100vh - var(--entete)); overflow-y: auto;
  background: var(--fond); border-bottom: 1px solid var(--trait); box-shadow: 0 24px 40px -24px rgba(0, 20, 64, .25); }
.menu__item.ouvert .menu__panneau { display: block; }
.menu__burger { display: none; padding: 6px; border: 0; background: none; color: var(--encre); cursor: pointer; }
.menu__burger svg { width: 28px; height: 28px; }

.panneau { display: grid; grid-template-columns: 260px minmax(0, 1fr); gap: 40px; max-width: calc(var(--conteneur) + 2 * var(--gouttiere)); margin-inline: auto; padding: 32px var(--gouttiere) 36px; }
.panneau__intro { display: flex; flex-direction: column; gap: 10px; }
.panneau-titre { font-family: var(--serif); font-size: 28px; font-weight: 500; line-height: 1.15; color: var(--encre); }
.panneau-texte { margin: 0; font-size: 15px; line-height: 1.55; color: var(--texte); }
.panneau__intro .lien-fleche { margin-top: 6px; font-size: 15px; }
.panneau__rangee + .panneau__rangee { margin-top: 20px; }
.panneau__libelle { margin: 0 0 10px; font-size: 12px; font-weight: 600; line-height: 16px; letter-spacing: .12em; text-transform: uppercase; color: var(--texte); }
.cartes-menu { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.carte-menu { display: grid; grid-template-columns: 28px minmax(0, 1fr); align-items: start; gap: 2px 14px; padding: 14px 16px; border: 1px solid var(--trait); border-radius: 10px;
  background: var(--fond); transition: border-color .2s, background-color .2s; }
.carte-menu:hover { border-color: var(--encre); }
.carte-menu > svg { grid-row: span 2; width: 26px; height: 26px; color: var(--encre); }
.carte-menu__titre { font-size: 15px; font-weight: 600; line-height: 20px; color: var(--encre); }
.carte-menu__desc { font-size: 13px; line-height: 18px; color: var(--texte); }
/* Fonctionnalités : trois familles, chacune avec son repère */
.familles { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px 32px; }
.famille__titre { display: flex; align-items: center; gap: 10px; margin: 0 0 8px; padding-bottom: 10px; border-bottom: 1px solid var(--trait);
  font-size: 12px; font-weight: 600; line-height: 16px; letter-spacing: .12em; text-transform: uppercase; color: var(--texte); }
.famille__titre i { width: 8px; height: 8px; border-radius: 2px; background: var(--c, var(--encre)); }
.lien-menu { display: flex; align-items: center; gap: 12px; padding: 9px 8px; margin-inline: -8px; border-radius: var(--rayon-btn); font-size: 15px; font-weight: 500; line-height: 20px; color: var(--encre); }
.lien-menu:hover { background: var(--papier); }
.lien-menu svg { flex: none; width: 22px; height: 22px; color: var(--encre); }
.lien-menu br { display: none; }
/* Ressources : colonnes de liens et encart e-book */
.colonnes-menu { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px 32px; }
.colonnes-menu ul { display: grid; gap: 2px; }
.colonnes-menu .lien-menu--sous { padding-left: 42px; font-size: 14px; color: var(--texte); }
.encart-menu { display: flex; flex-direction: column; justify-content: flex-end; gap: 10px; min-height: 190px; padding: 20px; border-radius: 10px;
  background: var(--encre) url("/medias/2025/06/imageenavant-1-300x291.webp") no-repeat right -10px bottom -16px / 120px auto; color: var(--ciel); }
.encart-menu .surtitre { color: var(--ciel); }
.encart-menu strong { max-width: 15ch; font-family: var(--serif); font-size: 22px; font-weight: 500; line-height: 1.2; color: #fff; }
.encart-menu .btn-cadre { color: #fff; }

/* ========== Pied de page ========== */
.demo { padding-block: clamp(56px, 7vw, 96px); background: var(--papier); border-top: 1px solid var(--trait); }
.demo__inner { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); align-items: start; gap: 40px 64px; }
.demo__textes { display: grid; gap: 18px; }
.demo__textes .titre-section br { display: none; }
.demo__liste { display: grid; gap: 12px; margin-top: 8px; }
.demo__liste li { display: flex; gap: 12px; color: var(--encre); }
.demo__liste svg { flex: none; width: 22px; height: 22px; color: var(--action); }
.demo__carte { padding: clamp(20px, 3vw, 32px); border: 1px solid var(--trait); border-radius: var(--rayon); background: var(--fond); box-shadow: var(--ombre-douce); }

.form-demo { display: grid; grid-template-columns: 1fr 1fr; gap: 16px 18px; }
.form-demo .champ { display: grid; gap: 6px; min-width: 0; }
.form-demo .champ--large { grid-column: 1 / -1; }
.form-demo label { font-size: 14px; font-weight: 600; line-height: 20px; color: var(--encre); }
.form-demo label small { font-weight: 400; color: var(--texte); }
.form-demo input, .form-demo textarea, .form-demo select { width: 100%; min-height: 44px; padding: 10px 14px; border: 1px solid var(--trait); border-radius: var(--rayon-btn);
  background: var(--fond); font-family: var(--sans); font-size: 15px; line-height: 20px; color: var(--encre); }
.form-demo input:focus, .form-demo textarea:focus, .form-demo select:focus { border-color: var(--action); outline: 2px solid var(--action); outline-offset: 1px; }
.form-demo textarea { min-height: 96px; resize: vertical; }
.form-demo ::placeholder { color: var(--texte); opacity: .75; }
.form-demo .envoi { grid-column: 1 / -1; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 24px; margin-top: 4px; }
.form-demo .envoi p { margin: 0; font-size: 13px; line-height: 1.5; }
.form-demo .envoi a { text-decoration: underline; text-underline-offset: 2px; }
.piege { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; overflow: hidden; }

.certifs { padding-block: 28px; border-top: 1px solid var(--trait); background: var(--fond); }
.certifs__inner { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px 40px; }
.certifs__texte { margin: 0; max-width: 46ch; font-size: 14px; line-height: 1.5; }
.certifs__texte strong { color: var(--encre); }
.certifs__liste { display: flex; flex-wrap: wrap; align-items: center; gap: 20px 32px; }
.certifs__liste img { width: auto; height: 64px; object-fit: contain; }

.pied__bas { padding-block: 64px 28px; background: var(--encre); color: var(--ciel); }
.pied__haut { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr); align-items: end; gap: 24px 64px; padding-bottom: 40px; border-bottom: 1px solid var(--filet-encre); }
.pied__marque { display: grid; gap: 16px; }
.pied__marque svg { width: 168px; height: 50px; color: #fff; }
.pied__marque p { margin: 0; max-width: 46ch; font-size: 15px; line-height: 1.6; }
.newsletter { display: grid; gap: 10px; }
.newsletter__titre { margin: 0; font-size: 15px; font-weight: 600; color: #fff; }
.newsletter__texte { margin: -4px 0 0; font-size: 14px; line-height: 1.5; color: var(--ciel); }
.form-capsule { display: flex; gap: 8px; }
.form-capsule input { flex: 1; min-width: 0; min-height: 46px; padding: 10px 14px; border: 1px solid var(--filet-encre); border-radius: var(--rayon-btn);
  background: rgba(255, 255, 255, .06); font-size: 15px; color: #fff; }
.form-capsule input::placeholder { color: var(--ciel); opacity: .8; }
.form-capsule input:focus { border-color: #fff; outline: 2px solid #fff; outline-offset: 1px; }
.form-capsule button { flex: none; padding: 10px 18px; border: 1px solid #fff; border-radius: var(--rayon-btn); background: #fff; color: var(--encre); cursor: pointer;
  font-size: 15px; font-weight: 600; line-height: 20px; }
.form-capsule button:hover { background: var(--brume); border-color: var(--brume); }
.liens-pied { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 32px 24px; padding-block: 40px; }
.liens-pied__col { display: flex; flex-direction: column; gap: 12px; min-width: 0; }
.liens-pied__titre { margin: 0; font-size: 13px; font-weight: 600; line-height: 16px; letter-spacing: .12em; text-transform: uppercase; color: #fff; }
.liens-pied ul { display: grid; gap: 8px; font-size: 15px; line-height: 1.4; }
.liens-pied ul + .liens-pied__titre { margin-top: 16px; }
.liens-pied a:hover { color: #fff; text-decoration: underline; text-underline-offset: 3px; }
.bas-de-page { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 32px; padding-top: 24px; border-top: 1px solid var(--filet-encre); font-size: 14px; }
.bas-de-page__liens { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 22px; }
.bas-de-page__liens a:hover { color: #fff; }
.bas-de-page__linkedin { display: inline-flex; align-items: center; gap: 8px; color: #fff; }
.bas-de-page__linkedin svg { width: 18px; height: 18px; }

/* ========== Blocs partagés ========== */
/* Prendre rendez-vous avec un expert */
.rdv { padding-block: 0; }
.rdv__capsule { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 20px 40px; padding: clamp(24px, 4vw, 40px) clamp(20px, 4vw, 48px);
  border-radius: var(--rayon); background: var(--encre); color: var(--ciel); }
.rdv__inner { padding-block: clamp(40px, 5vw, 64px); }
.rdv__titre { margin: 0; font-family: var(--serif); font-size: clamp(26px, 3vw, 34px); font-weight: 500; line-height: 1.15; color: #fff; }
.rdv__titre strong { font-weight: inherit; }
.rdv__sous { margin: 6px 0 0; font-size: 15px; }
.rdv form { display: flex; flex: 1 1 340px; gap: 8px; max-width: 460px; }
.rdv input { flex: 1; min-width: 0; min-height: 46px; padding: 10px 14px; border: 1px solid var(--filet-encre); border-radius: var(--rayon-btn); background: rgba(255, 255, 255, .06);
  font-size: 15px; color: #fff; }
.rdv input::placeholder { color: var(--ciel); opacity: .8; }
.rdv input:focus { border-color: #fff; outline: 2px solid #fff; outline-offset: 1px; }
.rdv button { flex: none; padding: 10px 18px; border: 1px solid #fff; border-radius: var(--rayon-btn); background: #fff; color: var(--encre); cursor: pointer; font-size: 15px; font-weight: 600; line-height: 20px; }
.rdv button:hover { background: var(--brume); border-color: var(--brume); }

/* Carrousel générique (défilement natif, flèches, lecture auto) */
.carrousel { position: relative; }
.carrousel__piste { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; scroll-behavior: smooth; scrollbar-width: none; }
.carrousel__piste::-webkit-scrollbar { display: none; }
.carrousel__piste > * { flex: 0 0 auto; scroll-snap-align: start; }
.carrousel__fleche { position: absolute; top: 50%; z-index: 2; display: grid; place-items: center; width: 44px; height: 44px; padding: 0; border: 1px solid var(--trait); border-radius: 50%;
  background: var(--fond); color: var(--encre); cursor: pointer; transform: translateY(-50%); box-shadow: var(--ombre-douce); }
.carrousel__fleche:hover { border-color: var(--encre); }
.carrousel__fleche svg { width: 20px; height: 20px; }
.carrousel__fleche--prec { left: -22px; }
.carrousel__fleche--suiv { right: -22px; }
.carrousel__fleche--suiv svg { transform: scaleX(-1); }

/* Logos clients, en monochrome */
.confiance { padding-block: 36px; background: var(--papier); border-block: 1px solid var(--trait); }
.confiance__texte { margin: 0 0 22px; font-size: 15px; font-weight: 500; line-height: 1.5; text-align: center; color: var(--texte); }
.confiance__badges { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px 36px; margin-top: 26px; padding-top: 22px; border-top: 1px solid var(--trait);
  font-size: 14px; font-weight: 600; line-height: 1.4; color: var(--encre); }
.confiance__badges li { display: flex; align-items: center; gap: 10px; }
.confiance__badges img { width: auto; height: 36px; object-fit: contain; }
/* logo Qualiopi : jamais sous 23 mm de large (≈ 87 px), mention de la catégorie d'actions lisible (charte de la marque) */
.confiance__badges img.badge-qualiopi, .certifs__liste img.badge-qualiopi { width: 120px; height: auto; }
.logos { display: grid; grid-template-columns: repeat(var(--n, 6), minmax(0, 1fr)); align-items: center; gap: 24px 36px; }
.logos li { display: flex; align-items: center; justify-content: center; height: 48px; }
.logos img { width: 100%; max-width: 132px; height: 40px; object-fit: contain; filter: grayscale(1) brightness(.35) contrast(1.2); mix-blend-mode: multiply; opacity: .75; }
/* les vingt références (logos_clients()) : cinq par ligne, quatre sur téléphone */
.logos--references { --n: 5; gap: 22px 40px; }
.carr-logos { padding-inline: 32px; }
.carr-logos .carrousel__piste { gap: 24px; }
.carr-logos .logo-client { display: flex; align-items: center; justify-content: center; width: 170px; height: 64px; }
.carr-logos .logo-client img { width: 140px; height: 44px; object-fit: contain; filter: grayscale(1) brightness(.35) contrast(1.2); mix-blend-mode: multiply; opacity: .75; }
.carr-logos .carrousel__fleche { width: 36px; height: 36px; box-shadow: none; }
.carr-logos .carrousel__fleche--prec { left: 0; }
.carr-logos .carrousel__fleche--suiv { right: 0; }

/* Témoignages : citations sur cartes, et cadres « à recueillir » en préprod */
.temoignages { padding-block: clamp(56px, 7vw, 96px); }
.temoignages__tete { display: flex; flex-wrap: wrap; align-items: end; justify-content: space-between; gap: 16px 40px; margin-bottom: 36px; }
.temoignages__tete .titre-section { max-width: 16ch; }
/* scroll-padding = le padding : sans lui, l'aimantation décale la piste de 2 px au chargement, et ce défilement arrête la
   mesure du LCP de Chrome (PageSpeed « NO_LCP » sur toutes les pages à témoignages, 05/11/2026) */
.carr-temoignages .carrousel__piste { gap: 24px; padding: 4px 2px 8px; scroll-padding-inline: 2px; }
.carr-temoignages .temoignage, .carr-temoignages .temoignage-attendu { width: calc((100% - 24px) / 2); }
.temoignage { display: flex; flex-direction: column; justify-content: space-between; gap: 24px; min-height: 100%; padding: clamp(22px, 3vw, 32px);
  border: 1px solid var(--trait); border-radius: var(--rayon); background: var(--fond); }
.temoignage__guillemet { font-family: var(--serif); font-size: 56px; line-height: .6; color: var(--action); }
.temoignage__texte { font-family: var(--serif); font-size: clamp(18px, 1.7vw, 21px); font-style: italic; line-height: 1.5; color: var(--encre); }
.temoignage__texte p { margin: 0 0 .7em; }
.temoignage__texte p:last-child { margin-bottom: 0; }
.temoignage__texte em, .temoignage__texte i { font-style: inherit; }
.temoignage__texte br:first-child { display: none; }
/* citation de la page (blocs/citation.php : fonctionnalités, « Pour qui », plateforme), photo du témoin s'il y en a une */
.citation-client { display: grid; gap: 14px; margin: 0; padding: 32px 36px; border-radius: var(--rayon); background: var(--encre); color: var(--ciel); }
.citation-client .temoignage__guillemet { color: var(--ciel); }
.citation-client__texte { margin: 0; }
.citation-client__texte p { margin: 0; font-family: var(--serif); font-size: 23px; font-style: italic; line-height: 1.45; color: #fff; }
.citation-client__auteur { display: flex; align-items: center; gap: 12px; font-size: 14px; }
.citation-client__auteur a { color: #fff; font-weight: 600; }
.citation-client__photo { flex: none; width: 48px; height: 48px; border-radius: 50%; object-fit: cover; }
.section--citation { padding-block: 0 clamp(48px, 6vw, 80px); }
.section--citation .citation-client { max-width: 920px; }
@media (max-width: 767px) {
  .citation-client { padding: 24px; }
  .citation-client__texte p { font-size: 19px; }
}
.temoignage__pied { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 20px; padding-top: 18px; border-top: 1px solid var(--trait); }
.temoignage__nom { font-size: 15px; font-weight: 600; line-height: 1.4; color: var(--encre); }
.temoignage__role { display: block; font-weight: 400; color: var(--texte); }
.temoignage__logo img { width: auto; max-width: 110px; height: 30px; object-fit: contain; filter: grayscale(1) brightness(.35); mix-blend-mode: multiply; opacity: .8; }
.temoignage__lien { font-size: 14px; }
.bouton-plus { display: inline-flex; align-items: center; gap: 6px; font-size: 14px; font-weight: 600; color: var(--action); }
.bouton-plus svg { width: 16px; height: 16px; }

.temoignage-attendu { position: relative; display: flex; flex-direction: column; gap: 14px; padding: clamp(22px, 3vw, 30px); border: 1.5px dashed var(--action); border-radius: var(--rayon);
  background: repeating-linear-gradient(135deg, rgba(0, 85, 209, .035) 0 12px, transparent 12px 24px), var(--fond); color: var(--texte); }
.temoignage-attendu__badge { align-self: flex-start; display: inline-flex; align-items: center; gap: 8px; padding: 4px 10px; border-radius: 4px; background: #FFF3D6; color: #7A4B00;
  font-size: 12px; font-weight: 600; line-height: 18px; letter-spacing: .06em; text-transform: uppercase; }
.temoignage-attendu__badge svg { width: 14px; height: 14px; }
/* marque d'aperçu (préprod, poste) sur une valeur à compléter ou à confirmer, une réponse à relire */
.marque-apercu { display: inline-block; flex: none; margin-top: 6px; padding: 1px 7px; border-radius: 4px; background: #FFF3D6; color: #7A4B00; font-family: var(--sans);
  font-size: 11px; font-style: normal; font-weight: 600; line-height: 16px; letter-spacing: .06em; text-transform: uppercase; white-space: nowrap; }
.temoignage-attendu__profil { margin: 0; font-size: 16px; font-weight: 600; line-height: 1.4; color: var(--encre); }
.temoignage-attendu__sujet { margin: 0; font-family: var(--serif); font-size: 19px; font-style: italic; line-height: 1.45; color: var(--encre); }
.temoignage-attendu__questions { display: grid; gap: 6px; padding-left: 18px; font-size: 14px; line-height: 1.5; list-style: disc; }
.temoignage-attendu__vide { display: grid; gap: 8px; margin-top: auto; padding-top: 14px; border-top: 1px dashed var(--ciel); font-size: 13px; }
.temoignage-attendu__vide span { display: flex; gap: 8px; }
.temoignage-attendu__vide span::after { content: ""; flex: 1; border-bottom: 1px dotted var(--ciel); transform: translateY(-4px); }
.temoignage-attendu__id { position: absolute; top: 12px; right: 14px; font-size: 11px; color: var(--ciel); }
.temoignage-attendu--seul { max-width: 760px; }
.carr-temoignages .temoignage-attendu { align-self: flex-start; }

/* Ressources (3 derniers articles) */
.ressources { padding-block: clamp(56px, 7vw, 96px); background: var(--papier); border-top: 1px solid var(--trait); }
.ressources__inner { display: grid; gap: 32px; }
.ressources__tete { display: flex; flex-wrap: wrap; align-items: end; justify-content: space-between; gap: 16px 40px; }
.ressources__titre { max-width: 18ch; font-family: var(--serif); font-size: clamp(30px, 3.6vw, 42px); font-weight: 500; line-height: 1.12; color: var(--encre); }
.grille-articles { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
.carte-article { position: relative; display: flex; flex-direction: column; overflow: hidden; border: 1px solid var(--trait); border-radius: var(--rayon); background: var(--fond);
  transition: border-color .2s; }
.carte-article:hover { border-color: var(--encre); }
.carte-article__image { aspect-ratio: 16 / 9; overflow: hidden; background: var(--brume); }
.carte-article__image img { width: 100%; height: 100%; object-fit: cover; }
.carte-article__titre { margin: 18px 22px 8px; font-family: var(--sans); font-size: 18px; font-weight: 600; line-height: 1.35; color: var(--encre); }
.carte-article__date { margin: auto 22px 20px; font-size: 14px; font-weight: 500; line-height: 20px; color: var(--texte); }
.carte-article__plus { display: none; }
.carte-article__lien::after { content: ""; position: absolute; inset: 0; }
.ressources__plus a { display: inline-flex; align-items: center; gap: 6px; font-size: 16px; font-weight: 600; color: var(--action); }
.ressources__plus svg { width: 18px; height: 18px; }

/* bloc « Pour qui » : selon la taille, selon les besoins */
.pour-qui__rangees { display: grid; gap: 28px; }
.pour-qui__rangee { display: grid; gap: 12px; }
.pour-qui__libelle { margin: 0; font-size: 14px; font-weight: 600; color: var(--encre); }
.cartes { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.cartes--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.cartes--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.carte { display: flex; flex-direction: column; gap: 10px; padding: 22px; border: 1px solid var(--trait); border-radius: var(--rayon); background: var(--fond); color: var(--texte);
  transition: border-color .2s; }
a.carte:hover { border-color: var(--encre); }
.carte > svg { width: 28px; height: 28px; color: var(--encre); }
.carte__titre { margin: 0; font-family: var(--sans); font-size: 17px; font-weight: 600; line-height: 1.35; color: var(--encre); }
.carte__texte { margin: 0; font-size: 15px; line-height: 1.55; }
.carte .lien-fleche { margin-top: auto; padding-top: 6px; font-size: 15px; }

/* Ce qu'Inedee apporte (blocs/apports.php) : cartes avec la citation d'un client, ou bande courte des pages produit */
.apport__citation { margin: 6px 0 0; padding-top: 14px; border-top: 1px solid var(--trait); }
.apport__citation blockquote { margin: 0; }
.apport__citation p { margin: 0; font-family: var(--serif); font-size: 16px; font-style: italic; line-height: 1.5; color: var(--encre); }
.apport__citation figcaption { margin-top: 8px; font-size: 13px; line-height: 1.4; }
.apport__citation figcaption a { font-weight: 600; color: var(--action); }
.apports__liste { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 28px 32px; margin: 0; padding: 0; list-style: none; }
.apports__liste li { display: grid; align-content: start; gap: 8px; }
.apports__liste svg { width: 26px; height: 26px; color: var(--encre); }
.apports__titre { margin: 0; font-family: var(--sans); font-size: 17px; font-weight: 600; line-height: 1.35; color: var(--encre); }
.apports__liste p { margin: 0; font-size: 15px; line-height: 1.55; }
.apports__liste--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.apports__autres { margin: 48px 0 20px; }
.apports__plus { margin: 28px 0 0; }

/* Chiffres sur bande encre */
.chiffres { padding-block: 52px; background: var(--encre); color: var(--ciel); }
.chiffres ul { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px; }
.chiffres li { padding-top: 16px; border-top: 1px solid var(--filet-encre); }
.chiffres b { display: block; font-family: var(--serif); font-size: clamp(36px, 4vw, 48px); font-weight: 500; line-height: 1; color: #fff; font-variant-numeric: lining-nums tabular-nums; white-space: nowrap; }
.chiffres small { font-family: var(--sans); font-size: 17px; font-weight: 400; color: var(--ciel); }
.chiffres span { display: block; margin-top: 10px; font-size: 15px; line-height: 1.45; }

/* bloc « En grande agence et en groupe » des pages solutions et fonctionnalités (contenu/grands-comptes.json) */
.grands-comptes { padding: 0; background: var(--fond); border-top: 1px solid var(--trait); }
.grands-comptes__inner { display: grid; gap: 28px; max-width: calc(var(--conteneur) + 2 * var(--gouttiere)); margin: 0 auto; padding: clamp(56px, 7vw, 88px) var(--gouttiere); }
.grands-comptes__tete { display: grid; gap: 12px; max-width: 820px; }
.grands-comptes__surtitre { font-size: 13px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--texte); }
.grands-comptes__titre { font-family: var(--serif); font-size: clamp(28px, 3.4vw, 40px); font-weight: 500; line-height: 1.15; color: var(--encre); }
.grands-comptes__intro { margin: 0; font-size: 17px; line-height: 1.6; color: var(--encre); }
.grands-comptes__points { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 48px; margin: 0; padding: 0; list-style: none; border-top: 1px solid var(--trait); }
.grands-comptes__points li { display: flex; align-items: flex-start; gap: 12px; padding-block: 14px; border-bottom: 1px solid var(--trait); font-size: 16px; line-height: 1.55; color: var(--encre); }
.grands-comptes__icone { flex: 0 0 20px; width: 20px; height: 20px; margin-top: 2px; fill: var(--action); }
.grands-comptes__liens { display: flex; flex-wrap: wrap; gap: 12px; }
.grands-comptes__liens .btn--clair { background: var(--fond); }

/* ========== Accueil ========== */
.hero { padding-block: clamp(40px, 6vw, 80px) clamp(48px, 6vw, 88px); }
.hero__inner { display: grid; grid-template-columns: minmax(0, .95fr) minmax(0, 1.05fr); align-items: start; gap: 56px; }
.hero__textes { display: grid; gap: 0; }
/* bandeau « L'IA au cœur d'Inedee » au-dessus du hero (blocs/ia-coeur.php) : encre, titre en gros, l'IA reliée aux écrans ;
   resserré le 29/10/2026 (PL : « très imposant ») pour que le titre du hero reste dans le premier écran, puis encore le même
   jour sans toucher à la taille du dessin (PL) : boîte du dessin cadrée sur lui, chaque diapositive au plus aussi haute que lui */
.ia-coeur { padding-block: clamp(20px, 2.2vw, 32px); background: var(--encre); color: var(--ciel); }
.ia-coeur__inner { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); align-items: center; gap: 20px 48px; }
.ia-coeur__textes { display: grid; justify-items: start; gap: 12px; }
.ia-coeur__badge { display: inline-flex; align-items: center; gap: 8px; padding: 6px 12px 6px 10px; border: 1px solid var(--filet-encre); border-radius: var(--rayon-btn);
  font-size: 14px; font-weight: 600; line-height: 1.3; color: #fff; }
.ia-coeur__badge .picto { width: 18px; height: 18px; }
.ia-coeur__titre { margin: 0; font-family: var(--serif); font-size: clamp(32px, 3.8vw, 52px); font-weight: 500; line-height: 1; letter-spacing: -.02em; color: #fff; text-wrap: balance; }
.ia-coeur__texte { max-width: 36em; margin: 0; font-size: 16px; line-height: 1.6; }
.ia-coeur .btn { gap: 8px; }
.ia-coeur .btn .picto { width: 18px; height: 18px; }
.ia-coeur__image { width: 100%; max-width: 400px; height: auto; justify-self: end; }
.ia-coeur__orbite { fill: none; stroke: var(--filet-encre); stroke-dasharray: 2 6; }
.ia-coeur__lien { stroke: rgba(175, 192, 222, .5); stroke-width: 1.5; stroke-dasharray: 3 7; animation: ia-coeur-flux 1.6s linear infinite; animation-delay: calc(var(--i) * -.2s); }
@keyframes ia-coeur-flux { to { stroke-dashoffset: -20; } }
.ia-coeur__module rect { fill: rgba(255, 255, 255, .06); stroke: rgba(175, 192, 222, .45); transition: fill .2s, stroke .2s; }
/* chaque case mène à sa fonctionnalité : au survol et au clavier, la case et son trait s'éclairent */
.ia-coeur__module:focus-visible { outline: none; }
.ia-coeur__module:hover rect, .ia-coeur__module:focus-visible rect { fill: rgba(255, 255, 255, .16); stroke: #fff; }
.ia-coeur__module:focus-visible rect { stroke-width: 2; }
.ia-coeur__branche:has(.ia-coeur__module:hover, .ia-coeur__module:focus-visible) .ia-coeur__lien { stroke: #fff; }
.ia-coeur__module text { font-family: var(--sans); font-size: 14px; font-weight: 500; fill: #fff; }
.ia-coeur__pastille { fill: #00205E; stroke: var(--ciel); stroke-width: 1.5; }
/* en carrousel (29/10/2026) : l'IA, EcoVadis, la facture électronique ; commandes sous les diapositives, sur l'encre */
.ia-coeur__diapo { display: flex; align-items: center; width: 100%; }
.ia-coeur__medaille { justify-self: center; width: 100%; max-width: 210px; }
/* EcoVadis : la médaille est étroite, le texte prend le reste et le titre tient sur une ligne */
.ia-coeur__diapo--medaille .ia-coeur__inner { grid-template-columns: minmax(0, 1fr) auto; }
.ia-coeur__diapo--medaille .ia-coeur__medaille { width: 210px; }
.ia-coeur__citation { justify-self: end; display: grid; gap: 10px; width: 100%; max-width: 520px; margin: 0; padding: clamp(18px, 2vw, 24px);
  border: 1px solid var(--filet-encre); border-radius: var(--rayon); background: rgba(255, 255, 255, .05); }
.ia-coeur__guillemet { font-family: var(--serif); font-size: 48px; line-height: .5; color: var(--ciel); }
.ia-coeur__citation blockquote { margin: 0; }
.ia-coeur__citation blockquote p { margin: 0; font-family: var(--serif); font-size: clamp(17px, 1.5vw, 21px); font-style: italic; line-height: 1.4; color: #fff; }
.ia-coeur__citation figcaption { display: grid; gap: 2px; padding-top: 12px; border-top: 1px solid var(--filet-encre); font-size: 14px; line-height: 1.45; color: var(--ciel); }
.ia-coeur__citation strong { font-size: 15px; font-weight: 600; color: #fff; }
.ia-coeur__commandes { display: flex; align-items: center; gap: 10px; margin-top: 12px; }
.ia-coeur .carrousel__fleche { position: static; width: 36px; height: 36px; border-color: var(--filet-encre); background: transparent; color: #fff; box-shadow: none; transform: none; }
.ia-coeur .carrousel__fleche:hover { border-color: #fff; }
.ia-coeur .carrousel__fleche svg { width: 16px; height: 16px; }
.ia-coeur .carrousel__fleche--suiv svg { transform: scaleX(-1); }
.carrousel__points { display: flex; gap: 6px; }
.carrousel__point { position: relative; width: 32px; height: 28px; padding: 0; border: 0; background: none; cursor: pointer; }
.carrousel__point::before { content: ""; position: absolute; inset: 12px 0; border-radius: 2px; background: rgba(175, 192, 222, .35); transition: background-color .2s; }
.carrousel__point:hover::before { background: var(--ciel); }
.carrousel__point[aria-current]::before { background: #fff; }
.carrousel__pause { display: grid; place-items: center; width: 36px; height: 36px; margin-left: 6px; padding: 0; border: 1px solid var(--filet-encre); border-radius: 50%;
  background: transparent; color: #fff; cursor: pointer; }
.carrousel__pause:hover { border-color: #fff; }
.carrousel__pause svg { width: 14px; height: 14px; }
.carrousel__pause-lecture, .carrousel__pause[aria-pressed="true"] .carrousel__pause-barres { display: none; }
.carrousel__pause[aria-pressed="true"] .carrousel__pause-lecture { display: inline; }
.hero__surtitre { margin-bottom: 18px; font-family: var(--sans); font-size: 13px; font-weight: 600; line-height: 16px; letter-spacing: .12em; text-transform: uppercase; color: var(--texte); }
.hero__titre { font-family: var(--serif); font-size: clamp(38px, 5vw, 60px); font-weight: 500; line-height: 1.05; letter-spacing: -.015em; color: var(--encre); }
.hero__titre br { display: none; }
.hero__texte { margin: 22px 0 0; font-size: 16px; line-height: 1.6; color: var(--texte); }
.hero__boutons { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 28px; }
.hero__ecran { justify-self: end; width: 100%; max-width: 540px; margin: 0; overflow: hidden; border: 1px solid var(--trait); border-radius: var(--rayon); background: var(--fond); box-shadow: var(--ombre); }
.hero__barre { display: flex; align-items: center; gap: 6px; padding: 10px 14px; border-bottom: 1px solid var(--trait); background: var(--papier); }
.hero__barre i { width: 9px; height: 9px; border-radius: 50%; background: var(--trait); }
.hero__ecran video { width: 100%; aspect-ratio: 3 / 2; object-fit: contain; background: var(--papier); }
.hero__ecran figcaption { padding: 9px 14px; border-top: 1px solid var(--trait); background: var(--papier); font-size: 13px; line-height: 18px; }
/* chiffres clés sous les boutons (contenu/chiffres.json, liste « hero ») */
.hero__chiffres { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 20px; margin-top: 36px; }
.hero__chiffres li { padding-top: 14px; border-top: 1px solid var(--trait); }
.hero__chiffres b { display: block; font-family: var(--serif); font-size: clamp(24px, 2.2vw, 30px); font-weight: 500; line-height: 1.05; color: var(--encre);
  font-variant-numeric: lining-nums tabular-nums; white-space: nowrap; }
.hero__chiffres small { font-family: var(--sans); font-size: 14px; font-weight: 400; color: var(--texte); }
.hero__chiffres span { display: block; margin-top: 6px; font-size: 14px; line-height: 1.4; color: var(--texte); }

.solutions { padding-block: clamp(56px, 7vw, 96px); }
.solutions__inner { display: grid; gap: clamp(56px, 7vw, 96px); }
.solution { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: center; gap: 40px 72px; }
.solution--inverse .solution__textes { order: 2; }
.solution__textes { display: grid; gap: 14px; }
.solution__repere { display: flex; align-items: center; gap: 10px; }
.solution__repere i { width: 10px; height: 10px; border-radius: 2px; background: var(--c, var(--encre)); }
.solution__titre { font-family: var(--serif); font-size: clamp(30px, 3.4vw, 40px); font-weight: 500; line-height: 1.12; color: var(--encre); }
.solution__titre strong { font-weight: inherit; }
.solution__accroche { font-size: clamp(28px, 3.2vw, 38px); }
.solution__texte { font-size: 17px; line-height: 1.6; color: var(--encre); }
.solution__texte p { margin: 0; }
.liste-coches { display: grid; gap: 8px; }
.liste-coches li { display: flex; align-items: flex-start; gap: 10px; font-size: 16px; line-height: 1.5; color: var(--encre); }
.liste-coches svg { flex: none; width: 20px; height: 20px; margin-top: 1px; color: var(--action); }
.solution__bouton { margin-top: 8px; }
.solution__media { overflow: hidden; border: 1px solid var(--trait); border-radius: var(--rayon); background: var(--papier); box-shadow: var(--ombre-douce); }
.solution__media video { width: 100%; aspect-ratio: 3 / 2; object-fit: contain; }
.coul-orange { --c: var(--logo-orange); }
.coul-violet { --c: var(--logo-violet); }
.coul-bleu { --c: var(--logo-bleu); }
.coul-rose { --c: var(--logo-rose); }

.top10 { padding-block: clamp(56px, 7vw, 96px); background: var(--papier); border-block: 1px solid var(--trait); }
.top10__tete { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 20px 48px; margin-bottom: 40px; }
.top10__tete .tete-section { margin-bottom: 0; }
.top10__familles { display: flex; flex-wrap: wrap; gap: 8px 24px; padding-bottom: 4px; font-size: 14px; font-weight: 600; color: var(--encre); }
.top10__familles li { display: flex; align-items: center; gap: 8px; }
.top10__familles i { width: 8px; height: 8px; border-radius: 2px; background: var(--c); }
.top10__grille { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 12px; }
.fonction { display: flex; flex-direction: column; gap: 8px; padding: 20px 18px 18px; border: 1px solid var(--trait); border-radius: var(--rayon); background: var(--fond); transition: border-color .2s, box-shadow .2s; }
.fonction:hover { border-color: var(--encre); box-shadow: var(--ombre-douce); }
.fonction__icone { display: flex; align-items: center; justify-content: space-between; margin-bottom: 14px; color: var(--encre); }
.fonction__icone svg { width: 26px; height: 26px; }
.fonction__icone i { width: 8px; height: 8px; border-radius: 2px; background: var(--c, var(--encre)); }
.fonction__titre { font-family: var(--sans); font-size: 16px; font-weight: 600; line-height: 1.3; color: var(--encre); }
.fonction__texte { margin: 0; font-size: 14px; line-height: 1.5; color: var(--texte); }
.fonction__lien { display: inline-flex; align-items: center; gap: 6px; margin-top: auto; padding-top: 10px; font-size: 14px; font-weight: 600; color: var(--action); }
.fonction__lien svg { width: 16px; height: 16px; transition: transform .2s; }
.fonction:hover .fonction__lien svg { transform: translateX(3px); }
.top10__pied { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 32px; margin-top: 28px; }

/* section « Inedee V3 » (#v3) : en-tête et écran de la V3, puis interface, IA et au-delà du produit en colonnes ; retirée de l'accueil
   le 29/10/2026 (PL), bloc rangé dans redaction/pages-retirees/ia-v3.php : règles gardées pour la remettre */
.v3__tete { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: center; gap: 40px 72px; }
.v3 .tete-section { margin-bottom: 0; }
.v3 .tete-section p { font-size: 18px; line-height: 1.6; }
.v3 .tete-section .accroche { font-size: clamp(34px, 4.2vw, 52px); line-height: 1.08; }
.v3__colonnes { display: grid; grid-template-columns: repeat(var(--n, 3), minmax(0, 1fr)); gap: 32px 40px; margin-top: clamp(40px, 5vw, 64px); }
.v3__colonne { display: flex; flex-direction: column; align-items: flex-start; }
.v3__colonne h3 { display: flex; align-items: center; gap: 10px; margin-bottom: 6px; font-size: 18px; line-height: 1.35; }
.v3__colonne h3 svg { flex: none; width: 24px; height: 24px; }
.v3__colonne .marque-apercu { margin: 0 0 8px; }
.v3__colonne ul { align-self: stretch; display: grid; }
.v3__colonne li { padding-block: 12px; border-top: 1px solid var(--filet-encre); font-size: 15px; line-height: 1.55; }
.v3__colonne li strong { font-weight: 600; color: #fff; }
.v3__garantie { display: flex; align-items: flex-start; gap: 10px; margin: 8px 0 0; padding-top: 14px; border-top: 1px solid var(--filet-encre); font-size: 15px; font-weight: 500; line-height: 1.5; color: #fff; }
.v3__garantie svg { flex: none; width: 20px; height: 20px; margin-top: 1px; }
.v3__boutons { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 36px; }
.v3 .btn--clair { border-color: var(--ciel); color: #fff; }
.v3 .btn--clair:hover { border-color: #fff; background: rgba(255, 255, 255, .08); color: #fff; }
.v3__ecran { justify-self: stretch; max-width: none; border-color: transparent; }
.v3__ecran figcaption { padding: 9px 14px; border-top: 1px solid var(--trait); background: var(--papier); font-size: 13px; line-height: 18px; color: var(--texte); }

/* gros plans d'interface (blocs/gros-plan-*.php) : un morceau d'écran de la V3 reproduit en HTML, lisible à toute taille.
   site.js ajoute .gros-plan--attente puis .gros-plan--vu à l'arrivée dans l'écran : lignes [data-etape] l'une après l'autre (--e) */
.gp { padding: 18px 20px 16px; background: var(--fond); color: var(--texte); font-size: 14px; line-height: 1.45; text-align: left; }
.gp__tete, .gp__outils { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.gp__tete { margin-bottom: 12px; }
.gp__titre { margin: 0 auto 0 0; font-size: 17px; font-weight: 600; color: var(--encre); }
.gp__puce, .gp__bouton { padding: 3px 9px; border: 1px solid var(--trait); border-radius: var(--rayon-btn); background: var(--papier); font-size: 12px; line-height: 18px; color: var(--encre); white-space: nowrap; }
.gp__bouton { background: var(--fond); font-weight: 600; }
.gp__puce--actif { border-color: #BFD3F2; background: #EAF1FC; color: var(--action); }
.gp__outils { margin-bottom: 10px; }
.gros-plan { container-type: inline-size; }
.gp-table { width: 100%; border-collapse: collapse; }
.gp-table th, .gp-table td { padding: 8px 6px; border-top: 1px solid var(--brume); text-align: right; white-space: nowrap; }
.gp-table th:first-child { padding-left: 0; text-align: left; white-space: normal; }
.gp-table thead th { border-top: 0; padding-block: 4px 6px; font-size: 12px; font-weight: 600; color: var(--texte); white-space: normal; vertical-align: bottom; }
.gp-groupe th, .gp-groupe td { font-weight: 600; color: var(--encre); }
.gp-niveau th { padding-left: 14px !important; font-weight: 400; }
.gp-niveau th::before { content: "› "; color: var(--trait); }
.gp-table tfoot th, .gp-table tfoot td { border-top: 2px solid var(--encre); font-weight: 600; color: var(--encre); }
.gp-mb { min-width: 108px; }
.gp-taux { display: flex; align-items: center; justify-content: flex-end; gap: 6px; margin-top: 3px; font-size: 12px; font-weight: 400; color: var(--texte); font-variant-numeric: normal; }
.gp-taux i { width: 44px; height: 4px; border-radius: 2px; background: linear-gradient(to right, var(--action) var(--p), var(--brume) var(--p)); transform-origin: left; }
.gros-plan--attente [data-etape] { opacity: 0; transform: translateY(6px); transition: opacity .45s, transform .45s; transition-delay: calc(var(--e, 0) * .18s + .2s); }
.gros-plan--attente .gp-taux i { transform: scaleX(0); transition: transform .9s .5s; }
.gros-plan--vu [data-etape] { opacity: 1; transform: none; }
.gros-plan--vu .gp-taux i { transform: none; }
/* cadre de l'ERP autour des gros plans (gp_cadre_debut()) : barre du haut et rail de menu dans le bleu du menu de la V3 */
.gp-erp__barre { display: flex; align-items: flex-end; gap: 2px; height: 40px; padding: 0 12px; overflow: hidden; background: #131340; color: #fff; }
.gp-erp__logo { align-self: center; display: flex; align-items: center; gap: 6px; margin-right: 14px; }
.gp-erp__logo svg { width: 62px; height: 19px; color: #fff; }
.gp-erp__logo b { font-size: 11px; font-weight: 600; line-height: 1; color: #C9CCE6; }
.gp-erp__onglet { flex: none; padding: 6px 12px 7px; border-radius: 6px 6px 0 0; font-size: 12px; line-height: 16px; color: #C9CCE6; white-space: nowrap; }
.gp-erp__onglet--actif { flex: 0 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; background: var(--fond); font-weight: 600; color: #131340; }
.gp-erp { display: grid; grid-template-columns: 36px minmax(0, 1fr); }
.gp-erp__rail { display: flex; flex-direction: column; align-items: center; gap: 16px; padding: 16px 0; background: #131340; color: #AFB3D6; }
.gp-erp__rail svg { width: 17px; height: 17px; }
.v3__ecran { border-color: rgba(255, 255, 255, .18); }

/* gros plans génériques (blocs/gros-plan.php, contenu/gros-plans/*.json) : tableau, fiche, planning */
.gros-plan figcaption { padding: 9px 14px; border-top: 1px solid var(--trait); background: var(--papier); font-size: 13px; line-height: 18px; color: var(--texte); }
.gp__action { padding: 3px 10px; border-radius: var(--rayon-btn); background: var(--action); color: #fff; font-size: 12px; font-weight: 600; line-height: 18px; white-space: nowrap; }
.gp__titre .gp-badge { margin-left: 6px; vertical-align: 2px; }
.gp__puces { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 10px; }
.gp__onglets { display: flex; flex-wrap: wrap; gap: 0 16px; margin-bottom: 6px; border-bottom: 1px solid var(--brume); font-size: 12.5px; }
.gp__onglet { display: inline-flex; align-items: center; gap: 5px; padding: 4px 0 6px; border-bottom: 2px solid transparent; margin-bottom: -1px; white-space: nowrap; }
.gp__onglet b { padding: 0 6px; border-radius: 8px; background: var(--brume); font-size: 11px; font-weight: 600; line-height: 16px; color: var(--encre); }
.gp__onglet--actif { border-bottom-color: var(--action); font-weight: 600; color: var(--encre); }
.gp__onglet--actif b { background: var(--action); color: #fff; }
.gp--tableau .gp-table th, .gp--tableau .gp-table td, .gp--fiche .gp-table th, .gp--fiche .gp-table td { text-align: left; }
.gp-table td:first-child { padding-left: 0; }
.gp-table .n { text-align: right !important; }
.gp-table .texte { white-space: normal; }
.gp-table td small { display: block; font-size: 12px; font-weight: 400; color: var(--texte); }
.gp-badge { display: inline-block; padding: 2px 8px; border-radius: var(--rayon-btn); font-size: 12px; font-weight: 600; line-height: 18px; white-space: nowrap; }
.gp-badge--bleu { background: #E6F0FB; color: #1F5FAD; }
.gp-badge--bleu-clair { background: #E3F4FB; color: #1A6E8E; }
.gp-badge--vert { background: #E4F4E6; color: #2D7A3A; }
.gp-badge--gris-vert { background: #E6EFEC; color: #4A6B60; }
.gp-badge--violet { background: #F0E8FB; color: #6B3FA0; }
.gp-badge--orange { background: #FDEEE2; color: #B4581B; }
.gp-badge--rose { background: #FBE6F1; color: #A3306B; }
.gp-badge--rouge { background: #FBE4E4; color: #B42318; }
.gp-badge--gris { background: #EEF0F4; color: var(--texte); }
.gp-avatar { display: inline-grid; place-items: center; flex: none; width: 24px; height: 24px; margin-right: 6px; border-radius: 50%; background: var(--encre); color: #fff;
  font-size: 10px; font-weight: 600; line-height: 1; vertical-align: middle; }
.gp-neg { color: #B42318; }
/* fiche de dossier : cartes en tête, bordure de la couleur de l'ERP */
.gp-cartes { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; margin-bottom: 12px; }
.gp-carte { padding: 8px 10px; border: 1px solid var(--trait); border-top: 3px solid var(--c, var(--trait)); border-radius: 8px; font-size: 12px; line-height: 1.45; }
.gp-carte--bleu { --c: #6FA3E0; } .gp-carte--jaune { --c: #E8C25A; } .gp-carte--rose { --c: #E58BB5; } .gp-carte--vert { --c: #7CC08A; }
.gp-carte p { margin: 0; }
.gp-carte__titre { font-weight: 600; color: var(--encre); }
.gp-carte__valeur { margin: 2px 0 4px !important; font-size: 14px; font-weight: 600; color: var(--encre); white-space: nowrap; }
.gp-carte__ligne { display: flex; justify-content: space-between; gap: 6px; white-space: nowrap; }
/* planning : une ligne par collaborateur, les affectations posées sur les jours */
.gp-planning { --qui: 132px; font-size: 12.5px; }
.gp-planning__tete, .gp-planning__jours, .gp-planning__ligne { display: grid; grid-template-columns: var(--qui) repeat(var(--jours), minmax(0, 1fr)); }
.gp-planning__tete { padding-bottom: 4px; font-weight: 600; color: var(--encre); }
.gp-planning__semaine { grid-column: 2 / -1; text-align: center; }
.gp-planning__jours { border-bottom: 1px solid var(--brume); }
.gp-planning__jours span { padding: 3px 0; text-align: center; color: var(--texte); }
.gp-planning__ligne { align-items: center; min-height: 54px; border-bottom: 1px solid var(--brume);
  background: repeating-linear-gradient(to right, transparent 0 calc((100% - var(--qui)) / var(--jours) - 1px), var(--brume) 0 calc((100% - var(--qui)) / var(--jours))) var(--qui) 0 / calc(100% - var(--qui)) 100% no-repeat; }
.gp-planning__qui { grid-column: 1; grid-row: 1; display: flex; align-items: center; margin: 0; }
.gp-planning__qui b { display: block; font-weight: 600; color: var(--encre); }
.gp-planning__qui small { display: block; font-size: 11.5px; line-height: 1.35; }
.gp-planning__taux { font-weight: 600; color: var(--encre); }
.gp-planning__bloc { grid-row: 1; margin: 0 2px; padding: 6px 5px; border-radius: var(--rayon-btn); font-size: 12px; font-weight: 600; line-height: 1.3; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
/* colonnes et cartes selon la largeur du cadre, pas de l'écran : un même gros plan sert dans un cadre de 820 px ou de 360 px */
@container (max-width: 619px) {
  .gp-table .moyen-non { display: none; }
  .gp-cartes { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@container (max-width: 439px) {
  .gp-erp { grid-template-columns: minmax(0, 1fr); }
  .gp-erp__rail, .gp-erp__onglet:not(.gp-erp__onglet--actif) { display: none; }
  .gp { padding: 14px 14px 12px; }
  .gp-table .tel-non, .gp-ce { display: none; }
  .gp-planning { --qui: 96px; }
  .gp-planning__qui .gp-avatar, .gp-planning__qui small:not(.gp-planning__taux) { display: none; }
  .gp-planning__bloc { margin: 0 1px; padding: 5px 4px; font-size: 11px; }
  .gp--tableau .gp-table, .gp--fiche .gp-table { font-size: 13px; }
}
/* panneau de l'assistant */
.gp-assistant { display: flex; flex-direction: column; gap: 12px; padding: 0; }
.gp-assistant__onglets { display: flex; gap: 4px; padding: 10px 14px; border-bottom: 1px solid var(--brume); font-size: 13px; font-weight: 600; color: var(--texte); }
.gp-assistant__onglets span { display: inline-flex; align-items: center; gap: 6px; padding: 4px 10px; border-radius: var(--rayon-btn); }
.gp-assistant__onglets .actif { background: #EAF1FC; color: var(--action); }
.gp-assistant__onglets svg { width: 16px; height: 16px; }
.gp-assistant__fil { display: grid; gap: 8px; padding: 4px 18px; font-size: 14.5px; }
.gp-assistant__fil p { margin: 0; }
.gp-attente { display: grid; gap: 4px; margin: 0; }
.gp-attente div { display: grid; grid-template-columns: 96px minmax(0, 1fr); gap: 10px; }
.gp-attente dt { font-weight: 600; color: var(--encre); }
.gp-attente dd { margin: 0; }
.gp-attente b { color: var(--encre); }
.gp-demande { justify-self: end; max-width: 85%; margin-top: 6px !important; padding: 8px 12px; border-radius: 10px 10px 2px 10px; background: var(--brume); color: var(--encre); }
.gp-assistant__saisie { display: grid; gap: 6px; padding: 12px 14px 14px; border-top: 1px solid var(--brume); }
.gp-contexte { font-size: 12px; }
.gp-champ { padding: 10px 12px; border: 1px solid var(--trait); border-radius: 10px; font-size: 13px; color: #8A93A6; }

.plateforme { padding-block: clamp(56px, 7vw, 96px); }
/* deux sections blanches qui se suivent : une seule marge entre elles (190 px de blanc sur l'accueil sinon) */
.plateforme + .temoignages { padding-top: 0; }
.temoignages + .rdv .rdv__inner { padding-top: 0; }

/* ========== Composants des pages (solutions, fonctionnalités, Pour qui, plateforme) ========== */
/* fil d'Ariane (blocs/fil-ariane.php), en tête des pages intérieures ; l'en-tête de page qui suit perd un peu de marge */
.ariane { padding-top: 20px; }
.ariane__liste { display: flex; flex-wrap: wrap; gap: 4px 0; margin: 0 auto; list-style: none; font-size: 13px; line-height: 18px; color: var(--texte); }
.ariane__liste li { display: flex; align-items: center; min-width: 0; }
.ariane__liste li + li::before { content: "›"; margin: 0 8px; color: var(--texte); }
.ariane__liste a { color: var(--action); text-decoration: none; }
.ariane__liste a:hover { text-decoration: underline; }
.ariane__liste [aria-current] { overflow: hidden; max-width: 60ch; text-overflow: ellipsis; white-space: nowrap; }
.ariane + .entree { padding-top: clamp(24px, 4vw, 56px); }
.entree { padding-block: clamp(40px, 6vw, 80px) clamp(48px, 6vw, 80px); }
.entree__inner { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); align-items: center; gap: 56px; }
.entree--seule .entree__inner { grid-template-columns: minmax(0, 860px); }
.entree__textes { display: grid; }
.entree__surtitre { margin: 0 0 18px; font-family: var(--sans); font-size: 13px; font-weight: 600; line-height: 16px; letter-spacing: .12em; text-transform: uppercase; color: var(--texte); }
.entree__titre { font-family: var(--serif); font-size: clamp(34px, 4.4vw, 54px); font-weight: 500; line-height: 1.08; letter-spacing: -.014em; color: var(--encre); }
.entree__titre strong { font-weight: inherit; }
.entree__titre br { display: none; }
.entree__texte { margin: 20px 0 0; font-size: clamp(16px, 1.5vw, 18px); line-height: 1.6; color: var(--encre); }
.entree__boutons { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 28px; }
.entree__maj { margin: 16px 0 0; font-size: 13px; color: var(--texte); }
.entree + .section { padding-top: 8px; }
.sans-coupure { white-space: nowrap; }
/* une carte seule dans sa rangée : pleine largeur, en ligne */
.cartes--1 { grid-template-columns: minmax(0, 1fr); }
.cartes--1 .carte { flex-flow: row wrap; align-items: center; column-gap: 18px; }
.cartes--1 .carte__texte { flex: 1 1 320px; }
.cartes--1 .carte .lien-fleche { margin: 0 0 0 auto; padding: 0; }
/* burger : croix quand le menu est ouvert */
.menu__burger .burger-fermer, .entete.menu-ouvert .menu__burger .burger-ouvrir { display: none; }
.entete.menu-ouvert .menu__burger .burger-fermer { display: block; }
.ecran { justify-self: end; width: 100%; max-width: 560px; margin: 0; overflow: hidden; border: 1px solid var(--trait); border-radius: var(--rayon); background: var(--fond); box-shadow: var(--ombre); }
.ecran__barre { display: flex; align-items: center; gap: 6px; padding: 10px 14px; border-bottom: 1px solid var(--trait); background: var(--papier); }
.ecran__barre i { width: 9px; height: 9px; border-radius: 50%; background: var(--trait); }
/* vidéos de l'ERP en 1:1, 7:4 ou 16:9 : cadre fixe en 3:2 (pas de saut de mise en page), vidéo entière, jamais rognée */
.ecran video, .ecran img { width: 100%; aspect-ratio: 3 / 2; object-fit: contain; background: var(--papier); }
.ecran--libre video, .ecran--libre img { aspect-ratio: auto; object-fit: contain; }

.section { padding-block: clamp(56px, 7vw, 96px); }
.section--papier { background: var(--papier); border-block: 1px solid var(--trait); }
.section--filet { border-top: 1px solid var(--trait); }
.deux-colonnes { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); align-items: start; gap: 40px 72px; }
.deux-colonnes--centre { align-items: center; }
.colle { position: sticky; top: calc(var(--entete) + 24px); display: grid; gap: 24px; }
.colle .ecran { justify-self: start; }
.colle .titre-section { font-size: clamp(28px, 3vw, 38px); }

.benefices { border-top: 1px solid var(--trait); }
.benefice { display: grid; grid-template-columns: 44px minmax(0, 1fr); gap: 4px 18px; padding-block: 20px; border-bottom: 1px solid var(--trait); }
.benefice__picto { grid-row: span 2; display: grid; place-items: center; width: 44px; height: 44px; border: 1px solid var(--trait); border-radius: 10px; color: var(--encre); }
.benefice__picto svg { width: 22px; height: 22px; }
.benefice__titre { margin: 0; font-size: 17px; font-weight: 600; line-height: 1.4; color: var(--encre); }
.benefice__texte { margin: 0; font-size: 15px; line-height: 1.6; }

.prose { color: var(--texte); }
.prose p { margin: 0 0 .8em; }
.prose p:last-child { margin-bottom: 0; }
.prose a { color: var(--action); text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 2px; }
.prose a:not([href]) { color: inherit; text-decoration: none; }
.prose ul, .prose ol { margin: 0 0 .8em; padding-left: 1.2em; list-style: disc; }
.prose ol { list-style: decimal; }
.prose li + li { margin-top: .3em; }
.prose strong { color: var(--encre); }

.accordeon { border-top: 1px solid var(--trait); }
.accordeon__item { border-bottom: 1px solid var(--trait); }
.accordeon__item > summary { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 18px 0; cursor: pointer; list-style: none; }
.accordeon__item > summary::-webkit-details-marker { display: none; }
.accordeon__item > summary h3 { margin: 0; font-size: 17px; font-weight: 600; line-height: 1.4; color: var(--encre); }
.accordeon__signe { position: relative; flex: none; width: 28px; height: 28px; border: 1px solid var(--trait); border-radius: 50%; }
.accordeon__signe::before, .accordeon__signe::after { content: ""; position: absolute; top: 50%; left: 50%; width: 11px; height: 1.5px; background: var(--encre); transform: translate(-50%, -50%); transition: transform .2s; }
.accordeon__signe::after { transform: translate(-50%, -50%) rotate(90deg); }
.accordeon__item[open] .accordeon__signe::after { transform: translate(-50%, -50%) rotate(0deg); }
.accordeon__item > summary:hover h3 { color: var(--action); }
.accordeon__corps { padding: 0 44px 20px 0; font-size: 15px; line-height: 1.65; }
/* FAQ de l'accueil : marques d'aperçu à la suite de la question, liens vers les pages détaillées sous la réponse */
.faq-accueil summary .marque-apercu { margin: 0 0 0 4px; vertical-align: 2px; }
.accordeon__corps .faq-accueil__liens { display: flex; flex-wrap: wrap; gap: 6px 22px; margin: 14px 0 0; padding: 0; list-style: none; }
.accordeon__corps .faq-accueil__liens li + li { margin-top: 0; }
.prose .faq-accueil__liens a { text-decoration: none; }

.questions-grille { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.question { display: grid; align-content: start; gap: 10px; padding: 24px; border: 1px solid var(--trait); border-radius: var(--rayon); background: var(--fond); }
.question__titre { margin: 0; font-size: 17px; font-weight: 600; line-height: 1.4; color: var(--encre); }
.question .prose { font-size: 15px; line-height: 1.6; }

.equipe-grille { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
.membre { display: flex; flex-direction: column; overflow: hidden; border: 1px solid var(--trait); border-radius: var(--rayon); background: var(--fond); }
.membre__picto { display: flex; padding: 22px 20px 0; color: var(--encre); }
.membre__picto svg { width: 28px; height: 28px; }
.membre__corps { display: grid; gap: 8px; padding: 14px 20px 22px; }
.membre__titre { margin: 0; font-size: 17px; font-weight: 600; line-height: 1.35; color: var(--encre); }
.membre__titre br { display: none; }
.membre .prose { font-size: 14px; line-height: 1.6; }

.outils { display: grid; grid-template-columns: repeat(8, minmax(0, 1fr)); align-items: center; gap: 20px 28px; padding: 28px; border: 1px solid var(--trait); border-radius: var(--rayon); background: var(--fond); }
.outils li { display: flex; align-items: center; justify-content: center; height: 40px; }
.outils img { width: 100%; max-width: 96px; height: 30px; object-fit: contain; filter: grayscale(1) brightness(.4); mix-blend-mode: multiply; opacity: .8; }
.outils img[src*="soldo"] { filter: grayscale(1) brightness(1.4) contrast(8); opacity: .7; }
/* logos officiels pris le 29/10/2026 : le nuage de Salesforce plus haut, le mot de Pleo, très gras, plus petit */
.outils img[src*="salesforce"] { height: 40px; }
.outils img[src*="pleo"] { height: 22px; }
.outils__plus { font-size: 14px; font-weight: 600; color: var(--texte); }
.outils__noms { margin: 14px 0 0; font-size: 13px; line-height: 1.6; color: var(--texte); }
/* logiciel sans logo fourni : son nom, dans le gris des logos */
.outils__nom { font-size: 19px; font-weight: 700; line-height: 1.1; letter-spacing: -.01em; text-align: center; color: #3A3F4A; opacity: .85; }
.modules { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 12px; margin-block: 8px 24px; }
.module { display: grid; grid-template-columns: 26px minmax(0, 1fr); gap: 4px 14px; padding: 16px 18px; border: 1px solid var(--trait); border-radius: 10px; background: var(--fond); }
.module > svg { grid-row: span 2; width: 24px; height: 24px; color: var(--encre); }
.module__titre { font-size: 15px; font-weight: 600; line-height: 1.35; color: var(--encre); }
.module__texte { margin: 0; font-size: 14px; line-height: 1.5; }

/* « Comment ça marche chez Inedee » (blocs/atouts.php) */
/* « En bref » et tableau des compléments GEO (blocs/en-bref.php, blocs/tableau-geo.php) */
.en-bref__definition { margin: 0 0 24px; font-size: clamp(17px, 1.6vw, 19px); line-height: 1.6; color: var(--encre); }
.en-bref__liste { display: grid; border-top: 1px solid var(--trait); }
.en-bref__liste li { display: grid; grid-template-columns: 24px minmax(0, 1fr); gap: 14px; padding-block: 14px; border-bottom: 1px solid var(--trait); }
.en-bref__liste svg { width: 22px; height: 22px; margin-top: 2px; color: var(--action); }
.en-bref__liste p { margin: 0; font-size: 15px; line-height: 1.6; }
.en-bref__liste strong { color: var(--encre); }
.tableau-geo { border-top: 1px solid var(--trait); }
.tableau-geo__defilant { overflow-x: auto; margin-top: 28px; border: 1px solid var(--trait); border-radius: 12px; }
.tableau-geo__tableau { width: 100%; min-width: 560px; border-collapse: collapse; font-size: 15px; line-height: 1.55; }
.tableau-geo__tableau th, .tableau-geo__tableau td { padding: 14px 18px; text-align: left; vertical-align: top; border-bottom: 1px solid var(--trait); }
.tableau-geo__tableau thead th { background: var(--papier); font-size: 13px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--texte); }
.tableau-geo__tableau tbody th { width: 26%; font-weight: 600; color: var(--encre); }
.tableau-geo__tableau tbody tr:last-child > * { border-bottom: 0; }
@media (max-width: 767px) {
  /* téléphone : chaque ligne devient un bloc (intitulé, puis texte), sans défilement horizontal */
  .tableau-geo__tableau { min-width: 0; }
  .tableau-geo__tableau thead { display: none; }
  .tableau-geo__tableau tr, .tableau-geo__tableau th, .tableau-geo__tableau td { display: block; }
  .tableau-geo__tableau tbody tr { border-bottom: 1px solid var(--trait); }
  .tableau-geo__tableau tbody tr:last-child { border-bottom: 0; }
  .tableau-geo__tableau tbody th { width: auto; padding-bottom: 2px; border-bottom: 0; }
  .tableau-geo__tableau tbody td { padding-top: 0; border-bottom: 0; }
}
.atouts { border-top: 1px solid var(--trait); }
.atouts__liste { display: grid; border-top: 1px solid var(--trait); }
.atouts__liste li { display: grid; grid-template-columns: 24px minmax(0, 1fr); gap: 14px; padding-block: 18px; border-bottom: 1px solid var(--trait); }
.atouts__liste svg { width: 22px; height: 22px; margin-top: 2px; color: var(--action); }
.atouts__liste h3 { margin: 0 0 4px; font-size: 17px; font-weight: 600; line-height: 1.4; color: var(--encre); }
.atouts__liste p { margin: 0; font-size: 15px; line-height: 1.6; }

.cartes-pourquoi { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin-block: 20px; }
.cartes-pourquoi .carte--large { grid-column: 1 / -1; }

/* accueil, « Mise en place » : étapes numérotées, puis cartes de l'équipe (aperçu tant que l'accord n'est pas donné) */
.mise-en-place .tete-section { margin-bottom: 0; }
.etapes { display: grid; border-top: 1px solid var(--trait); }
.etapes li { display: grid; grid-template-columns: 34px minmax(0, 1fr); gap: 16px; padding-block: 20px; border-bottom: 1px solid var(--trait); }
.etapes__num { display: flex; align-items: center; justify-content: center; width: 34px; height: 34px; border: 1px solid var(--encre); border-radius: var(--rayon-btn);
  font-family: var(--serif); font-size: 18px; line-height: 1; color: var(--encre); }
.etapes h3 { margin: 4px 0 4px; font-size: 17px; line-height: 1.4; }
.etapes p { margin: 0; font-size: 15px; line-height: 1.6; }

/* accueil, citation d'un client sous les logos (extrait exact d'un témoignage publié) */
.citation-une { max-width: 880px; margin: 34px auto 0; text-align: center; }
.citation-une blockquote { margin: 0; }
.citation-une p { margin: 0; font-family: var(--serif); font-size: clamp(22px, 2.4vw, 30px); font-style: italic; line-height: 1.35; color: var(--encre); text-wrap: balance; }
.citation-une p::before { content: "«\00a0"; }
.citation-une p::after { content: "\00a0»"; }
.citation-une figcaption { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 8px 18px; margin-top: 18px; font-size: 14px; line-height: 1.5; color: var(--texte); }
.citation-une img { width: auto; height: 26px; object-fit: contain; filter: grayscale(1) brightness(.35); mix-blend-mode: multiply; opacity: .8; }
.citation-une strong { font-weight: 600; color: var(--encre); }
.citation-une .lien-fleche { font-size: 14px; }

/* accueil, parcours d'un dossier dans le hero (blocs/parcours-dossier.php, 29/10/2026) : titre et dossier suivi, frise des six
   étapes, phrase et gros plan de l'étape ; en onglets (site.js), les écrans s'empilent dans la même case : pas de saut de hauteur */
.parcours { display: grid; gap: 18px; min-width: 0; }
.parcours__tete { display: grid; gap: 6px; }
.parcours__titre { margin: 0; font-family: var(--sans); font-size: 16px; font-weight: 600; line-height: 1.4; color: var(--encre); }
.parcours__titre strong { font-weight: inherit; }
.parcours__titre br { display: none; }
.parcours__dossier { display: flex; align-items: center; gap: 8px; margin: 0; font-size: 14px; font-weight: 500; line-height: 1.4; color: var(--texte); }
.parcours__dossier .picto { width: 18px; height: 18px; flex: none; color: var(--encre); }
.parcours__etapes { position: relative; display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); margin: 0; padding: 0; list-style: none; }
/* trait de la frise, d'un numéro à l'autre */
.parcours__etapes::before { content: ""; position: absolute; top: 15px; left: calc(100% / 12); right: calc(100% / 12); height: 1px; background: var(--trait); }
.parcours__etape { position: relative; display: grid; justify-items: center; gap: 6px; width: 100%; padding: 0 2px; border: 0; background: none; color: var(--texte);
  font: inherit; text-align: center; cursor: pointer; }
.parcours__etape:focus-visible { outline: none; }
.parcours__etape:focus-visible .parcours__num { outline: 2px solid var(--action); outline-offset: 2px; }
.parcours__num { display: grid; place-items: center; width: 30px; height: 30px; border: 1px solid var(--trait); border-radius: var(--rayon-btn); background: var(--fond);
  font-size: 14px; font-weight: 600; line-height: 1; color: var(--encre); transition: background-color .2s, border-color .2s, color .2s; }
.parcours__etape:hover .parcours__num { border-color: var(--encre); }
.parcours__etape strong { font-size: 13px; font-weight: 600; line-height: 1.3; color: var(--texte); transition: color .2s; }
.parcours__etape:hover strong, .parcours__etape[aria-selected="true"] strong { color: var(--encre); }
.parcours__etape[aria-selected="true"] .parcours__num { border-color: var(--encre); background: var(--encre); color: #fff; }
.parcours__ecrans { display: grid; gap: 24px; }
.parcours--onglets .parcours__ecran { grid-area: 1 / 1; }
.parcours--onglets .parcours__ecran[hidden] { display: block; visibility: hidden; }
.parcours__ecran:not([hidden]) { animation: parcours-entree .35s ease both; }
@keyframes parcours-entree { from { opacity: 0; transform: translateY(8px); } }
.parcours__legende { margin: 0 0 12px; font-size: 15px; line-height: 1.55; color: var(--texte); }
.parcours__legende strong { font-weight: 600; color: var(--encre); }
.parcours--onglets .parcours__legende { display: none; }
.parcours__cadre { justify-self: stretch; max-width: none; }
/* lignes du dossier suivi, surlignées dans chaque gros plan */
.gp-table tr.gp-surligne td { background: #FFF5D6; }
.gp-table tr.gp-surligne td:first-child { padding-left: 8px; box-shadow: inset 3px 0 0 #E8B931; }
.gp-planning__bloc.gp-surligne { outline: 2px solid #E8B931; outline-offset: 1px; }
.gp-planning__bloc.gp-estompe { opacity: .35; }
@media (max-width: 1024px) {
  .entree__inner, .deux-colonnes { grid-template-columns: 1fr; gap: 32px; }
  .ecran { justify-self: start; max-width: 640px; }
  .colle { position: static; }
  .questions-grille { grid-template-columns: 1fr 1fr; }
  .equipe-grille { grid-template-columns: 1fr 1fr; }
  .outils { grid-template-columns: repeat(5, minmax(0, 1fr)); }
}
@media (max-width: 767px) {
  .questions-grille, .equipe-grille, .cartes-pourquoi { grid-template-columns: 1fr; }
  .outils { grid-template-columns: repeat(3, minmax(0, 1fr)); padding: 20px; }
  .accordeon__corps { padding-right: 0; }
}

/* ========== Recherche (29/10/2026) : loupe du menu après Contact, qui mène à la page /recherche/ ========== */
.menu__recherche { gap: 8px; }
.menu__recherche .picto { width: 20px; height: 20px; }
/* sur ordinateur, la loupe seule (le mot reste lu par les lecteurs d'écran) ; dans le menu du téléphone, la loupe et le mot */
.menu__recherche-texte { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
/* de 1025 à 1200 px, le menu se resserre pour que la loupe et « Demande de démo » tiennent sur la ligne */
@media (min-width: 1025px) and (max-width: 1200px) {
  .entete__barre { gap: 18px; }
  .entete__droite { gap: 12px; }
  .menu__titre { padding-inline: 8px; }
  .menu__tete:has(.menu__ouvrir) .menu__titre { padding-right: 0; }
  .menu__ouvrir { padding-right: 6px; }
  .entete__demo { padding-inline: 14px; }
}
.recherche-page__titre { margin: 12px 0 24px; font-size: clamp(36px, 4.5vw, 52px); line-height: 1.05; color: var(--encre); }
.recherche__form { display: flex; align-items: center; gap: 12px; max-width: 760px; padding: 6px 6px 6px 16px; border: 1px solid var(--trait); border-radius: var(--rayon); }
.recherche__form:focus-within { border-color: var(--encre); }
.recherche__form > .picto { flex: none; width: 22px; height: 22px; color: var(--encre); }
.recherche__form input { flex: 1; min-width: 0; padding: 8px 0; border: 0; background: none; font-size: 18px; line-height: 1.3; color: var(--encre); outline: none; }
.recherche__form input::placeholder { color: #7A8396; }
.recherche__etat { margin: 0; padding-top: 20px; font-size: 15px; line-height: 1.5; color: var(--texte); }
.recherche__resultats { max-width: 760px; margin-top: 12px; border-top: 1px solid var(--trait); }
.recherche__resultats li { border-bottom: 1px solid var(--trait); }
.recherche__resultat { display: grid; gap: 2px; padding: 16px 4px; color: var(--texte); }
.recherche__resultat:hover, .recherche__resultat:focus-visible { background: var(--papier); outline: none; }
.recherche__resultat:focus-visible { box-shadow: inset 0 0 0 2px var(--action); }
.recherche__resultat strong { font-size: 17px; font-weight: 600; line-height: 1.35; color: var(--encre); }
.recherche__type { font-size: 11px; font-weight: 600; line-height: 16px; letter-spacing: .08em; text-transform: uppercase; color: var(--texte); }
.recherche__texte { display: -webkit-box; overflow: hidden; font-size: 14px; line-height: 1.45; -webkit-box-orient: vertical; -webkit-line-clamp: 2; line-clamp: 2; }
.recherche__suggestions { padding-top: 24px; }
.recherche__suggestions p { margin: 0 0 10px; font-size: 13px; color: var(--texte); }
.recherche__suggestions ul { display: flex; flex-wrap: wrap; gap: 8px; }
.recherche__suggestions a { display: inline-block; padding: 6px 12px; border: 1px solid var(--trait); border-radius: var(--rayon-btn); font-size: 14px; font-weight: 600; line-height: 20px; color: var(--encre); }
.recherche__suggestions a:hover { border-color: var(--encre); }

/* ========== Page en préparation (copie en cours) ========== */
.a-faire { max-width: 800px; margin: 80px auto; padding: 0 20px; color: var(--encre); }

/* ========== Tablette (≤ 1024 px) ========== */
@media (max-width: 1024px) {
  :root { --gouttiere: 20px; }
  .menu__burger { display: block; }
  .entete__droite { gap: 8px; }
  .menu { position: absolute; top: var(--entete); left: 0; right: 0; display: none; flex-direction: column; align-items: stretch; gap: 0; margin: 0;
    max-height: calc(100vh - var(--entete)); overflow-y: auto; padding: 8px var(--gouttiere) 24px; background: var(--fond); border-bottom: 1px solid var(--trait); box-shadow: var(--ombre); }
  .entete.menu-ouvert .menu { display: flex; }
  /* voile sous le menu ouvert ; l'en-tête (backdrop-filter) contient ses enfants fixes, d'où un absolu haut de 100vh */
  .entete.menu-ouvert::after { content: ""; position: absolute; top: 100%; left: 0; right: 0; z-index: -1; height: 100vh; background: rgba(0, 20, 64, .45); }
  .menu__item { border-bottom: 1px solid var(--trait); }
  .menu__tete:hover, .menu__item.ouvert .menu__tete { background: none; }
  .menu__titre { flex: 1; padding: 14px 4px; font-size: 16px; }
  .menu__ouvrir { padding: 14px 8px; }
  .menu__ouvrir svg { width: 18px; height: 18px; }
  .menu__recherche-texte { position: static; width: auto; height: auto; overflow: visible; clip-path: none; }
  .menu__item--recherche { border-bottom: 0; }
  /* overflow visible : les liens (marge de -8 px pour le fond au survol) débordent dans la marge du menu, pas de barre de défilement */
  .menu__panneau { position: static; max-height: none; overflow: visible; border: 0; box-shadow: none; }
  .panneau { grid-template-columns: 1fr; gap: 16px; padding: 0 0 18px; }
  /* de l'introduction, seul le lien vers la page d'ensemble reste : le titre du menu ouvre le panneau (04/11/2026) */
  .panneau__intro .panneau-titre, .panneau__intro .panneau-texte { display: none; }
  .panneau__intro .lien-fleche { margin-top: 0; }
  .cartes-menu, .familles, .colonnes-menu { grid-template-columns: 1fr 1fr; }
  .encart-menu { grid-column: 1 / -1; min-height: 0; }

  .hero__inner { grid-template-columns: 1fr; gap: 36px; }
  .ia-coeur__image { max-width: 320px; }
  .ia-coeur__medaille { max-width: 170px; }
  .ia-coeur__diapo--medaille .ia-coeur__medaille { width: 170px; }
  .hero__ecran { justify-self: start; max-width: 640px; }
  .v3__tete { grid-template-columns: 1fr; }
  .v3__ecran { max-width: 640px; }
  .v3__colonnes { grid-template-columns: 1fr; }
  .solution { grid-template-columns: 1fr; gap: 28px; }
  .solution--inverse .solution__textes { order: 0; }
  /* une ligne par fonctionnalité : pictogramme, titre et phrase, repère de famille à droite */
  .top10__grille { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  .fonction { display: grid; grid-template-columns: 26px minmax(0, 1fr) 8px; grid-template-areas: "ico titre pt" "ico texte pt"; align-content: start; gap: 2px 14px; padding: 14px 16px; }
  .fonction__icone { display: contents; }
  .fonction__icone svg { grid-area: ico; }
  .fonction__icone i { grid-area: pt; margin-top: 6px; }
  .fonction__titre { grid-area: titre; }
  .fonction__texte { grid-area: texte; }
  .fonction__lien { display: none; }
  .grille-articles { grid-template-columns: 1fr 1fr; }
  .grille-articles .carte-article:first-child { grid-column: 1 / -1; }
  .chiffres ul { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 28px; }
  .cartes--4, .apports .cartes, .apports__liste { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .demo__inner { grid-template-columns: 1fr; }
  .pied__haut { grid-template-columns: 1fr; }
  .liens-pied { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .logos { --n: 4 !important; }
  .logos.logos--references { --n: 5 !important; gap: 20px 28px; }
  .carrousel__fleche--prec { left: -8px; }
  .carrousel__fleche--suiv { right: -8px; }
}

/* ========== Téléphone (≤ 767 px) ========== */
@media (max-width: 767px) {
  :root { --gouttiere: 16px; --entete: 64px; }
  .entete__logo svg { width: 126px; height: 38px; margin-top: -13px; }
  .entete__demo { padding: 8px 12px; font-size: 14px; }
  .cartes-menu, .familles, .colonnes-menu { grid-template-columns: 1fr; }
  .cartes, .cartes--2, .cartes--4, .apports .cartes, .apports__liste { grid-template-columns: 1fr; }
  /* bande des pages produit : les douze titres sur deux colonnes, sans leur phrase (près de trois écrans sinon) */
  .apports--bande .apports__liste { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px 16px; }
  .apports--bande .apports__liste p { display: none; }
  .apports--bande .apports__titre { font-size: 15px; }
  .top10__grille { grid-template-columns: 1fr; }
  .grille-articles { grid-template-columns: 1fr; }
  .grille-articles .carte-article:first-child { grid-column: auto; }
  .carr-temoignages .temoignage, .carr-temoignages .temoignage-attendu { width: 86%; }
  .carrousel__fleche { display: none; }
  .chiffres ul { gap: 20px; }
  .hero__chiffres { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px 16px; margin-top: 28px; }
  .parcours__etapes { display: flex; gap: 6px; overflow-x: auto; scrollbar-width: none; }
  .parcours__etapes::before { display: none; }
  .parcours__etapes li { flex: none; }
  .parcours__etape { grid-auto-flow: column; align-items: center; gap: 8px; padding: 5px 12px 5px 5px; border: 1px solid var(--trait); border-radius: var(--rayon-btn); }
  .parcours__etape[aria-selected="true"] { border-color: var(--encre); }
  .parcours__num { width: 26px; height: 26px; }
  .parcours__etape strong { font-size: 14px; white-space: nowrap; }
  .ia-coeur__inner, .ia-coeur__diapo--medaille .ia-coeur__inner { grid-template-columns: minmax(0, 1fr); }
  .ia-coeur__texte { font-size: 15px; }
  /* le dessin et la médaille ne tiennent plus à côté du texte : seule la citation reste, sous le texte */
  .ia-coeur__image, .ia-coeur__medaille { display: none; }
  .ia-coeur__citation { justify-self: stretch; max-width: none; }
  /* témoignage : la citation suffit, sans la phrase d'introduction ni le grand guillemet */
  .ia-coeur__diapo--temoin .ia-coeur__texte, .ia-coeur__guillemet { display: none; }
  .form-demo { grid-template-columns: 1fr; }
  .liens-pied { grid-template-columns: 1fr 1fr; }
  .logos { --n: 2 !important; gap: 20px 28px; }
  .logos.logos--references { --n: 4 !important; gap: 14px 16px; }
  .logos--references li { height: 36px; }
  .logos--references img { height: 30px; }
  .grands-comptes__points { grid-template-columns: 1fr; }
  .rdv form, .form-capsule { flex-wrap: wrap; }
  .rdv button, .form-capsule button { flex: 1 1 100%; }
  .bas-de-page { flex-direction: column; align-items: flex-start; }
}

/* ========== Bandeau de consentement ========== */
.consentement { position: fixed; left: 50%; bottom: 12px; z-index: 9999; width: min(784px, calc(100% - 24px)); max-height: calc(100vh - 24px); overflow-y: auto; padding: 20px 24px 16px;
  transform: translateX(-50%); border: 1px solid var(--trait); border-radius: var(--rayon); background: var(--fond); box-shadow: var(--ombre); font-size: 13px; line-height: 1.5; color: var(--texte); }
.consentement[hidden], .consentement [hidden] { display: none !important; }
.consentement__tete { position: relative; display: flex; align-items: center; justify-content: center; min-height: 24px; margin-bottom: 16px; }
.consentement__tete img { position: absolute; left: 0; width: 90px; height: auto; }
.consentement__titre { font-size: 15px; font-weight: 600; color: var(--encre); }
.consentement__corps { display: grid; grid-template-columns: 1fr 200px; gap: 20px; }
.consentement__texte p { margin: 0 0 10px; }
.consentement__options { display: flex; flex-direction: column; gap: 8px; }
.consentement__option { display: flex; gap: 10px; align-items: flex-start; padding: 10px; border-radius: var(--rayon-btn); background: var(--papier); cursor: pointer; }
.consentement__option strong { display: block; font-size: 14px; color: var(--encre); }
.consentement__boutons { display: flex; flex-direction: column; gap: 8px; }
.consentement__boutons button { min-height: 44px; padding: 10px; border-radius: var(--rayon-btn); cursor: pointer; font-size: 14px; font-weight: 600; }
.consentement__accepter, .consentement__enregistrer { border: 1px solid var(--encre); background: var(--encre); color: #fff; }
.consentement__refuser { border: 1px solid var(--encre); background: var(--encre); color: #fff; }
.consentement__options-btn { border: 1px solid var(--trait); background: var(--fond); color: var(--encre); }
.consentement__plus { display: block; margin-top: 10px; text-align: right; color: var(--action); text-decoration: underline; }
.consentement-onglet { position: fixed; right: 24px; bottom: 0; z-index: 9998; padding: 8px 12px; border: 1px solid var(--trait); border-bottom: 0; border-radius: var(--rayon-btn) var(--rayon-btn) 0 0;
  background: var(--fond); font-size: 12px; color: var(--encre); cursor: pointer; }
.consentement-onglet[hidden] { display: none; }
@media (max-width: 767px) {
  .consentement__corps { grid-template-columns: 1fr; }
  .consentement__tete { justify-content: flex-start; gap: 12px; }
  .consentement__tete img { position: static; flex: none; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { transition: none !important; scroll-behavior: auto !important; }
  .ia-coeur__lien { animation: none; }
}