/* Diagnostic v2 : la scène de conversation avec Nova.
   Technique reprise de la page contact de Locomotive (scène plein écran, agent à droite, une question à la fois,
   phrase précédente estompée, barre de progression et retour en bas) ; style, contenu et signe HUB IA. */

.nova-scene { min-height: calc(100svh - var(--barre) - 2 * var(--marge-panneau)); display: grid; padding-bottom: 0 !important; }
.iv2-bandeau + .nova-scene { padding-top: clamp(28px, 3.5vw, 56px); }
.nova-grille { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); grid-template-rows: 1fr auto; column-gap: clamp(24px, 4vw, 72px); align-items: center; min-height: 100%; position: relative; }

/* ---------- Colonne de conversation ---------- */
.nova-col { grid-column: 1; grid-row: 1; display: grid; gap: var(--e-4); align-content: center; padding-block: var(--e-4); max-width: 760px; }
.nova-ident { display: inline-flex; align-items: center; gap: var(--e-3); font-family: var(--police-donnees); font-size: var(--t-donnees); color: var(--texte-doux); }
.nova-ident strong { color: var(--texte); font-weight: 600; }
.nova-ident__signe { width: 34px; height: 34px; flex: none; display: none; }
.nova-ident__signe .nova-h { width: 100%; height: 100%; }
.tete-page h1.nova-titre { max-width: none; font-size: var(--t-l); font-weight: 500; color: var(--texte-doux); letter-spacing: -0.01em; }
.nova-demo, .nova-fin__demo { font-size: var(--t-s); color: var(--texte-doux); line-height: 1.7; }
.nova-demo__puce { margin-right: var(--e-2); }
.nova-demo__puce { display: inline-flex; padding: 2px 10px; border-radius: var(--rayon-action); border: 1.5px solid var(--accent); color: var(--accent); font-family: var(--police-donnees); font-size: var(--t-xs); text-transform: uppercase; letter-spacing: 0.06em; }
.nova-scene .crochet { color: var(--texte); }

.nova-conv { display: grid; gap: var(--e-4); }
.nova-fil { display: grid; gap: var(--e-2); min-height: 1.5em; }
.nova-fil__nova { font-size: var(--t-m); color: var(--texte-doux); opacity: 0.6; filter: blur(1.1px); max-width: 52ch; }
.nova-fil__vous { justify-self: start; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; padding: 4px 14px; border-radius: var(--rayon-action); background: color-mix(in srgb, var(--accent) 14%, transparent); color: var(--texte); font-size: var(--t-s); }
.nova-dit { font-family: var(--police-titres); font-size: clamp(1.55rem, calc(1rem + 1.55vw), 2.7rem); line-height: 1.14; letter-spacing: -0.025em; max-width: 24ch; min-height: 2.3em; text-wrap: pretty; }
.nova-curseur { display: inline-block; width: 0.45em; height: 0.92em; margin-left: 0.12em; vertical-align: -0.08em; background: var(--accent); border-radius: 2px; }
.js-mouvement .nova-curseur { animation: nova-clignote 1s steps(1) infinite; }
.nova-scene[data-etat="parle"] .nova-curseur { animation: none; }
@keyframes nova-clignote { 50% { opacity: 0; } }
.nova-fil.nova-fil--entre > * { animation: nova-fil var(--duree-lente) var(--courbe-sortie) both; }
@keyframes nova-fil { from { opacity: 0; transform: translateY(18px); filter: blur(0); } }

/* ---------- Questions ---------- */
.nova-form { display: grid; gap: var(--e-8); }
.nova-q { border: 0; margin: 0; padding: 0; min-width: 0; display: grid; gap: var(--e-4); }
.nova-q__legende { font-family: var(--police-titres); font-size: var(--t-xl); letter-spacing: -0.02em; margin-bottom: var(--e-3); padding: 0; }
.nova-facultatif { color: var(--texte-doux); font-size: var(--t-m); }
.nova-q__corps { display: grid; gap: var(--e-4); }
.nova-q__actions { display: flex; flex-wrap: wrap; align-items: center; gap: var(--e-4); }
.nova-astuce { color: var(--texte-doux); font-size: var(--t-s); font-family: var(--police-donnees); }
.nova-scene .champ input:not([type="checkbox"], [type="radio"]), .nova-scene .champ textarea { font-size: var(--t-l); border-radius: var(--rayon); background: color-mix(in srgb, var(--texte) 6%, var(--fond)); border-color: color-mix(in srgb, var(--texte) 38%, transparent); }
.nova-scene .champ input:focus, .nova-scene .champ textarea:focus { border-color: var(--accent); }
.nova-scene .champ textarea { min-height: calc(var(--champ) * 2.2); }
.nova-duo { display: grid; grid-template-columns: 1fr 1fr; gap: var(--e-4); }

