/* ============================================================
   GABARIT V10 — la feuille commune des pages au style de la home V10
   ------------------------------------------------------------
   Extraite de public/preview/home-vision-3d-v10/ (06/10) : jetons, barre et méga-menu, menu
   mobile, pied de page et son aurore, prise de contact. Plus quelques blocs de page intérieure
   (en-tête court, sections, cartes, chiffres, texte long, FAQ, bande d'appel), puisque les pages
   déclinées sont moins « scrolly-telling » que la home : pas de scène three.js ici.

   Feuille AUTONOME : aucune classe Webflow, et elle ne se charge jamais à côté des trois
   feuilles Webflow (CLAUDE.md, piège 1). Une page est au gabarit V10 ou ne l'est pas.

   Le HTML de la barre et du pied de page n'est pas écrit à la main : scripts/v10-gabarit.mjs le
   pose entre les marqueurs galeon:v10:*, depuis src/lib/v10/menu.json. Le comportement
   (ouvrir, fermer, aurore) est dans js/v10.js ; la prise de contact dans js/v10-contact.js.
   Modèle de page : public/preview/v10-gabarit/.
   ============================================================ */

/* La police est servie d'ici, plus de Google Fonts : un appel à un tiers à chaque page vue n'a
   rien à faire sous l'exemption de mesure (CLAUDE.md, piège 10). Variable 300 → 700, latin et
   latin étendu (38 Ko). Source et licence OFL : ~/Galeon/ressources/polices/marque/, recopiée
   dans public/fonts/plus-jakarta-sans-OFL.txt. Le hash est dans le nom : /fonts est immutable. */
@font-face{font-family:"Plus Jakarta Sans";src:url("/fonts/plus-jakarta-sans-var.15c6e84c.woff2") format("woff2");font-weight:300 700;font-style:normal;font-display:swap}

:root{
  --ink:#161d31; --ink-2:#1a2440; --ink-3:#1f2c4d; --ink-glow:#162f4e;
  /* le fond des parties sombres, celui que la home donne à voir : son hero (#0b1020) et le voile sous
     ses textes (12,16,32). Mesuré sur la home rendue le 08/10 : #090e21 à #0b1020 au centre, presque noir
     aux bords. --ink (#161d31) reste la teinte des éléments posés dessus : boutons, fenêtre de contact. */
  --fond:#0b1020; --fond-2:#101830;
  --paper:#eef4fc; --paper-2:#f7faff;
  --blue:#479af3; --blue-l:#8cc2ff; --blue-d:#2f7fdc; --cyan:#5ad1e6;
  --grad:linear-gradient(120deg,#2f7fdc 0%,#479af3 45%,#5ad1e6 100%);
  --line-d:rgba(255,255,255,.12); --line-l:rgba(10,12,24,.1);
  --tx:#f1f6ff; --tx-rgb:222,233,255;
  --dim:rgba(var(--tx-rgb),.7); --dim-2:rgba(var(--tx-rgb),.46);
  --ink-dim:rgba(10,12,24,.66);
  --todo:#c2692f;
  --sans:"Plus Jakarta Sans",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  --w:1280px; --nav-h:76px;
}

/* ─── BASE ───────────────────────────────────────── */
*,*::before,*::after{box-sizing:border-box}
*{scrollbar-width:thin;scrollbar-color:rgba(140,194,255,.32) transparent}
::-webkit-scrollbar{width:8px;height:8px}
::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{background:rgba(140,194,255,.3);border-radius:8px;border:2px solid transparent;background-clip:padding-box}
::-webkit-scrollbar-thumb:hover{background:rgba(140,194,255,.55);background-clip:padding-box}
.ov *{scrollbar-color:rgba(10,12,24,.25) transparent}
.menu__tabs{scrollbar-width:none}.menu__tabs::-webkit-scrollbar{display:none}
html{-webkit-text-size-adjust:100%;overflow-x:clip;scroll-padding-top:calc(var(--nav-h) + 16px)}
body{margin:0;background:var(--fond);color:var(--tx);font-family:var(--sans);font-size:15px;line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:clip}
img,video,svg{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit;color:inherit}
button{background:none;border:0;cursor:pointer;padding:0}
:focus-visible{outline:2px solid var(--blue-l);outline-offset:3px;border-radius:6px}
.wrap{width:100%;max-width:var(--w);margin:0 auto;padding:0 32px}
@media (max-width:640px){.wrap{padding:0 16px}}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.eyebrow{font-size:11px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--blue-l);margin:0 0 18px;display:flex;align-items:center;gap:10px}
.eyebrow::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor}
.light .eyebrow{color:var(--blue-d)}
h1,h2,h3{margin:0;font-weight:700;letter-spacing:-.03em;line-height:1.04}
.lead{font-size:clamp(15px,1.2vw,17px);line-height:1.6;color:var(--dim);max-width:56ch}
.light{background:var(--paper);color:#0a0c18}
.light .lead{color:var(--ink-dim)}

/* ─── BOUTONS ────────────────────────────────────── */
.btn{display:inline-flex;align-items:center;gap:10px;height:52px;padding:0 26px;border-radius:999px;font-weight:600;font-size:15px;transition:gap .2s,background .3s,color .3s,border-color .3s}
.btn:hover{gap:14px}
.btn--solid{background:#fff;color:#0a0c18}
.btn--blue,.btn--p{background:var(--blue);color:var(--tx)}
.btn--dark{background:var(--ink);color:var(--tx)}
.btn--ghost{border:1.5px solid rgba(255,255,255,.5);color:var(--tx)}
.light .btn--ghost,.btn--outline-dark{border:1.5px solid rgba(10,12,24,.3);color:#0a0c18}
.btn--glass{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.3);color:var(--tx);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.btn--glass:hover{background:#fff;color:#0a0c18;border-color:#fff}
.btn--block{width:100%;justify-content:center}
.arrow{width:18px;height:18px;flex:none}

/* ─── BARRE ──────────────────────────────────────── */
/* Au repos la barre est posée sur l'en-tête ; au défilement elle se rétracte en pilule de verre. */
.nav{position:fixed;inset:0 0 auto;z-index:50;height:var(--nav-h);padding:0 16px}
/* Une seule courbe pour toute la forme (celle des apparitions), et le verre réglé dans chaque sens :
   en se rétractant, il se pose tout de suite ; en revenant en haut, la pilule s'étire d'abord et ne se
   dissout qu'en arrivant à sa largeur. Avant le 29/10/2026, quatre durées et deux courbes : le verre
   disparaissait en premier, et l'on voyait une barre nue finir de s'élargir. */
.nav__in{height:100%;display:flex;align-items:center;gap:44px;border:1px solid transparent;border-radius:999px;
  --nav-forme:.6s cubic-bezier(.2,.7,.2,1);
  transition:max-width var(--nav-forme),height var(--nav-forme),padding var(--nav-forme),gap var(--nav-forme),margin var(--nav-forme),
    background .45s ease .15s,border-color .45s ease .15s,box-shadow .35s ease,backdrop-filter .45s ease .15s,-webkit-backdrop-filter .45s ease .15s}
.nav.is-solid{padding-top:12px}
.nav.is-solid .nav__in{max-width:1120px;height:56px;padding:0 8px 0 24px;gap:28px;
  background:rgba(14,17,34,.62);border-color:rgba(255,255,255,.14);
  backdrop-filter:blur(18px) saturate(140%);-webkit-backdrop-filter:blur(18px) saturate(140%);box-shadow:0 12px 40px rgba(0,0,0,.34);
  transition:max-width var(--nav-forme),height var(--nav-forme),padding var(--nav-forme),gap var(--nav-forme),margin var(--nav-forme),
    background .3s ease,border-color .3s ease,box-shadow .5s ease .1s,backdrop-filter .3s ease,-webkit-backdrop-filter .3s ease}
.nav:not(.is-solid) .nav__in{max-width:var(--w);padding:0 32px}
/* Le bandeau d'annonce, repris de la home A (preview/home-a) : une bande BLANCHE pleine largeur au-dessus de
   la barre en haut de page ; au défilement, une pilule de verre sous celle de la barre, qui ne revient
   qu'en remontant. Écrit masqué par scripts/v10-gabarit.mjs, montré par js/v10.js jusqu'à sa date.
   html.annonce-haut : la bande est en haut, la barre et les menus descendent de sa hauteur.
   Miroir pour les homes Webflow, qui ne chargent pas ce fichier : css/annonce.css (et js/annonce.js). */
.annonce{position:fixed;top:0;left:0;right:0;z-index:51;height:42px;display:flex;align-items:center;justify-content:center;
  background:#fff;color:var(--ink);border-bottom:1px solid var(--line-l);
  transition:top .4s cubic-bezier(.4,0,.2,1),height .35s ease,background .35s ease,border-color .35s ease,opacity .3s ease,transform .6s cubic-bezier(.2,.7,.2,1)}
.annonce[hidden]{display:none}
.annonce__in{display:flex;align-items:center;gap:14px;height:42px;max-width:calc(100% - 32px);padding:0 20px;font-size:13px;letter-spacing:-.01em;
  border:1px solid transparent;border-radius:99px;
  transition:height .35s ease,padding .35s ease,gap .35s ease,font-size .35s ease,background .35s ease,border-color .35s ease,box-shadow .35s ease}
.annonce p{margin:0;min-width:0;color:var(--ink-dim);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.annonce b{font-weight:700;color:var(--ink)}
.annonce__c{display:none}
.annonce a{display:inline-flex;align-items:center;flex:none;height:26px;padding:0 12px;border-radius:99px;
  background:var(--ink);border:1px solid var(--ink);font-size:12.5px;font-weight:500;color:#fff;
  transition:background .2s,height .35s ease,padding .35s ease,font-size .35s ease}
.annonce a:hover{background:var(--ink-3);border-color:var(--ink-3)}
.annonce.is-float{top:var(--annonce-y,76px);height:32px;background:transparent;border-color:transparent}
.annonce.is-float .annonce__in{height:32px;padding:0 6px 0 15px;gap:10px;font-size:12px;
  background:rgba(255,255,255,.86);border-color:var(--line-l);
  backdrop-filter:blur(18px) saturate(140%);-webkit-backdrop-filter:blur(18px) saturate(140%);box-shadow:0 12px 40px rgba(0,0,0,.22)}
.annonce.is-float a{height:22px;padding:0 10px;font-size:11.5px}
.annonce.is-float{transition:top .4s cubic-bezier(.4,0,.2,1),opacity .35s ease,transform .5s cubic-bezier(.2,.7,.2,1)}
.annonce.is-float.is-hidden,html.menu-open .annonce.is-float{opacity:0;transform:translateY(-10px) scale(.96);pointer-events:none;transition-duration:.4s,.2s,.3s}
/* Entre la bande du haut et la pilule, l'une ne se change plus en l'autre sous les yeux (la pilule
   remontait à travers la barre pour redevenir la bande) : js/v10.js efface la pilule sur place, puis la
   bande descend du bord de l'écran avec la barre ; dans l'autre sens, elle remonte avec elle.
   .is-hors : la bande au-dessus de l'écran ; .sans-trans : changement d'état sans transition. */
.annonce.is-hors{transform:translateY(-100%)}
.annonce.sans-trans,.annonce.sans-trans .annonce__in,.annonce.sans-trans a{transition:none}
html.annonce-haut .nav{top:42px}
html.annonce-haut .mega__in{padding-top:calc(var(--nav-h) + 42px + clamp(40px,7vh,80px))}
html.annonce-haut .menu__in{padding-top:calc(var(--nav-h) + 54px)}
.nav{transition:padding .6s cubic-bezier(.2,.7,.2,1),top .6s cubic-bezier(.2,.7,.2,1)}
@media (max-width:640px){
  /* sur téléphone, le texte cède la place : le titre et le bouton suffisent */
  .annonce__in{gap:10px;padding:0 12px}
  .annonce__l,.annonce p span{display:none}.annonce__c{display:inline}
}
@media (prefers-reduced-motion:reduce){.annonce,.annonce__in,.nav,.nav__in,.nav.is-solid .nav__in,.nav__logo,.nav__logo path{transition:none !important}}
.nav__logo{flex:none;color:var(--tx)}
.nav__logo svg{height:22px;width:auto}
.nav__links{display:flex;gap:6px;flex:1}
.nav__top{display:inline-flex;align-items:center;gap:6px;height:44px;padding:0 14px;border-radius:999px;font-size:14.5px;font-weight:500;color:rgba(var(--tx-rgb),.82)}
.nav__top:hover,.nav__top[aria-expanded="true"]{color:var(--tx);background:rgba(255,255,255,.08)}
.nav__top svg{width:14px;height:14px;transition:transform .2s}
.nav__top[aria-expanded="true"] svg{transform:rotate(180deg)}
.cap{display:flex;align-items:center;gap:6px;margin-left:auto;flex:none}
/* le bouton du haut ne crie pas : verre transparent, il ne devient blanc qu'au survol */
.nav__cta{height:44px;padding:0 20px;font-size:14px;white-space:nowrap;justify-content:center;
  background:rgba(255,255,255,.06);color:var(--tx);border:1px solid rgba(255,255,255,.28)}
.nav__cta:hover{background:#fff;color:#0a0c18;border-color:#fff}
/* la capsule : sur la home, le libellé du bouton suit le chapitre, et glisse d'un texte à l'autre */
.nav__cta{overflow:hidden;transition:background .25s,color .25s,border-color .25s,width .38s cubic-bezier(.4,0,.2,1)}
.cap__t{display:inline-block;transition:opacity .18s ease,transform .18s ease}
.cap__t.is-swap{opacity:0;transform:translateY(6px)}
.cap__s{display:none}
.nav.is-solid .nav__cta{height:42px}
.nav__burger{display:none;width:40px;height:40px;border-radius:999px;align-items:center;justify-content:center}
.nav__burger i{display:block;position:relative;width:16px;height:9px}
.nav__burger i::before,.nav__burger i::after{content:"";position:absolute;right:0;height:1.5px;border-radius:2px;background:currentColor;transition:width .3s cubic-bezier(.2,.7,.3,1),transform .3s cubic-bezier(.2,.7,.3,1)}
.nav__burger i::before{top:0;width:16px}.nav__burger i::after{bottom:0;width:10px}
.nav__burger[aria-expanded="true"] i::before{width:16px;transform:translateY(4px) rotate(45deg)}
.nav__burger[aria-expanded="true"] i::after{width:16px;transform:translateY(-3.5px) rotate(-45deg)}
.nav.is-solid.is-open .nav__in{background:rgba(14,17,34,.5);border-color:rgba(255,255,255,.12);box-shadow:none}

/* ─── MÉGA-MENU ──────────────────────────────────── */
/* Plein écran, verre fumé. Il est HORS de la barre : le backdrop-filter de la barre ferait d'elle le
   cadre d'un élément fixed, et le panneau n'aurait que ses 76 px de haut. */
.mega{position:fixed;inset:0;z-index:49;display:none;overflow:auto;
  background:linear-gradient(180deg,rgba(10,14,30,.84),rgba(10,14,30,.7));backdrop-filter:blur(26px) saturate(1.3);-webkit-backdrop-filter:blur(26px) saturate(1.3);
  color:var(--tx);animation:megaIn .25s cubic-bezier(.2,.7,.2,1) both}
@keyframes megaIn{from{opacity:0}to{opacity:1}}
.mega.is-open{display:block}
.mega__in{padding:calc(var(--nav-h) + clamp(40px,7vh,80px)) 32px 48px}
.mega__panel{display:flex;gap:64px;align-items:flex-start}
.mega__panel[hidden]{display:none}
.mega__cols{flex:1;display:grid;gap:40px;grid-template-columns:repeat(var(--n,3),minmax(0,1fr))}
.mega__col h4{margin:0 0 14px;padding:0 14px;font-size:11.5px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:rgba(var(--tx-rgb),.42)}
.mi{display:flex;flex-direction:column;gap:3px;padding:12px 14px;border-radius:12px;transition:background .15s}
a.mi:hover,a.mi[aria-current="page"]{background:rgba(255,255,255,.07)}
.mi b{font-size:clamp(17px,1.5vw,21px);font-weight:600;letter-spacing:-.01em;color:var(--tx)}
.mi span{font-size:13.5px;color:rgba(var(--tx-rgb),.58);line-height:1.4}
/* les pages à créer : seulement dans /preview/ (le générateur ne les écrit pas ailleurs) */
.mi--todo{border:1.5px dashed rgba(255,255,255,.18);background:repeating-linear-gradient(135deg,rgba(255,255,255,.025) 0 8px,rgba(255,255,255,.055) 8px 16px);margin:4px 0}
.mi--todo b{color:rgba(var(--tx-rgb),.5);display:flex;align-items:center;gap:10px}
.mi--todo span{color:rgba(var(--tx-rgb),.38)}
.mi--apercu b{display:flex;align-items:center;gap:10px}
.mi--apercu b::after{content:attr(data-apercu);font-size:9.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--blue-l);border:1px solid rgba(140,194,255,.5);border-radius:999px;padding:1px 7px;white-space:nowrap;flex:none}
.mi--todo b::after{content:attr(data-todo);font-size:9.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:#e79a62;border:1px dashed #e79a62;border-radius:999px;padding:1px 7px;white-space:nowrap;flex:none}
.mega__card{width:340px;flex:none;border-radius:20px;padding:22px;display:flex;flex-direction:column;gap:12px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12)}
.mega__card .viz{height:170px;border-radius:12px;background:var(--grad);opacity:.9;width:100%;object-fit:cover;object-position:left top}
.mega__card img.viz{opacity:1;background:#fff}
/* une carte qui ne mène qu'à une page : son lien la couvre entière */
.mega__card--lien{position:relative;transition:background .25s cubic-bezier(.2,.7,.2,1),border-color .25s cubic-bezier(.2,.7,.2,1)}
.mega__card--lien:hover{background:rgba(255,255,255,.09);border-color:rgba(255,255,255,.2)}
.mega__card--lien>a::after{content:"";position:absolute;inset:0;border-radius:inherit}
/* la newsletter : un numéro en miniature, penché, qui sort par le bas (visuel Figma 13213:4229) */
.mega__card .viz--news{position:relative;overflow:hidden;opacity:1;background:linear-gradient(235.76deg,#feffff 1%,#eaf6fe 99%)}
.nl{position:absolute;left:50%;top:12px;width:min(244px,84%);transform:translateX(-50%) rotate(-1deg);background:#fff;color:#0d0f20;
  border:1px solid rgba(13,40,80,.1);border-bottom:0;border-radius:10px 10px 0 0;box-shadow:0 11px 27px rgba(13,40,80,.16);overflow:hidden;transition:transform .5s cubic-bezier(.2,.7,.2,1)}
.mega__card:hover .nl{transform:translateX(-50%) translateY(-4px) rotate(-1.6deg)}
.nl__bar{height:29px;display:flex;align-items:center;justify-content:space-between;gap:8px;padding:0 10px;border-bottom:1px solid rgba(13,40,80,.08)}
.nl__bar svg{height:10px;width:auto;flex:none}
.nl__bar small{font-size:6px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:#8a90a2;white-space:nowrap}
.nl__body{display:flex;flex-direction:column;gap:4px;padding:8px 11px 9px}
.nl__tag{align-self:flex-start;padding:3px 6px;border-radius:99px;background:rgba(71,154,243,.12);color:#479af3;font-size:6px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;line-height:1.4}
.mega__card .nl b{font-size:11px;line-height:1.2;font-weight:700;letter-spacing:-.01em;color:#0d0f20;margin-bottom:2px}
.nl i{display:block;height:7px;border-radius:2px;background:#e7edf6}
.nl i+i{width:72%}
.nl__band{display:flex;align-items:center;gap:8px;padding:9px 14px 14px;background:radial-gradient(120% 140% at 50% 120%,rgba(71,154,243,.22),rgba(71,154,243,0) 70%),#0d0f20}
.nl__band img{width:22px;height:22px;flex:none}
.nl__band span{color:#fff;font-size:15px;line-height:1.06;font-weight:500;letter-spacing:-.02em}
.nl__band em{display:block;font-style:normal;font-weight:800;background:linear-gradient(86deg,#3a82f3,#57b9f3 50%,#3a82f3);-webkit-background-clip:text;background-clip:text;color:transparent}
@media (prefers-reduced-motion:reduce){.nl{transition:none}.mega__card:hover .nl{transform:translateX(-50%) rotate(-1deg)}}
.mega__card b{font-size:18px;color:var(--tx)}
.mega__card p{margin:0;font-size:13.5px;line-height:1.45;color:rgba(var(--tx-rgb),.62)}
.mega__card a{font-size:14px;font-weight:600;color:var(--blue-l)}
/* le prochain rendez-vous : js/v10.js montre le premier à venir, et rien une fois le dernier passé */
.mega__next{display:flex;flex-direction:column;gap:8px;padding-bottom:16px;margin-bottom:4px;border-bottom:1px solid rgba(255,255,255,.1)}
.mega__next[hidden]{display:none}
.mega__next small{font-size:12.5px;color:rgba(var(--tx-rgb),.55)}
.mega__next b{font-size:16px}

/* ─── MENU MOBILE ────────────────────────────────── */
/* Le menu de bureau en plein écran, ses rubriques en onglets : mêmes repères du bureau au
   téléphone. Son contenu est recopié des panneaux du méga-menu par js/v10.js. */
.menu{position:fixed;inset:0;z-index:49;display:none;overflow:auto;overscroll-behavior:contain;
  background:linear-gradient(180deg,rgba(10,14,30,.84),rgba(10,14,30,.7));backdrop-filter:blur(26px) saturate(1.3);-webkit-backdrop-filter:blur(26px) saturate(1.3);
  color:var(--tx);animation:megaIn .25s cubic-bezier(.2,.7,.2,1) both}
.menu.is-open{display:block}
@media (min-width:961px){.menu{display:none !important}}
.menu__in{padding:calc(var(--nav-h) + 12px) 16px calc(32px + env(safe-area-inset-bottom));display:flex;flex-direction:column;gap:26px}
.menu__tabs{display:flex;gap:4px;margin:0 -6px;overflow-x:auto}
.menu__tabs .nav__top{flex:none;height:42px;font-size:15px}
.menu .mega__panel{flex-direction:column;gap:26px}
.menu .mega__cols{grid-template-columns:1fr;gap:26px}
.menu .mi{padding:10px 14px}
.menu .mega__card{width:auto}
.menu__cta .btn{width:100%;justify-content:center}
@media (max-width:960px){
  html.menu-open,html.menu-open body{overflow:hidden}
  .nav__links{display:none}
  .mega{display:none !important}
  /* sur mobile la barre est toujours une pilule (le logo, l'action), et le burger en sort : un rond de verre à côté */
  .nav,.nav.is-solid{display:flex;align-items:center;gap:8px;height:auto;padding:12px 12px 0}
  .nav .nav__in,.nav.is-solid .nav__in,.nav:not(.is-solid) .nav__in{flex:1;min-width:0;max-width:none;margin:0;height:52px;gap:12px;padding:0 6px 0 16px;
    background:rgba(14,17,34,.62);border-color:rgba(255,255,255,.14);backdrop-filter:blur(18px) saturate(140%);-webkit-backdrop-filter:blur(18px) saturate(140%);box-shadow:0 12px 40px rgba(0,0,0,.34)}
  .nav.is-open .nav__in{box-shadow:none}
  /* au défilement, le logo se replie sur l'Oméga : la boîte se rétrécit à sa largeur (118 des 690 unités
     du viewBox) et les lettres s'effacent. Le premier tracé du SVG est l'Oméga, les suivants les lettres. */
  .nav__logo{display:block;overflow:hidden;width:calc(19px * 690 / 103);transition:width .6s cubic-bezier(.2,.7,.2,1)}
  .nav__logo svg{height:19px;max-width:none}
  /* en revenant en haut, les lettres reviennent une à une, de G à N, en glissant derrière l'Oméga ;
     en partant, toutes ensemble et vite */
  .nav__logo path:nth-child(n+2){transition:opacity .4s ease,transform .6s cubic-bezier(.2,.7,.2,1)}
  .nav__logo path:nth-child(3){transition-delay:.04s}.nav__logo path:nth-child(4){transition-delay:.08s}
  .nav__logo path:nth-child(5){transition-delay:.12s}.nav__logo path:nth-child(6){transition-delay:.16s}
  .nav__logo path:nth-child(7){transition-delay:.2s}
  .nav.is-solid .nav__logo{width:calc(19px * 118 / 103)}
  .nav.is-solid .nav__logo path:nth-child(n+2){opacity:0;transform:translateX(-14px);transition:opacity .2s ease,transform .3s ease;transition-delay:0s}
  .nav__cta,.nav.is-solid .nav__cta{height:40px;padding:0 16px;font-size:13.5px;background:#fff;color:#0a0c18;border-color:#fff}
  .cap__l{display:none}.cap__s{display:inline}
  .nav__burger{display:flex;flex:none;width:52px;height:52px;border-radius:50%;color:var(--tx);
    background:rgba(14,17,34,.62);border:1px solid rgba(255,255,255,.14);backdrop-filter:blur(18px) saturate(140%);-webkit-backdrop-filter:blur(18px) saturate(140%);box-shadow:0 12px 40px rgba(0,0,0,.34)}
  .nav.is-open .nav__burger{box-shadow:none}
}

/* galeon:pied:start — de ce marqueur à galeon:pied:end, recopié tel quel dans css/v10-pied-autonome.css
   par scripts/v10-gabarit.mjs, pour les pages qui ne chargent pas cette feuille (le baromètre). */
/* ─── PIED DE PAGE ───────────────────────────────── */
.foot{position:relative;z-index:1;padding:72px 0 110px;background:linear-gradient(180deg,var(--fond) 0,#0c1124 300px)}
/* le bas glisse vers le bleu de l'orbe, jamais jusqu'au blanc : beaucoup d'arrêts, et un grain par-dessus */
.foot::after{content:"";position:absolute;left:0;right:0;bottom:0;height:320px;pointer-events:none;
  background:linear-gradient(180deg,rgba(12,17,36,0) 0%,rgba(20,30,56,.3) 18%,rgba(25,40,74,.55) 36%,rgba(28,50,94,.74) 54%,rgba(31,60,114,.88) 72%,rgba(34,68,128,.96) 88%,#23468a 100%)}
.foot > .wrap{position:relative;z-index:1}
/* une page qui finit sur une section claire : le pied de page part du clair, en fondu court */
.light + .foot,main:has(> :last-child.light) + .foot{background:linear-gradient(180deg,var(--paper) 0,#0c1124 140px)}
.grain::before{content:"";position:absolute;inset:0;pointer-events:none;z-index:2;opacity:.09;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
.foot__grid{display:grid;grid-template-columns:1.2fr repeat(3,minmax(0,1fr));gap:40px}
.foot__grid>*{min-width:0}
.foot__brand a{display:inline-block;color:var(--tx)}
.foot__brand svg{height:22px;width:auto}
.foot__brand p{margin:18px 0 0;font-size:13.5px;color:var(--dim);max-width:34ch}
.foot h5{margin:0 0 14px;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--dim-2)}
.foot ul{overflow-wrap:anywhere;margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:9px;font-size:14px;color:var(--dim)}
.foot ul a:hover,.foot__bottom a:hover{color:var(--tx)}
.foot li.todo{opacity:.45}
.foot__social{margin-top:22px;display:flex;gap:8px}
.foot__social a{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;border:1px solid var(--line-d);color:var(--dim);transition:background .2s,color .2s,border-color .2s}
.foot__social a:hover{background:#fff;color:#0a0c18;border-color:#fff}
.foot__social svg{width:16px;height:16px}
.foot__trust{margin-top:48px;display:flex;flex-wrap:wrap;align-items:center;gap:10px 26px;font-size:12.5px;color:var(--dim-2)}
.foot__trust span{display:inline-flex;align-items:center;gap:8px}
.foot__trust span::before{content:"";width:5px;height:5px;border-radius:50%;background:var(--blue)}
/* les deux dimensions sont posées ici comme en HTML (119 × 44) : cf. CLAUDE.md, piège 8 */
.foot__certs{height:44px;width:119px;opacity:.9;margin-right:10px}
.foot__bottom{margin-top:22px;padding-top:22px;border-top:1px solid var(--line-d);display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;font-size:12.5px;color:var(--dim-2)}
@media (max-width:960px){.foot__grid{grid-template-columns:1fr 1fr}.foot__brand{grid-column:1/-1}}

/* L'aurore : un bloc de hauteur nulle qui grandit quand on insiste en bas de page, et revient seul
   (js/v10.js). Dedans, une orbe bleue qui se lève, et le grand GALEON qu'un reflet traverse.
   Réglages retenus le 01/10 dans l'atelier de la V8 (pied.js, ?reglages) : lueur .95, taille ×1,8,
   hauteur 220, flou 66, #7eb8f6 sur #23468a, grain .09 — et le reflet « B ». */
.aurore{height:var(--d,0px);overflow:hidden;position:relative;z-index:1;background:#23468a}
.aurore__in{position:absolute;inset:0;-webkit-mask-image:linear-gradient(180deg,transparent 0,#000 150px);mask-image:linear-gradient(180deg,transparent 0,#000 150px)}
#v10-aurore.grain::before{-webkit-mask-image:linear-gradient(180deg,transparent 0,#000 150px);mask-image:linear-gradient(180deg,transparent 0,#000 150px)}
.aurore__ciel{--orbe:min(2124px,173vw);position:absolute;left:50%;bottom:calc(var(--orbe) * -1 + 220px);width:var(--orbe);height:var(--orbe);border-radius:50%;
  transform:translateX(-50%) translateY(calc((1 - var(--p,0)) * 90px));filter:blur(66px);
  background:radial-gradient(circle at 50% 24%,rgba(126,184,246,.741) 0%,rgba(92,134,180,.589) 16%,rgba(66,96,128,.437) 32%,rgba(47,68,91,.285) 48%,rgba(38,55,74,.133) 64%,rgba(35,52,69,0) 80%)}
.aurore__wrap{position:absolute;left:0;right:0;bottom:56px;padding:0 32px;pointer-events:none;z-index:3}
@media (max-width:640px){.aurore__wrap{padding:0 16px}}
.foot__mark{position:relative;max-width:calc(var(--w) - 64px);margin:0 auto;line-height:0;opacity:var(--p,0);transform:translateY(calc((1 - var(--p,0)) * 36px))}
.foot__mark svg{width:100%;height:auto}
.foot__mark svg path{fill:url(#v10FootGrad)}
.foot__mark > svg{opacity:.5}
/* le reflet : deux couches (un halo doux, un cœur fin qui tire vers le cyan) posées par js/v10.js,
   et deux étincelles, sur l'épaule de l'Ω puis sur le N. Sans script, le lettrage reste à .5. */
.reflet-couche{position:absolute;inset:0;pointer-events:none}
.reflet-couche svg{width:100%;height:auto;display:block}
.reflet-couche--halo svg path{fill:#fff !important;fill-opacity:.55}
.reflet-couche--coeur svg path{fill:url(#v10RefletCoeur) !important}
.reflet-etincelle{position:absolute;width:30px;height:30px;margin:-15px 0 0 -15px;opacity:0;pointer-events:none;transform:scale(.2) rotate(0deg)}
.reflet-etincelle--omega{left:13.8%;top:21%}.reflet-etincelle--n{left:97.5%;top:15.5%}
.reflet-etincelle.is-on{animation:refletEtinc .8s cubic-bezier(.2,.8,.2,1)}
@keyframes refletEtinc{0%{opacity:0;transform:scale(.2) rotate(0deg)}35%{opacity:1;transform:scale(1.1) rotate(35deg)}100%{opacity:0;transform:scale(.4) rotate(90deg)}}
/* le pied des pages d'une seule action (scripts/v10-gabarit.mjs, piedCampagne) : un logo qui ne mène nulle part */
.foot--campagne .foot__brand > span{display:inline-block;color:var(--tx)}
/* galeon:pied:end */

/* ─── PAGES INTÉRIEURES ──────────────────────────── */
/* L'en-tête court : le ton de la home (fond encre, lueur bleue, grand titre serré) sans la scène.
   Le visuel de droite est une image : un rendu du générateur 3D (/preview/generateur-3d/), une
   capture produit ou une photo — jamais une scène WebGL. */
.v-hero{position:relative;overflow:hidden;padding:calc(var(--nav-h) + clamp(56px,10vh,120px)) 0 clamp(64px,9vw,112px);
  background:radial-gradient(60% 70% at 78% 40%,rgba(71,154,243,.14),transparent 70%),radial-gradient(40% 50% at 10% 100%,rgba(90,209,230,.05),transparent 70%),var(--fond)}
.v-hero__grid{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:clamp(32px,5vw,80px);align-items:center}
.v-hero h1{font-size:clamp(40px,5.6vw,80px);letter-spacing:-.045em;line-height:.96;max-width:14ch}
.v-hero .lead{margin:24px 0 32px;font-size:clamp(15px,1.25vw,18px)}
.v-hero__row{display:flex;flex-wrap:wrap;gap:14px}
.v-hero__row .btn{height:48px;font-size:14.5px}
.v-hero__visuel{margin:0;border-radius:24px;overflow:hidden;aspect-ratio:4/3;background:rgba(255,255,255,.04);border:1px solid var(--line-d)}
.v-hero__visuel img,.v-hero__visuel video{width:100%;height:100%;object-fit:cover}
.v-hero--seul .v-hero__grid{grid-template-columns:1fr}
.v-hero--seul h1{max-width:18ch}
/* Haut de page d'une page de texte (mentions légales, confidentialité) : pas de halo, dont la fin nette
   traçait une ligne au bas du bandeau, et le texte suit le titre de près au lieu de deux marges cumulées. */
.v-hero--texte{background:var(--fond);padding-bottom:0}
.v-hero--texte + .v-sec{padding-top:clamp(32px,4vw,56px)}
@media (max-width:860px){.v-hero__grid{grid-template-columns:1fr}}
/* fil d'Ariane : seulement là où la page a un vrai parent — blog, guides, événements, fiches équipe
   (décision du 2026-10-15 ; v10-seo.mjs le contrôle). En tête du hero, à la même hauteur partout.
   Blanc à 60 % sur --fond : 6,1:1 (à 46 %, --dim-2, il tombait à 4,0:1, sous le seuil AA de 4,5:1). */
/* le rythme sous le fil, le même partout : fil, 22 px, l'étiquette (eyebrow, catégorie, date, pastille), 18 px, le titre */
.v-ariane{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 22px;padding:0;list-style:none;font-size:13px;color:rgba(var(--tx-rgb),.6)}
/* dans un hero à deux colonnes, la colonne qui porte le fil part du haut : centrée, elle le faisait
   descendre dès que l'autre colonne (formulaire, visuel) était plus haute, et le titre avec. */
.v-hero__grid>:has(>.v-ariane){align-self:start}
/* hero plein écran (journée, webinaire) : le fil, dans son propre .wrap en tête du hero, porte le haut
   de .v-hero ; le hero empile de haut en bas (flex en colonne), et la grille qui suit n'a plus de haut
   à elle — ses 22 px viennent du fil, sur une ligne comme sur deux. */
.v-ariane-haut{position:relative;z-index:3;padding-top:calc(var(--nav-h) + clamp(56px,10vh,120px))}
.v-ariane li+li::before{content:"/";margin-right:6px;opacity:.6}
.v-ariane a:hover{color:var(--tx)}

/* les sections : sombres par défaut, claires avec .light. On alterne, comme la home. */
.v-sec{position:relative;padding:clamp(72px,9vw,128px) 0}
.v-sec__tete{max-width:760px;margin:0 0 clamp(36px,5vw,64px)}
.v-sec__tete--centre{margin-left:auto;margin-right:auto;text-align:center}
.v-sec__tete--centre .eyebrow{justify-content:center}
.v-sec__tete--centre .lead{margin-left:auto;margin-right:auto}
.v-sec h2{font-size:clamp(30px,3.5vw,50px)}
.v-sec__tete .lead{margin:18px 0 0}
.v-sec h3{font-size:clamp(19px,1.6vw,23px);letter-spacing:-.02em;line-height:1.2}

/* cartes */
.v-grille{display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr))}
.v-carte{display:flex;flex-direction:column;gap:12px;padding:26px;border-radius:20px;background:rgba(255,255,255,.04);border:1px solid var(--line-d);transition:border-color .2s,background .2s}
a.v-carte:hover{border-color:rgba(140,194,255,.4);background:rgba(255,255,255,.06)}
.v-carte p{margin:0;font-size:14.5px;line-height:1.55;color:var(--dim)}
.v-carte__ic{width:44px;height:44px;border-radius:12px;display:grid;place-items:center;background:rgba(71,154,243,.14);color:var(--blue-l)}
.v-carte__ic svg{width:22px;height:22px}
.v-carte__lien{margin-top:auto;padding-top:6px;font-size:14px;font-weight:600;color:var(--blue-l)}
.light .v-carte{background:#fff;border-color:var(--line-l);box-shadow:0 1px 0 rgba(10,12,24,.02)}
.light a.v-carte:hover{border-color:rgba(47,127,220,.35);background:#fff}
.light .v-carte p{color:var(--ink-dim)}
.light .v-carte__ic{background:rgba(71,154,243,.12);color:var(--blue-d)}
.light .v-carte__lien{color:var(--blue-d)}
/* page Événements : la date au-dessus du titre ; un rendez-vous passé descend dans « Passés » (js/v10.js) */
.v-evt__quand{font-size:12.5px !important;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--blue-l) !important}
.light .v-evt__quand{color:var(--blue-d) !important}
.v-evt__vide{margin:0;font-size:16px;color:var(--ink-dim)}
.v-ecards + .v-evt__vide{margin-top:20px}
/* Page Événements : les années précédentes, en liste par année sous les cartes des rendez-vous passés */
.v-archives{margin-top:clamp(40px,6vw,64px);padding-top:clamp(28px,4vw,40px);border-top:1px solid var(--line-d);
  display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:28px 32px}
.v-archives__tete{grid-column:1/-1;margin:0;font-size:12px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--dim-2)}
.v-archives__an h3{margin:0 0 14px;font-size:clamp(26px,3vw,34px);font-weight:700;letter-spacing:-.02em;line-height:1}
.v-archives__an ul{margin:0;padding:0;list-style:none}
.v-archives__an li{display:grid;grid-template-columns:48px 1fr;column-gap:12px;padding:11px 0;border-top:1px solid var(--line-d)}
.v-archives__an time{grid-row:span 2;font-size:12.5px;font-weight:600;color:var(--blue-l);padding-top:2px}
.v-archives__an b{font-size:14.5px;font-weight:600;line-height:1.35}
.v-archives__an span{font-size:13px;color:var(--dim)}
@media (max-width:980px){.v-archives{grid-template-columns:repeat(2,minmax(0,1fr))}}
/* Les années se lisent de gauche à droite (2023 → 2026) ; sur une seule colonne, la plus récente
   remonte en tête, l'intertitre reste au-dessus. */
@media (max-width:640px){.v-archives{display:flex;flex-direction:column-reverse}.v-archives__tete{order:1}}
/* les rendez-vous en cartes photo, repris de la home A (preview/home-a, section « Nous rencontrer ») :
   la photo en 3:4, la date en pastille de verre, un panneau blanc posé dessus. « À venir » est un
   rail qui se translate carte par carte sous un cadre qui rogne (js/v10.js) — pas un conteneur
   défilant : un geste horizontal de trackpad l'emportait sur la page. « Passés » est une grille
   aux mêmes colonnes, pour qu'une carte qui y descend garde sa taille. */
.v-ecards__tete{display:flex;justify-content:space-between;align-items:flex-end;gap:20px 30px;flex-wrap:wrap;margin-bottom:clamp(28px,4vw,44px)}
.v-ecards__tete .v-sec__tete{margin:0}
.v-ecards__tete > .lead{max-width:34ch;margin:0}
.v-ecards__cadre{position:relative;overflow:hidden;padding-bottom:4px}
.v-ecards{display:grid;gap:16px;grid-template-columns:repeat(4,minmax(0,1fr))}
.v-ecards--rail{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:calc((100% - 48px) / 4);
  transform:translateX(var(--dx,0px));transition:transform .55s cubic-bezier(.4,0,.2,1)}
.v-ecard{position:relative;display:flex;align-items:flex-end;aspect-ratio:3/4;border-radius:16px;overflow:hidden;background:#dcd6c9;
  padding:0;border:0;font:inherit;text-align:left;color:inherit;cursor:pointer}
.v-ecard > img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .7s cubic-bezier(.2,.7,.3,1)}
.v-ecard:hover > img{transform:scale(1.05)}
.v-ecard::before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(to top,rgba(10,12,24,.55),transparent 46%)}
.v-ecard:focus-visible{outline:2px solid var(--blue);outline-offset:3px}
.v-ecard__date{position:absolute;top:0;left:0;z-index:2;margin:12px;padding:5px 10px;border-radius:7px;
  font-size:11.5px;font-weight:500;color:#fff;background:rgba(10,12,24,.55);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.v-ecard__panel{position:relative;z-index:2;display:block;width:calc(100% - 20px);margin:10px;padding:14px;border-radius:11px;background:#fff;color:#0a0c18}
.v-ecard__panel b{display:block;font-size:13.5px;font-weight:700;letter-spacing:-.01em;line-height:1.3}
.v-ecard__panel span{display:block;font-size:11.5px;color:var(--ink-dim);margin-top:2px}
.v-ecard__panel .v-ecard__lien{margin-top:12px;font-weight:600;color:var(--blue-d)}
.v-ecards__nav{display:flex;justify-content:center;gap:8px;margin-top:26px}
.v-ecards__nav[hidden]{display:none}
.v-ecards__nav button{width:38px;height:38px;border-radius:50%;border:1px solid var(--line-d);background:none;color:inherit;display:grid;place-items:center;cursor:pointer;transition:background .2s}
.v-ecards__nav button:hover{background:rgba(255,255,255,.08)}
.v-ecards__nav button[disabled]{opacity:.3;pointer-events:none}
.light .v-ecards__nav button{border-color:var(--line-l)}
.light .v-ecards__nav button:hover{background:rgba(10,12,24,.05)}
@media (max-width:1100px){.v-ecards:not(.v-ecards--rail){grid-template-columns:repeat(3,minmax(0,1fr))}.v-ecards--rail{grid-auto-columns:minmax(260px,calc((100% - 32px) / 3))}}
@media (max-width:760px){.v-ecards:not(.v-ecards--rail){grid-template-columns:repeat(2,minmax(0,1fr))}.v-ecards--rail{grid-auto-columns:minmax(230px,78%)}.v-ecards__tete{align-items:flex-start}}
@media (max-width:480px){.v-ecards:not(.v-ecards--rail){grid-template-columns:minmax(0,1fr)}}
@media (prefers-reduced-motion:reduce){.v-ecards--rail,.v-ecard > img{transition:none}}

/* chiffres */
.v-chiffres{display:grid;gap:clamp(20px,3vw,40px);grid-template-columns:repeat(auto-fit,minmax(min(100%,200px),1fr))}
.v-chiffre b{display:block;font-size:clamp(40px,4vw,56px);font-weight:700;letter-spacing:-.04em;line-height:1;
  background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.v-chiffre span{display:block;margin-top:10px;font-size:14px;line-height:1.45;color:var(--dim)}
.light .v-chiffre span{color:var(--ink-dim)}

/* texte et image côte à côte */
.v-duo{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(32px,6vw,88px);align-items:center}
.v-duo--inverse > :first-child{order:2}
.v-duo figure{margin:0;border-radius:20px;overflow:hidden}
.v-duo figure img{width:100%;height:auto}
.v-duo .lead{margin:18px 0 0}
.v-liste{margin:22px 0 0;padding:0;list-style:none;display:flex;flex-direction:column;gap:12px;font-size:15px;color:var(--dim)}
.v-liste li{display:flex;gap:12px;align-items:flex-start}
.v-liste li::before{content:"";flex:none;width:6px;height:6px;margin-top:.62em;border-radius:50%;background:var(--blue)}
.light .v-liste{color:var(--ink-dim)}
@media (max-width:860px){.v-duo{grid-template-columns:1fr}.v-duo--inverse > :first-child{order:0}}

/* texte long : mentions légales, confidentialité, guides lus en ligne */
.v-prose{max-width:72ch;font-size:16px;line-height:1.7}
.v-prose h2{font-size:clamp(24px,2.4vw,32px);margin:2.2em 0 .6em}
.v-prose h3{font-size:clamp(18px,1.5vw,21px);margin:1.8em 0 .5em}
.v-prose h2:first-child,.v-prose h3:first-child{margin-top:0}
.v-prose p,.v-prose ul,.v-prose ol{margin:0 0 1.1em}
.v-prose ul,.v-prose ol{padding-left:1.3em}
.v-prose li{margin:.35em 0}
.v-prose a{color:var(--blue-l);text-decoration:underline;text-underline-offset:3px;text-decoration-color:rgba(140,194,255,.4)}
.light .v-prose a{color:var(--blue-d);text-decoration-color:rgba(47,127,220,.35)}
.v-prose strong{font-weight:700}
.v-prose figure{margin:1.8em 0}
.v-prose figure img{display:block;width:100%;height:auto;border-radius:16px;border:1px solid var(--line-l)}
.v-prose .v-prose__note{margin-top:2em;padding-top:1.2em;border-top:1px solid var(--line-l);font-size:14px;color:var(--ink-dim)}

/* FAQ : <details> natif. Il s'ouvre sans script, à sa vraie hauteur (une réponse s'est déjà
   ouverte sur zéro pixel ailleurs sur le site : rien à calculer ici). */
.v-faq{max-width:860px;border-top:1px solid var(--line-d)}
.v-faq details{border-bottom:1px solid var(--line-d)}
.v-faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:20px;padding:22px 0;font-size:clamp(16px,1.3vw,18px);font-weight:600}
.v-faq summary::-webkit-details-marker{display:none}
.v-faq summary::after{content:"";flex:none;width:12px;height:12px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg) translateY(-3px);transition:transform .2s;opacity:.6}
.v-faq details[open] summary::after{transform:rotate(225deg) translateY(-3px)}
.v-faq details > div{padding:0 0 22px;color:var(--dim);font-size:15px;line-height:1.65;max-width:68ch}
.v-faq details > div p{margin:0 0 .8em}
.light .v-faq,.light .v-faq details{border-color:var(--line-l)}
.light .v-faq details > div{color:var(--ink-dim)}
/* Les FAQ au centre, sur tout le site (Simon, 16/10/2026) : le titre de la section qui les précède et la colonne
   des questions sur l'axe de la page ; le texte des réponses reste aligné à gauche, pour la lecture. Repérées par
   :has() : aucune page à retoucher, et une FAQ ajoutée demain l'est d'office. */
.v-faq{margin-left:auto;margin-right:auto}
.wrap:has(> .v-faq) > .v-sec__tete{margin-left:auto;margin-right:auto;text-align:center}
.wrap:has(> .v-faq) > .v-sec__tete .eyebrow{justify-content:center}
.wrap:has(> .v-faq) > .v-sec__tete .lead{margin-left:auto;margin-right:auto}

/* la bande d'appel, en bas de page : une carte encre sur fond clair, ou verre sur fond sombre */
.v-appel{position:relative;overflow:hidden;border-radius:28px;padding:clamp(36px,5vw,64px);display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:28px;
  background:radial-gradient(70% 120% at 100% 0%,rgba(71,154,243,.22),transparent 60%),var(--fond-2);color:var(--tx);border:1px solid var(--line-d)}
.v-appel h2{font-size:clamp(26px,3vw,40px);max-width:20ch}
.v-appel p{margin:12px 0 0;color:var(--dim);max-width:52ch}
.v-appel__row{display:flex;flex-wrap:wrap;gap:12px}
.v-appel .btn--ghost{border-color:rgba(255,255,255,.5);color:var(--tx)}

/* la bande d'appel « prise de contact » (v-appel--demo), reprise de la maquette home-a (13/10) :
   centrée, les deux commerciaux en tête, le titre DE LA PAGE, puis le texte, les boutons et les
   certifications, qui sont les mêmes partout et écrits par scripts/v10-gabarit.mjs entre les
   marqueurs galeon:v10:appel (le titre reste hors marqueurs). L'ordre visuel est posé ici : le
   titre est le premier enfant dans le HTML, l'équipe et le surtitre s'affichent au-dessus. */
.v-appel--demo{flex-direction:column;flex-wrap:nowrap;justify-content:center;text-align:center;gap:0;
  background:radial-gradient(60% 90% at 50% 0%,rgba(71,154,243,.26),transparent 70%),linear-gradient(180deg,var(--fond-2),var(--fond));
  box-shadow:0 30px 80px -30px rgba(11,16,32,.55)}
.v-appel--demo h2{order:2;max-width:22ch;margin:0 auto;font-size:clamp(26px,3.1vw,42px);line-height:1.08}
.v-appel--demo .v-appel__equipe{order:0;align-self:center;display:inline-flex;align-items:center;gap:10px;padding:5px 16px 5px 5px;margin-bottom:22px;
  border-radius:999px;background:rgba(255,255,255,.05);border:1px solid var(--line-d);font-size:13px;color:var(--dim);transition:background .2s,border-color .2s}
.v-appel--demo .v-appel__equipe:hover{background:rgba(255,255,255,.08);border-color:rgba(71,154,243,.4)}
.v-appel__tetes{display:flex;line-height:0}
.v-appel__tetes img{width:30px;height:30px;border-radius:50%;object-fit:cover;border:2px solid var(--fond-2);transition:transform .2s}
.v-appel__tetes img+img{margin-left:-11px}
.v-appel__tetes img:hover{position:relative;z-index:1;transform:translateY(-2px) scale(1.06)}
.v-appel__equipe i{width:7px;height:7px;border-radius:50%;background:#34d399;box-shadow:0 0 0 3px rgba(52,211,153,.18)}
.v-appel__equipe b{color:var(--tx);font-weight:600}
.v-appel--demo .eyebrow{order:1;justify-content:center;margin:0 auto 14px;color:var(--blue-l)}
.v-appel--demo p.v-appel__texte{order:3;margin:16px auto 0;max-width:52ch;color:var(--dim)}
.v-appel--demo .v-appel__row{order:4;justify-content:center;margin-top:26px}
.v-appel--demo .btn--solid{background:var(--blue);border-color:var(--blue);color:#06101f}
.v-appel--demo .btn--solid:hover{background:var(--blue-l);border-color:var(--blue-l)}
.v-appel--demo .btn--ghost{background:rgba(255,255,255,.07);border-color:rgba(255,255,255,.28);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.v-appel--demo .btn--ghost:hover{background:rgba(255,255,255,.15);border-color:rgba(255,255,255,.5)}
.v-appel__certs{order:5;display:flex;flex-wrap:wrap;justify-content:center;gap:6px 14px;margin:22px auto 0;padding:0;list-style:none;font-size:12.5px;color:var(--dim-2)}
.v-appel__certs li{display:inline-flex;align-items:center;gap:14px}
.v-appel__certs li+li::before{content:"";width:3px;height:3px;border-radius:50%;background:rgba(255,255,255,.4)}
.v-appel--demo .v-appel__equipe{white-space:nowrap}
@media (max-width:520px){
  .v-appel--demo{padding:32px 20px}
  .v-appel--demo .v-appel__equipe{font-size:12px;gap:8px;padding-right:12px}
  .v-appel__certs{gap:6px 16px}
  .v-appel__certs li+li::before{display:none}
}

/* témoignages : des citations, et des vidéos qui s'ouvrent sur YouTube (rien ne part vers YouTube
   avant le clic : la vignette est une image d'ici) */
.v-citations{display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr))}
.v-citation{margin:0;display:flex;flex-direction:column;justify-content:space-between;gap:20px;padding:26px;border-radius:20px;background:rgba(255,255,255,.04);border:1px solid var(--line-d)}
.v-citation blockquote{margin:0;font-size:16px;line-height:1.6;color:var(--tx)}
.v-citation figcaption{display:flex;align-items:center;justify-content:space-between;gap:14px;font-size:13px;color:var(--dim)}
.v-citation figcaption img{height:28px;width:auto;max-width:110px;object-fit:contain;filter:brightness(0) invert(1);opacity:.8}
.v-citation--une{grid-column:1/-1;padding:clamp(28px,4vw,48px)}
.v-citation--une blockquote{font-size:clamp(20px,2.2vw,28px);line-height:1.35;letter-spacing:-.01em}
.v-videos{display:grid;gap:12px;grid-template-columns:repeat(auto-fill,minmax(min(100%,220px),1fr));margin-top:16px}
.v-video{position:relative;display:block;border-radius:16px;overflow:hidden;aspect-ratio:43/26;background:#0c142a}
.v-video img{width:100%;height:100%;object-fit:cover;transition:transform .5s cubic-bezier(.2,.8,.2,1)}
.v-video:hover img{transform:scale(1.04)}
.v-video::after{content:"";position:absolute;left:50%;top:50%;width:52px;height:52px;margin:-26px 0 0 -26px;border-radius:50%;
  background:rgba(255,255,255,.92) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M9 6.5v11l9-5.5z' fill='%23161d31'/%3E%3C/svg%3E") center/22px no-repeat;box-shadow:0 10px 30px rgba(0,0,0,.35)}
.light .v-citation{background:#fff;border-color:var(--line-l)}
.light .v-citation blockquote{color:#0a0c18}
.light .v-citation figcaption{color:var(--ink-dim)}
.light .v-citation figcaption img{filter:none;opacity:1}

/* les établissements : une bande de logos, en couleur sur fond clair, en blanc sur fond sombre */
.v-logos{display:grid;gap:18px 28px;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));align-items:center;margin:0;padding:0;list-style:none}
.v-logos li{display:flex;align-items:center;justify-content:center;height:56px}
.v-logos img{max-height:44px;max-width:130px;width:auto;height:auto;object-fit:contain}
.v-sec:not(.light) .v-logos img{filter:brightness(0) invert(1);opacity:.78}

/* les établissements en carrousel : deux rangées qui défilent en sens opposé (pause au survol, immobiles
   en mouvement réduit). Le fond suit la section : en couleur sur fond clair, en blanc sur fond sombre.
   En blanc, un logo fait d'aplats de couleur devient un bloc plein : il lui faut sa version blanche
   (bluets-blanc, montceau-blanc), posée dans le HTML des sections sombres. */
.defiles{display:grid;gap:18px;-webkit-mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent);mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent)}
.defile{display:flex;overflow:hidden}
.defile__piste{flex:none;display:flex;align-items:center;gap:56px;margin:0;padding:0 28px;list-style:none;animation:defile 46s linear infinite}
.defile--d .defile__piste{animation-direction:reverse;animation-duration:52s}
.defiles:hover .defile__piste{animation-play-state:paused}
.defile__piste li{flex:none;height:56px;display:flex;align-items:center}
/* hauteur fixe, pas max-height : un SVG sans width/height (caen.svg) tombait à 0 px de large */
.defile__piste img{height:42px;max-width:150px;width:auto;object-fit:contain}
@keyframes defile{to{transform:translateX(-100%)}}
@media (prefers-reduced-motion:reduce){.defile__piste{animation:none}.defile{flex-wrap:wrap;justify-content:center}.defile__piste[aria-hidden]{display:none}.defiles{-webkit-mask-image:none;mask-image:none}}
.v-sec:not(.light) .defile__piste img{filter:brightness(0) invert(1);opacity:.78}

/* ce que fait le DPI, en pastilles */
.v-pastilles{display:flex;flex-wrap:wrap;gap:10px;margin:0;padding:0;list-style:none}
.v-pastilles li{display:inline-flex;align-items:center;height:42px;padding:0 18px;border-radius:999px;font-size:14.5px;font-weight:600;background:rgba(255,255,255,.06);border:1px solid var(--line-d)}
.light .v-pastilles li{background:#fff;border-color:var(--line-l);color:#0a0c18}

/* un formulaire posé dans la page (contact, guide à télécharger) : une carte claire, quel que soit le fond.
   Il est envoyé par galeon-forms.js : .w-form, .w-form-done et .w-form-fail sont SES repères (les noms
   viennent de Webflow), pas des classes Webflow chargées ici. */
.v-form{background:var(--paper-2);color:var(--ink);border-radius:22px;padding:clamp(22px,3vw,34px);box-shadow:0 30px 80px rgba(0,0,0,.25)}
.v-form h2,.v-form h3{font-size:clamp(20px,1.8vw,24px);letter-spacing:-.02em;line-height:1.2;margin:0 0 6px;color:var(--ink)}
.v-form .hint{font-size:13.5px;color:var(--ink-dim);margin:0 0 18px;line-height:1.5}
.v-form form{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:4px 14px}
.v-form .field--full,.v-form .btn,.v-form .accord,.v-form .note{grid-column:1/-1}
.v-form textarea{min-height:110px;padding:10px 11px;border:1px solid var(--line-l);border-radius:9px;font-size:14px;background:#fff;color:var(--ink);width:100%;resize:vertical}
.v-form textarea:focus{outline:none;border-color:var(--blue);box-shadow:0 0 0 3px rgba(71,154,243,.14)}
.v-form .btn{height:48px;margin-top:6px;justify-content:center}
.v-form .note{font-size:12px;color:var(--ink-dim);margin:8px 0 0}
.v-form--seul form{grid-template-columns:1fr}
@media (max-width:560px){.v-form form{grid-template-columns:1fr}}
.w-form-done,.w-form-fail{display:none}
.w-form-done{padding:18px 20px;border-radius:14px;background:rgba(71,154,243,.1);border:1px solid rgba(71,154,243,.3);color:var(--ink);font-size:14.5px;line-height:1.5}
.w-form-done b{display:block;margin-bottom:4px}
.w-form-done a{color:var(--blue-d);font-weight:600;text-decoration:underline;text-underline-offset:3px}
.w-form-fail{margin-top:10px;font-size:13px;color:#c0392b}

/* les coordonnées : courriel, réseau, adresse */
.v-coord{margin:24px 0 0;padding:0;list-style:none;display:grid;gap:12px}
.v-coord a{display:flex;align-items:center;gap:12px;font-size:15px;color:var(--tx)}
.v-coord a:hover{color:var(--blue-l)}
.v-coord svg{flex:none;width:20px;height:20px;color:var(--blue-l)}

/* les signes d'un guide : une liste numérotée */
.v-signes{counter-reset:signe;display:grid;gap:12px;margin:0;padding:0;list-style:none}
.v-signes li{counter-increment:signe;display:flex;align-items:center;gap:18px;padding:18px 22px;border-radius:16px;background:rgba(255,255,255,.04);border:1px solid var(--line-d);font-size:clamp(16px,1.3vw,18px);font-weight:600}
.v-signes li::before{content:counter(signe);flex:none;width:38px;height:38px;border-radius:50%;display:grid;place-items:center;background:var(--grad);color:#fff;font-weight:700}
.light .v-signes li{background:#fff;border-color:var(--line-l)}

/* un tableau de comparaison (avant / avec Galeon) : défile à l'horizontale sur téléphone, sans déborder */
.v-table{overflow-x:auto;border-radius:18px;border:1px solid var(--line-l);background:#fff}
.v-table table{width:100%;min-width:640px;border-collapse:collapse;font-size:14.5px;color:#0a0c18}
.v-table th,.v-table td{padding:14px 18px;text-align:left;border-bottom:1px solid var(--line-l);vertical-align:top}
.v-table thead th{font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-dim);background:var(--paper-2)}
.v-table tbody th{font-weight:600}
.v-table td.non{color:rgba(10,12,24,.4)}
@media (max-width:640px){.v-table table{min-width:0;font-size:13.5px}.v-table th,.v-table td{padding:12px 10px}.v-table tr>:nth-child(2){display:none}}
.v-table td.oui{color:var(--blue-d);font-weight:600}
.v-table tr:last-child th,.v-table tr:last-child td{border-bottom:0}
.v-sec:not(.light) .v-table{border-color:var(--line-d)}

/* ─── PRISE DE CONTACT (js/v10-contact.js) ───────── */
/* Un appel de qualification, jamais une démo d'emblée. Reprise de la V10, qui la tenait de /preview/home-a/. */
.ov{position:fixed;inset:0;z-index:200;background:rgba(4,6,12,.82);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);display:none;align-items:center;justify-content:center;padding:24px}
.ov.is-open{display:flex;animation:ovIn .25s cubic-bezier(.2,.7,.2,1) both}
.ov__close{position:absolute;top:18px;right:20px;width:38px;height:38px;border-radius:50%;background:rgba(255,255,255,.12);color:var(--tx);display:grid;place-items:center;z-index:2}
.book{width:min(1060px,100%);max-height:min(90vh,100%);overflow:auto;overflow-x:hidden;background:var(--paper-2);color:var(--ink);border-radius:22px;display:grid;grid-template-columns:.68fr 1.32fr}
.ov.is-open .book{animation:bookIn .5s cubic-bezier(.2,.8,.2,1) both}
.ov.is-open .book__side{animation:bookSide .6s .08s cubic-bezier(.2,.8,.2,1) both}
@keyframes ovIn{from{opacity:0}to{opacity:1}}
@keyframes bookIn{from{opacity:0;transform:translateY(28px) scale(.96)}to{opacity:1;transform:none}}
@keyframes bookSide{from{opacity:0;transform:translateX(-18px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.ov.is-open,.ov.is-open .book,.ov.is-open .book__side{animation:none}}
.book .btn{justify-content:center}
.book .h-sm{margin:0;font-size:22px;line-height:1.2;letter-spacing:-.02em}
.book .small{font-size:12.5px}
.book .eyebrow{color:var(--blue-l)}
.book__side{background:var(--ink);color:var(--tx);padding:30px;display:flex;flex-direction:column;gap:18px;border-radius:22px 0 0 22px}
.book__side ul{list-style:none;margin:8px 0 0;padding:0;display:grid;gap:11px;font-size:13.5px;color:var(--dim)}
.book__side li{display:flex;gap:10px;align-items:flex-start}
.book__side .small{color:var(--dim-2);margin-top:auto}
.book__who{display:flex;align-items:center;gap:12px;margin-top:4px}
.book__who > span{display:flex}
.book__who img{width:44px;height:44px;border-radius:50%;object-fit:cover;border:2px solid rgba(255,255,255,.2)}
.book__who img+img{margin-left:-16px}
.book__who div b{display:block;font-size:14px;font-weight:700}
.book__who div span{font-size:12.5px;color:var(--dim-2)}
.book__main{display:flex;flex-direction:column;min-width:0}
.book__steps{display:grid;grid-template-columns:1fr 1fr;border-bottom:1px solid var(--line-l);padding:0 12px}
.book__step{padding:18px 16px 15px;font-size:13.5px;font-weight:700;color:rgba(10,12,24,.38);display:flex;align-items:center;gap:9px;border-bottom:2px solid transparent;margin-bottom:-1px}
.book__step i{width:20px;height:20px;border-radius:50%;display:grid;place-items:center;flex:none;font-size:11px;font-weight:700;font-style:normal;background:rgba(10,12,24,.08);color:rgba(10,12,24,.45)}
.book__step.is-on{color:var(--ink);border-bottom-color:var(--ink)}
.book__step.is-on i{background:var(--ink);color:var(--tx)}
.book__step.is-done{color:var(--ink-dim);cursor:pointer}
.book__step.is-done i{background:var(--blue);color:#06101f}
.book__form{padding:28px;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:4px 14px;align-content:start}
.book__form .field--full,.book__form .err,.book__form .btn,.book__form .hint,.book__form .accord{grid-column:1/-1}
.book__form .hint{font-size:13px;color:var(--ink-dim);margin:0 0 10px;line-height:1.5}
.field{display:grid;gap:5px;margin-bottom:11px}
.field label{font-size:11.5px;font-weight:700;letter-spacing:.02em;color:rgba(10,12,24,.55)}
.field label i{color:#e0483c;font-style:normal}
.field input,.field select,.book__form textarea{border:1px solid var(--line-l);border-radius:9px;font-size:14px;background:#fff;color:var(--ink);width:100%;transition:border-color .15s}
.field input,.field select{height:42px;padding:0 11px}
.book__form textarea{min-height:84px;padding:10px 11px;resize:vertical}
.field input:focus,.field select:focus,.book__form textarea:focus{outline:none;border-color:var(--blue);box-shadow:0 0 0 3px rgba(71,154,243,.14)}
.field--tel{display:grid;grid-template-columns:96px 1fr;gap:7px}
.field.is-bad input,.accord.is-bad{border-color:#e0483c;background:#fff6f5}
.err{display:none;font-size:12px;color:#c0392b;margin:-6px 0 10px;line-height:1.35}
.err.is-on{display:block}
.topics{display:flex;flex-wrap:wrap;gap:6px}
/* le bouton radio est caché DANS son étiquette, ancré à elle : sans ça il héritait de .field input
   (width:100 %) et débordait de 1 000 px à droite de la fenêtre */
.topics label{position:relative;display:inline-flex;align-items:center;height:34px;padding:0 13px;border-radius:999px;border:1px solid var(--line-l);background:#fff;font-size:13px;font-weight:600;color:var(--ink-dim);cursor:pointer;transition:.15s;letter-spacing:0}
.topics input{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;pointer-events:none}
.topics label:has(input:checked){background:var(--ink);border-color:var(--ink);color:var(--tx)}
.topics label:has(input:focus-visible){outline:2px solid var(--blue);outline-offset:2px}
.accord{display:flex;gap:10px;align-items:flex-start;margin:4px 0 12px;padding:10px 12px;border:1px solid transparent;border-radius:9px;font-size:12.5px;line-height:1.45;color:var(--ink-dim);cursor:pointer}
.accord input{flex:none;width:16px;height:16px;margin:1px 0 0;accent-color:var(--ink)}
.accord a{color:var(--ink);text-decoration:underline;text-underline-offset:2px}
.book__slots{padding:24px 28px 26px}
.book__slots[hidden]{display:none}
.book__slots .hint{font-size:13px;color:var(--ink-dim);margin:0 0 14px;line-height:1.5}
.book__days{display:flex;gap:8px;overflow:auto;padding-bottom:6px;margin:0 0 18px;scrollbar-width:none}
.book__days::-webkit-scrollbar{display:none}
.day{flex:none;min-width:74px;border:1px solid var(--line-l);border-radius:11px;padding:10px 10px 9px;text-align:center;transition:.18s;background:#fff;cursor:pointer}
.day:hover{border-color:var(--ink)}
.day.is-on{background:var(--ink);color:var(--tx);border-color:var(--ink)}
.day b{display:block;font-size:16px;font-weight:700}
.day span{font-size:10.5px;letter-spacing:.06em;text-transform:uppercase;opacity:.65}
.day small{display:block;font-size:10px;font-weight:700;letter-spacing:.04em;color:var(--blue-d);margin-top:2px;height:12px}
.day.is-on small{color:var(--blue-l)}
.slots{display:grid;gap:14px}
.slots__g small{display:block;font-size:11.5px;font-weight:700;letter-spacing:.02em;color:rgba(10,12,24,.55);margin-bottom:7px}
.slots__row{display:grid;grid-template-columns:repeat(auto-fill,minmax(78px,1fr));gap:7px}
.slot{border:1px solid var(--line-l);border-radius:9px;height:40px;font-size:13.5px;font-weight:500;background:#fff;transition:.18s;cursor:pointer}
.slot:hover{border-color:var(--ink)}
.slot.is-on{background:var(--blue);border-color:var(--blue);color:#06101f;font-weight:700}
.routed{display:flex;align-items:center;gap:11px;margin:16px 0 0;padding:11px 13px;border-radius:11px;background:rgba(71,154,243,.1);border:1px solid rgba(71,154,243,.28)}
.routed img{width:38px;height:38px;border-radius:50%;object-fit:cover;flex:none}
.routed b{display:block;font-size:13.5px;font-weight:700}
.routed span{font-size:12.5px;color:var(--ink-dim)}
[data-confirm]:disabled{opacity:.45;cursor:default}
.book__alt{display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px 16px;margin-top:14px}
.linkbtn{font-size:12.5px;font-weight:600;color:var(--ink-dim);text-decoration:underline;text-underline-offset:3px;text-decoration-color:rgba(10,12,24,.25)}
.linkbtn:hover{color:var(--ink)}
.ok{display:none;text-align:center;padding:40px 24px}
.ok.is-on{display:flex;flex-direction:column;align-items:center;justify-content:center;flex:1;min-height:420px}
.ok__badge{width:54px;height:54px;border-radius:50%;background:rgba(71,154,243,.16);color:var(--blue-d);display:grid;place-items:center;margin:0 auto 14px;font-size:22px}
.ok p{color:var(--ink-dim);margin:10px auto 0;max-width:42ch}
.book__echec{display:none;margin:10px 0 0;font-size:12.5px;color:#c0392b;grid-column:1/-1}
.book__echec.is-on{display:block}
@media (max-width:860px){
  .book{grid-template-columns:1fr}
  /* sur téléphone le panneau sombre se réduit à qui rappelle : entier, il occupait tout le premier
     écran et le bouton d'envoi tombait à 1 443 px (mesuré à 375 × 812 le 13/10/2026) */
  .book__side{border-radius:22px 22px 0 0;padding:16px 20px;gap:10px}
  .book__side .h-sm{font-size:18px}
  .book__side .eyebrow,.book__side ul,.book__side .small{display:none}
  .book__side .book__who{margin-top:0}
  .book__form{grid-template-columns:1fr;padding:20px}
  .book__slots{padding:20px}
  .book__step{padding:14px 10px 12px;font-size:12.5px}
}
.book__pourquoi{margin:5px 0 0;font-size:11.5px;line-height:1.4;color:var(--ink-dim)}
/* Fenêtre de contact, mode « démo » (js/v10-contact.js) : seulement sur les pages qui portent body[data-contact-demo].
   .ov--v2 : la page l'a demandé (panneau de la bande d'appel, portrait recadré) ; .ov--demo : ouverte depuis un bouton de démo
   (ni rôle, ni sujet, ni message ; le créneau visible dès l'ouverture, flou, qui se précise à mesure qu'on remplit). */
/* le panneau : le fond de la bande d'appel (.v-appel) — marine, halo bleu en haut à droite —, pas un aplat de bleu vif */
.ov--v2 .book__side{background:radial-gradient(80% 60% at 100% 0%,rgba(71,154,243,.22),transparent 62%),var(--fond-2);border-right:1px solid var(--line-d)}
.ov--demo .book__steps,.ov--demo .field--qualif,.ov--demo .book__slots.is-verrou .book__alt{display:none}
.ov--demo .book__form{padding-bottom:10px}
.ov--demo .book__slots{position:relative;margin:0 28px;padding:22px 0 26px;border-top:1px solid var(--line-l)}
.ov--demo .book__slots > :not(.book__verrou){transition:filter .7s cubic-bezier(.2,.8,.2,1),opacity .7s}
.ov--demo .book__slots.is-verrou > :not(.book__verrou){filter:blur(calc(1px + (1 - var(--k,0)) * 2.6px)) saturate(calc(.4 + var(--k,0) * .6));opacity:calc(.62 + var(--k,0) * .3);user-select:none}
.book__verrou{display:none}
.ov--demo .book__slots.is-verrou .book__verrou{position:absolute;z-index:2;left:50%;top:108px;transform:translate(-50%,-50%);display:flex;align-items:center;gap:11px;
  padding:9px 18px 9px 9px;border-radius:999px;background:rgba(255,255,255,.94);white-space:nowrap;
  box-shadow:0 0 0 1px var(--line-l),0 14px 34px -12px rgba(16,40,96,.4)}
.book__cadenas{flex:none;width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:var(--ink);color:#fff;transition:background .3s}
.book__cadenas svg{width:16px;height:16px}
.book__verrou b{display:block;font-size:13.5px;font-weight:700;color:var(--ink)}
.book__verrou small{display:block;font-size:12px;color:var(--ink-dim)}
.ov--demo .book__slots.is-pret .book__cadenas{background:var(--blue-d)}
.book__resume{margin:22px 28px 0;padding:11px 14px;border-radius:11px;background:#fff;border:1px solid var(--line-l);display:flex;align-items:center;gap:10px;font-size:13px;color:var(--ink-dim)}
.book__resume[hidden]{display:none}
.book__resume b{color:var(--ink);font-weight:700}
.book__resume-ok{flex:none;width:22px;height:22px;border-radius:50%;display:grid;place-items:center;background:rgba(71,154,243,.16);color:var(--blue-d);font-size:12px;font-weight:700}
.ov--demo .book__slots:not(.is-verrou){border-top:0}
@media (max-width:760px){.ov--demo .book__slots{margin:0 20px}.book__resume{margin:16px 20px 0}.ov--demo .book__slots.is-verrou .book__verrou{white-space:normal;width:max-content;max-width:90%}}
@media (prefers-reduced-motion:reduce){.ov--demo .book__slots > :not(.book__verrou){transition:none}}

/* La version « un seul écran » (test A/B fenetre-contact) : une colonne étroite, trois champs, un
   moment en quatre boutons. Les champs, puces et messages d'erreur sont ceux de la version actuelle. */
.book.book--un{display:flex;flex-direction:column;width:min(520px,100%)}
.un__corps{padding:30px 32px 22px}
.un__corps[hidden]{display:none}
.un__tete{display:flex;gap:16px;align-items:center;margin-bottom:22px}
.un__duo{display:flex;flex:none}
.un__duo img{width:52px;height:52px;border-radius:50%;object-fit:cover;border:3px solid var(--paper-2)}
.un__duo img+img{margin-left:-14px}
.book--un h2{font-size:24px;letter-spacing:-.025em;line-height:1.15;margin:0;color:var(--ink)}
.un__tete p{margin:4px 0 0;font-size:13.5px;line-height:1.45;color:var(--ink-dim)}
.book--un form{display:flex;flex-direction:column}
.book--un .field.is-bad input{border-color:#e0483c;background:#fff6f5}
.un__qui{display:flex;align-items:center;gap:8px;margin:5px 0 0;font-size:12.5px;line-height:1.4;color:var(--ink-dim)}
.un__qui img{width:22px;height:22px;border-radius:50%;object-fit:cover;flex:none}
.un__l{font-size:11.5px;font-weight:700;letter-spacing:.02em;color:rgba(10,12,24,.55)}
.un__quand{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}
.un__quand button{min-height:44px;padding:4px 6px;border-radius:10px;border:1px solid var(--line-l);background:#fff;font-size:12.5px;font-weight:600;line-height:1.2;color:var(--ink-dim);transition:.15s}
.un__quand button:hover{border-color:var(--ink)}
.un__quand button.is-on{background:var(--ink);border-color:var(--ink);color:var(--tx)}
.book--un .btn{height:52px;margin-top:6px}
.book--un .btn:disabled{opacity:.6;cursor:default}
.un__ok{text-align:center;padding-top:36px}
.un__ok .ok__badge{margin:0 auto 14px}
.un__ok > p{margin:8px auto 18px;max-width:36ch;font-size:14.5px;color:var(--ink-dim)}
.un__ok > .btn{display:inline-flex;width:auto;padding:0 22px;height:46px}
.un__ok > .btn[hidden]{display:none}
.un__prep{margin-top:22px;padding:18px;border-radius:16px;background:#fff;border:1px solid var(--line-l);text-align:left;display:flex;flex-direction:column}
.un__prep[hidden]{display:none}
.un__prep-t{margin:0 0 12px;font-size:14px;font-weight:700;color:var(--ink)}
.un__prep-t span{margin-left:6px;font-size:11px;font-weight:600;color:var(--ink-dim);text-transform:uppercase;letter-spacing:.06em}
.un__prep textarea{min-height:70px;padding:10px 11px;border:1px solid var(--line-l);border-radius:9px;font-size:14px;resize:vertical;width:100%;background:#fff;color:var(--ink)}
.un__merci{margin:20px 0 0;padding:14px;border-radius:12px;background:rgba(71,154,243,.1);font-size:14px;color:var(--ink)}
.un__pied{display:flex;justify-content:space-between;flex-wrap:wrap;gap:6px 16px;padding:14px 32px;border-top:1px solid var(--line-l);background:#fff;border-radius:0 0 22px 22px;font-size:12.5px;font-weight:600;color:var(--ink-dim)}
.un__pied a:hover{color:var(--ink)}
@media (max-width:520px){
  .un__corps{padding:24px 20px 18px}
  .un__tete{flex-direction:column;align-items:flex-start;gap:12px;margin-bottom:16px}
  .un__quand{grid-template-columns:1fr 1fr}
  .un__pied{padding:12px 20px}
}

/* ── Graphiques d'étude (v-graph) : barres en HTML, lisibles sans script et par les moteurs ── */
.v-etude{margin-top:clamp(48px,6vw,80px)}
.v-graph{margin:clamp(28px,4vw,48px) 0;display:grid;gap:18px}
.v-graph--duo{grid-template-columns:repeat(auto-fit,minmax(min(100%,440px),1fr))}
.v-graph__pan{background:#fff;border:1px solid var(--line-l);border-radius:20px;padding:clamp(20px,2.6vw,30px);display:flex;flex-direction:column;gap:14px;color:#0a0c18}
.v-graph__q{margin:0;font-size:16px;font-weight:700;line-height:1.4;letter-spacing:-.01em}
.v-graph__base{margin:-8px 0 4px;font-size:12.5px;color:var(--ink-dim)}
.v-graph__barres{display:grid;gap:10px}
.v-graph__total{position:relative;display:grid;gap:10px;padding:26px 12px 12px;border:1.5px dashed rgba(47,127,220,.4);border-radius:14px;margin:10px 0 4px}
.v-graph__tag{position:absolute;top:-11px;left:12px;padding:3px 10px;border-radius:999px;background:var(--blue-d);color:#fff;font-size:11px;font-weight:600;letter-spacing:.06em;text-transform:uppercase}
.v-graph__tag b{font-weight:800}
.v-barre{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1.3fr) 3.4em;align-items:center;gap:12px;font-size:13.5px;line-height:1.35}
.v-barre__piste{height:12px;border-radius:999px;background:rgba(10,12,24,.05);overflow:hidden}
.v-barre__piste i{display:block;height:100%;border-radius:inherit;background:var(--c)}
.v-barre__v{font-weight:700;font-variant-numeric:tabular-nums;text-align:right;white-space:nowrap}
.v-barre--o2{--c:var(--blue-d)}.v-barre--o1{--c:var(--blue-l)}.v-barre--n1{--c:#a7afbf}.v-barre--n2{--c:#5b6478}.v-barre--ns{--c:#d9dee7}
.v-barre--b1{--c:#2f7fdc}.v-barre--b2{--c:#479af3}.v-barre--b3{--c:#79b6f7}.v-barre--b4{--c:#a8cff9}.v-barre--gr{--c:#a7afbf}
.v-graph__fait{margin-top:6px;padding:18px 20px;border-radius:14px;background:var(--paper)}
.v-graph__fait>b{display:block;font-size:clamp(24px,2.4vw,30px);font-weight:800;letter-spacing:-.03em;line-height:1.1;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.v-graph__fait>p{margin:6px 0 0;font-size:14px;line-height:1.5;color:var(--ink-dim)}
.v-graph__st{margin:16px 0 8px;font-size:12px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:rgba(10,12,24,.55)}
.v-graph__sous{display:grid;gap:7px}
.v-graph__sous .v-barre{font-size:12.5px}
@media (min-width:900px){.v-graph--seul .v-graph__pan{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);column-gap:32px;align-items:start}
.v-graph--seul .v-graph__q,.v-graph--seul .v-graph__base{grid-column:1/-1}.v-graph--seul .v-graph__fait{margin-top:0}}
.v-graph figcaption{grid-column:1/-1;font-size:12px;color:var(--ink-dim)}
@media (max-width:560px){.v-barre{grid-template-columns:minmax(0,1fr) 3.2em;row-gap:5px}.v-barre__l{grid-column:1/-1}}
/* ── Guides (v-guide) : couverture, sommaire numéroté, emplacement de l'outil du hub ── */
.v-guide__cover{margin:0;justify-self:center}
.v-guide__cover img{display:block;width:100%;max-width:380px;height:auto;border-radius:14px;box-shadow:0 30px 70px rgba(10,12,24,.2)}
.v-liste--num{counter-reset:n}
.v-liste--num li::before{counter-increment:n;content:counter(n);width:24px;height:24px;margin-top:0;border-radius:50%;background:var(--blue-d);color:#fff;font-size:12px;font-weight:700;display:grid;place-items:center}
.v-guide__outil{max-width:880px}

/* ── Tableaux dans une colonne de lecture (pages de service : données collectées, cookies) ── */
.v-prose__tableau{overflow-x:auto;margin:1.2em 0 1.8em;border-radius:14px;box-shadow:0 0 0 1px var(--line-l);background:#fff}
.v-prose table{width:100%;min-width:560px;border-collapse:collapse;font-size:14px;line-height:1.5;color:#0a0c18}
.v-prose th,.v-prose td{padding:11px 13px;text-align:left;vertical-align:top;border-bottom:1px solid var(--line-l)}
.v-prose th{background:var(--paper-2);font-weight:600}
.v-prose tr:last-child td{border-bottom:0}
/* Tableau trop large pour la colonne de texte (garanties HDS) : il en sort, sur toute la largeur du conteneur */
.v-prose__tableau--large{width:min(calc(var(--w) - 64px),calc(100vw - 80px))}
@media (max-width:640px){.v-prose__tableau--large{width:calc(100vw - 32px)}}
/* Mentions légales et confidentialité : posées sur fond SOMBRE depuis le 13/10/2026 (la dernière section
   avant le pied de page est sombre). L'encre #1a1f2e, écrite pour le fond clair d'origine, y rendait le
   texte quasi invisible ; elle ne vaut plus que sous .light. */
.v-prose--legal{color:rgba(var(--tx-rgb),.82)}
.v-prose--legal :is(h2,h3,strong){color:var(--tx)}
.v-prose--legal h2{font-size:clamp(20px,1.8vw,24px)}
.v-prose--legal .v-prose__tableau{background:rgba(255,255,255,.03);box-shadow:0 0 0 1px var(--line-d)}
.v-prose--legal table{color:inherit}
.v-prose--legal th{background:rgba(255,255,255,.06);color:var(--tx)}
.v-prose--legal :is(th,td){border-bottom-color:var(--line-d)}
.light .v-prose--legal{color:#1a1f2e}
.light .v-prose--legal :is(h2,h3,strong){color:#0a0c18}
.light .v-prose--legal .v-prose__tableau{background:#fff;box-shadow:0 0 0 1px var(--line-l)}
.light .v-prose--legal th{background:var(--paper-2);color:inherit}
.light .v-prose--legal :is(th,td){border-bottom-color:var(--line-l)}

/* « Qui nous sommes » : l'équipe, groupe par groupe, chacun vers sa fiche (team-details) */
.v-soignants{margin-top:clamp(28px,4vw,40px)}
.v-soignants+.v-soignants{margin-top:26px}
.v-soignants__t{margin:0 0 14px;font-size:12.5px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--blue-d)}
.v-soignants ul{list-style:none;margin:0;padding:0;display:grid;gap:12px;grid-template-columns:repeat(auto-fill,minmax(min(100%,210px),1fr))}
.v-soignants a{display:flex;align-items:center;gap:12px;height:100%;padding:12px 14px 12px 12px;border-radius:16px;background:#fff;border:1px solid var(--line-l);color:#0a0c18;transition:border-color .2s,transform .2s}
.v-soignants a:hover{border-color:rgba(47,127,220,.4);transform:translateY(-2px)}
.v-soignants a:focus-visible{outline:2px solid var(--blue-d);outline-offset:2px}
.v-soignants img{flex:none;width:56px;height:56px;border-radius:50%;object-fit:cover}
.v-soignants__initiales{flex:none;display:grid;place-items:center;width:56px;height:56px;border-radius:50%;background:#eef3fb;color:var(--blue-d);font-size:16px;font-style:normal;font-weight:700;letter-spacing:.02em} /* une personne sans photo sur le site : ses initiales à la place */
.v-soignants b{display:block;font-size:14px;font-weight:600}
.v-soignants span{font-size:12.5px;line-height:1.35;color:var(--ink-dim)}
@media (prefers-reduced-motion:reduce){.v-soignants a{transition:none}}

/* Pilule « commerciaux disponibles » (js/v10-dispo.js), pages EHR et PHM. Sous la nav (50) et la fenêtre de contact (200). */
.dispo{position:fixed;right:24px;bottom:24px;z-index:40;display:flex;align-items:center;gap:10px;padding:6px 16px 6px 6px;
  border-radius:999px;border:1px solid rgba(140,194,255,.28);background:rgba(44,60,99,.96);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
  box-shadow:0 10px 30px rgba(4,6,12,.45),inset 0 1px 0 rgba(255,255,255,.08);color:var(--tx);font:500 14px/1 var(--sans);cursor:pointer;
  opacity:0;transform:translateY(12px);pointer-events:none;transition:opacity .4s ease,transform .4s ease,border-color .2s,background .2s}
.dispo.is-on{opacity:1;transform:none;pointer-events:auto}
.dispo:hover{border-color:rgba(140,194,255,.5);background:rgba(56,76,124,.98)}
.dispo:focus-visible{outline:2px solid var(--blue-l);outline-offset:3px}
.dispo__duo{display:flex;flex:none}
.dispo__duo img{width:28px;height:28px;flex:none;max-width:none;border-radius:50%;object-fit:cover;box-shadow:0 0 0 1px rgba(255,255,255,.2);background:#2a3554}
.dispo__duo img+img{margin-left:-7px}
.dispo__pt{position:relative;width:8px;height:8px;border-radius:50%;background:#3ddc84;flex:none}
.dispo__pt::after{content:"";position:absolute;inset:0;border-radius:50%;background:inherit;animation:dispo-pouls 2s ease-out infinite}
.dispo.is-off .dispo__pt{background:#e0a33a}
.dispo.is-off .dispo__pt::after{display:none}
.dispo__txt{color:var(--dim);white-space:nowrap}
.dispo__txt b{color:var(--tx);font-weight:600}
/* Variantes du test A/B (classe posée par js/galeon-ab.js) : « court » garde le seul état (Disponibles, Dès demain),
   « muet » ne garde que les visages, le point posé dessus, et déplie le texte au survol ou au focus. */
.dispo--court .dispo__txt b{display:none}
.dispo--court [data-dispo-txt]{display:inline-block}
.dispo--court [data-dispo-txt]::first-letter{text-transform:uppercase}
.dispo--court .dispo__txt{color:var(--tx)}
.dispo--muet{gap:0;padding:4px;transition:opacity .4s ease,transform .4s ease,border-color .2s,background .2s,padding .35s ease}
.dispo--muet .dispo__pt{position:absolute;left:43px;bottom:3px;width:10px;height:10px;border:2px solid #2c3c63}
.dispo--muet .dispo__txt{display:inline-block;max-width:0;overflow:hidden;opacity:0;transition:max-width .35s ease,opacity .25s ease,margin .35s ease}
.dispo--muet:hover,.dispo--muet:focus-visible{padding-right:16px}
.dispo--muet:hover .dispo__txt,.dispo--muet:focus-visible .dispo__txt{max-width:260px;opacity:1;margin-left:12px}
@keyframes dispo-pouls{0%{transform:scale(1);opacity:.6}100%{transform:scale(2.6);opacity:0}}
@media (max-width:600px){.dispo{right:auto;left:50%;bottom:16px;transform:translate(-50%,12px);font-size:13px}.dispo.is-on{transform:translate(-50%,0)}}
@media (prefers-reduced-motion:reduce){.dispo,.dispo__pt::after{transition:none;animation:none}}