.nova-pastilles, .nova-suggestions { display: flex; flex-wrap: wrap; gap: var(--e-2); }
.nova-suggestions[hidden] { display: none; }
.nova-pastille { position: relative; display: inline-flex; align-items: center; min-height: var(--cible); padding: 8px 18px; border-radius: var(--rayon-action); border: 1.5px solid color-mix(in srgb, var(--texte) 42%, transparent); background: transparent; color: var(--texte); font-family: var(--police-interface); font-size: var(--t-s); cursor: pointer; text-decoration: none; transition: background var(--duree) var(--courbe), border-color var(--duree) var(--courbe), color var(--duree) var(--courbe), transform var(--duree) var(--courbe); }
.nova-pastille input { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; opacity: 0; cursor: pointer; }
.nova-pastille:hover { border-color: var(--texte); }
.nova-pastille:has(input:checked) { background: var(--accent); border-color: var(--accent); color: var(--sur-accent); }
.nova-pastille:has(input:focus-visible) { outline: 3px solid var(--accent); outline-offset: 3px; }
.nova-pastille:active { transform: scale(0.97); }
.nova-pastille--secondaire { border-style: dashed; color: var(--texte-doux); }
.nova-pastille--bouton:focus-visible { outline: 3px solid var(--accent); outline-offset: 3px; }

.nova-consentement { display: grid; grid-template-columns: auto 1fr; gap: var(--e-3); align-items: start; font-size: var(--t-s); color: var(--texte-doux); max-width: 60ch; }
.nova-consentement input { width: 22px; height: 22px; margin-top: 2px; accent-color: var(--accent); }
.nova-consentement a { color: var(--texte); }
.nova-scene .message-erreur { color: var(--erreur); }

/* ---------- Récapitulatif et fin ---------- */
.nova-recap__liste { display: grid; margin: 0; border-top: 1px solid var(--bordure); }
.nova-recap__ligne { display: grid; grid-template-columns: minmax(0, 13rem) minmax(0, 1fr) auto; gap: var(--e-2) var(--e-4); align-items: baseline; padding: var(--e-3) 0; border-bottom: 1px solid var(--bordure); }
.nova-recap__ligne dt { font-family: var(--police-donnees); font-size: var(--t-xs); color: var(--texte-doux); text-transform: uppercase; letter-spacing: 0.04em; }
.nova-recap__ligne dd { margin: 0; overflow-wrap: anywhere; }
.nova-recap__ligne .vide { color: var(--texte-doux); }
.nova-modifier { min-height: var(--cible); padding: 0 var(--e-2); background: none; border: 0; color: var(--accent); font: inherit; font-size: var(--t-s); text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
.nova-fin { display: grid; gap: var(--e-4); }
.nova-fin:focus { outline: none; }
.nova-fin__titre { font-size: var(--t-2xl); letter-spacing: -0.035em; line-height: 1.02; }
.nova-fin h3 { font-size: var(--t-l); margin-top: var(--e-4); }
.nova-fin__suite { display: grid; gap: var(--e-2); padding: 0; list-style: none; }
.nova-fin__suite li { padding-left: 1.4em; position: relative; }
.nova-fin__suite li::before { content: ""; position: absolute; left: 0; top: 0.55em; width: 0.55em; height: 0.55em; border-radius: 50%; background: var(--accent); }

/* ---------- Avatar de Nova : le H du logo, sa sphère au centre ---------- */
.nova-avatar { grid-column: 2; grid-row: 1; align-self: stretch; display: grid; place-items: center; align-content: center; gap: var(--e-4); position: relative; }
.nova-avatar::before { content: ""; position: absolute; inset: 8% 0; border-radius: 50%; background: radial-gradient(closest-side, color-mix(in srgb, var(--accent) 13%, transparent), transparent); pointer-events: none; }
.nova-avatar .nova-h { width: min(100%, 500px); height: auto; overflow: visible; position: relative; }
.nova-h__pilier { fill: color-mix(in srgb, var(--texte) 90%, transparent); transition: transform 600ms var(--courbe-sortie); }
.nova-h__sphere, .nova-anneau, .nova-h__reflet { transform-box: fill-box; transform-origin: center; }
.nova-h__sphere { transition: transform 600ms var(--courbe-sortie); filter: drop-shadow(0 0 10px color-mix(in srgb, var(--accent) 45%, transparent)); }
.nova-h__reflet { transition: transform 700ms var(--courbe-sortie); }
.nova-anneau { stroke-width: 1.2; opacity: 0; }
.nova-avatar__nom { font-family: var(--police-donnees); font-size: var(--t-donnees); color: var(--texte); display: grid; justify-items: center; position: relative; }
.nova-avatar__nom span { color: var(--texte-doux); font-size: var(--t-xs); text-transform: uppercase; letter-spacing: 0.08em; }

.js-mouvement .nova-scene[data-etat="ecoute"] .nova-h__sphere, .js-mouvement .nova-scene[data-etat="repos"] .nova-h__sphere { animation: nova-respire 3.6s ease-in-out infinite; }
.nova-scene[data-etat="ecoute"] .nova-h__reflet { transform: translate(-3px, 2px); }
.js-mouvement .nova-scene[data-etat="parle"] .nova-h__sphere { animation: nova-parle 0.42s ease-in-out infinite alternate; }
.js-mouvement .nova-scene[data-etat="parle"] .nova-anneau { animation: nova-onde 1.8s var(--courbe-sortie) infinite; }
.js-mouvement .nova-scene[data-etat="parle"] .nova-anneau--2 { animation-delay: 0.6s; }
.js-mouvement .nova-scene[data-etat="parle"] .nova-anneau--3 { animation-delay: 1.2s; }
.nova-scene[data-etat="content"] .nova-h__pilier--g { transform: translateX(5px); }
.nova-scene[data-etat="content"] .nova-h__pilier--d { transform: translateX(-5px); }
.nova-scene[data-etat="content"] .nova-h__sphere { transform: scale(1.12); }
.nova-scene[data-etat="doute"] .nova-h__sphere { transform: translateY(5px) scale(0.94); }
.nova-scene[data-etat="doute"] .nova-h__reflet { transform: translate(3px, 4px); }
.nova-scene[data-etat="fin"] .nova-h__pilier--g { transform: translateX(8px); }
.nova-scene[data-etat="fin"] .nova-h__pilier--d { transform: translateX(-8px); }
.nova-scene[data-etat="fin"] .nova-h__sphere { transform: scale(1.18); filter: drop-shadow(0 0 22px color-mix(in srgb, var(--accent) 70%, transparent)); }
.js-mouvement .nova-scene[data-etat="fin"] .nova-anneau { animation: nova-onde 2.4s var(--courbe-sortie) 2; }
@keyframes nova-respire { 50% { transform: scale(1.06); } }
@keyframes nova-parle { from { transform: scale(0.97); } to { transform: scale(1.09); } }
@keyframes nova-onde { 0% { opacity: 0.7; transform: scale(1); } 100% { opacity: 0; transform: scale(3.1); } }

/* ---------- Pied de scène : retour, rang, progression, pause ---------- */
.nova-pied { grid-column: 1 / -1; grid-row: 2; display: flex; align-items: center; gap: var(--e-4); padding: var(--e-4) 0 var(--e-8); }
.nova-pied[hidden] { display: none; }
.nova-retour { width: 48px; height: 48px; display: grid; place-items: center; border-radius: 50%; border: 1.5px solid color-mix(in srgb, var(--texte) 45%, transparent); background: transparent; color: var(--texte); cursor: pointer; }
.nova-retour svg { width: 20px; height: 20px; }
.nova-retour:hover:not(:disabled) { border-color: var(--accent); color: var(--accent); }
.nova-retour:disabled { opacity: 0.35; cursor: default; }
.nova-rang { font-family: var(--police-donnees); font-size: var(--t-donnees); color: var(--texte-doux); min-width: 8ch; }
.nova-progression { position: absolute; left: calc(-1 * var(--gouttiere)); right: calc(-1 * var(--gouttiere)); bottom: 0; height: 3px; background: color-mix(in srgb, var(--texte) 12%, transparent); }
.nova-progression span { display: block; height: 100%; width: calc(var(--p, 0) * 100%); background: var(--accent); transition: width var(--duree-lente) var(--courbe-sortie); }
.nova-grille > .bascule-mouvement { grid-column: 2; grid-row: 2; justify-self: end; align-self: center; margin: 0 0 var(--e-4); position: relative; z-index: 1; }

/* ---------- Mode conversation (JavaScript) ---------- */
.nova-actif .nova-q__legende { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.nova-actif .nova-sansjs, .nova-actif .nova-envoi-sansjs { display: none; }
.nova-actif .nova-form { gap: 0; }
.nova-actif .nova-q[hidden] { display: none; }
.nova-scene:not(.nova-actif) [data-suivant], .nova-scene:not(.nova-actif) .nova-astuce { display: none; }
.js-mouvement .nova-entre > * { animation: nova-monte var(--duree-lente) var(--courbe-sortie) both; }
.js-mouvement .nova-entre .nova-q__corps > * { animation: nova-monte var(--duree-lente) var(--courbe-sortie) both; }
.js-mouvement .nova-entre .nova-pastille { animation: nova-monte var(--duree-lente) var(--courbe-sortie) both; animation-delay: calc(var(--i, 0) * 45ms); }
@keyframes nova-monte { from { opacity: 0; transform: translateY(14px); } }
.pause-mouvement .nova-scene *, .pause-mouvement .nova-scene *::before { animation-play-state: paused !important; }

/* Sans JavaScript : un formulaire classique, lisible sur fond sombre. */
.nova-sansjs { color: var(--texte-doux); }
.nova-envoi-sansjs { display: grid; gap: var(--e-3); justify-items: start; color: var(--texte-doux); font-size: var(--t-s); }
.nova-envoi-sansjs .bouton:disabled { opacity: 0.5; cursor: not-allowed; }

/* ---------- Tablette et mobile ---------- */
@media (max-width: 959px) {
  .nova-grille { grid-template-columns: minmax(0, 1fr); grid-template-rows: auto 1fr auto; }
  .nova-avatar { grid-column: 1; grid-row: 1; align-self: start; grid-template-columns: auto auto; justify-content: start; gap: var(--e-4); }
  .nova-avatar::before { inset: -30% auto -30% -10%; width: 260px; }
  .nova-avatar .nova-h { width: clamp(120px, 26vw, 200px); }
  .nova-avatar__nom { display: none; }
  .nova-titre { font-size: var(--t-m); }
  .nova-col { gap: var(--e-4); }
  .nova-col { grid-row: 2; padding-block: var(--e-4) var(--e-6); }
  .nova-pied { grid-row: 3; }
  .nova-grille > .bascule-mouvement { grid-column: 1; grid-row: 3; }
}
@media (max-width: 599px) {
  .nova-duo { grid-template-columns: minmax(0, 1fr); }
  .nova-recap__ligne { grid-template-columns: minmax(0, 1fr) auto; }
  .nova-recap__ligne dt { grid-column: 1 / -1; }
  .nova-astuce { display: none; }
  .nova-grille > .bascule-mouvement span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; }
}
@media (prefers-reduced-motion: reduce) {
  .nova-anneau { display: none; }
  .nova-h__pilier, .nova-h__sphere, .nova-h__reflet, .nova-progression span { transition: none; }
}
.nova-scene [hidden] { display: none !important; }

/* ---------- Voix de Nova (synthèse de l'appareil, coupée par défaut) ---------- */
.nova-son-boite { display: flex; align-items: center; gap: var(--e-3); flex-wrap: wrap; }
.nova-son { display: inline-flex; align-items: center; gap: var(--e-2); min-height: var(--cible); padding: 6px 16px 6px 12px; border-radius: var(--rayon-action); border: 1.5px solid color-mix(in srgb, var(--texte) 45%, transparent); background: transparent; color: var(--texte); font-family: var(--police-interface); font-size: var(--t-s); cursor: pointer; }
.nova-son svg { width: 18px; height: 18px; flex: none; }
.nova-son .nova-son__on, .nova-son[aria-pressed="true"] .nova-son__off { display: none; }
.nova-son[aria-pressed="true"] .nova-son__on { display: block; }
.nova-son[aria-pressed="true"] { background: var(--accent); border-color: var(--accent); color: var(--sur-accent); }
.nova-son:hover { border-color: var(--texte); }
.nova-son:focus-visible { outline: 3px solid var(--accent); outline-offset: 3px; }
.nova-son__mention { font-size: var(--t-xs); color: var(--texte-doux); }
.nova-scene.nova-voix .nova-h__sphere { filter: drop-shadow(0 0 18px color-mix(in srgb, var(--accent) 65%, transparent)); }
.js-mouvement .nova-scene.nova-pouls .nova-h__sphere { animation: nova-pouls-voix 300ms var(--courbe-sortie); }
.js-mouvement .nova-scene.nova-pouls .nova-anneau--2 { animation: nova-onde 900ms var(--courbe-sortie); }
@keyframes nova-pouls-voix { 0% { transform: scale(1); } 35% { transform: scale(1.13); } 100% { transform: scale(1); } }
@media (max-width: 599px) { .nova-son__mention { flex-basis: 100%; } .nova-pied { flex-wrap: wrap; } }
