/* ============================================================
   Pages produit — grammaire commune (celle de la page d'accueil)
   En-tête + filet pleine largeur, colonne de propos à gauche,
   panneau gris à droite séparé par un filet vertical.
   ============================================================ */
.pgs{position:relative;overflow:hidden;padding:0;background:var(--surface);border-bottom:1px solid var(--border)}
.pgs>.wrap{padding-top:38px;padding-bottom:0}
.pg-grid{display:grid;grid-template-columns:minmax(0,.82fr) minmax(0,1.4fr);gap:0;align-items:stretch}
/* en-tête : sur toute la largeur, suivi d'un filet d'un bord à l'autre */
.pg-head{grid-column:1/-1;position:relative;max-width:none;padding-bottom:34px;margin:0}
.pg-head::after{content:"";position:absolute;left:-50vw;right:-50vw;bottom:0;height:1px;background:var(--border)}
.pg-head .eye{color:var(--muted)}
.pg-head h2,.pgs .sec-head h2{font-size:clamp(25px,2.6vw,34px)!important;line-height:1.14;letter-spacing:-.028em;margin:14px 0 0;text-wrap:pretty}
.pg-head p{font-size:16.5px;line-height:1.62;color:var(--text-dim);margin:13px 0 0;max-width:70ch}
.pg-head p b{color:var(--text);font-weight:600}
/* volet gauche : le propos */
.pg-l{grid-column:1;position:relative;padding:38px 52px 42px 0;display:flex;flex-direction:column;justify-content:center}
/* volet droit : le panneau gris, jusqu'au bord de l'écran */
.pg-r{grid-column:2;position:relative;padding:38px 0 42px 52px;display:flex;flex-direction:column;justify-content:center}
.pg-r::before{content:"";position:absolute;left:0;top:0;bottom:0;width:1px;background:var(--border)}
.pg-r::after{content:"";position:absolute;left:0;right:-50vw;top:0;bottom:0;background:var(--panel,var(--bg));z-index:-1}
.pg-r>*{position:relative;z-index:1}
/* une seule colonne, pleine largeur */
.pg-wide{grid-column:1/-1;padding:34px 0 42px}
/* les rangs d'étapes : numéro en ligne, titre, description */
.pg-steps{display:flex;flex-direction:column;gap:24px}
.pg-s{display:grid;grid-template-columns:30px minmax(0,1fr);column-gap:12px;align-items:baseline}
.pg-n{font-family:var(--mono);font-size:15px;font-weight:700;letter-spacing:.02em;color:var(--accent);
  font-variant-numeric:tabular-nums}
.pg-s h3{grid-column:2;font-size:17.5px;font-weight:700;letter-spacing:-.026em;margin:0}
.pg-s p{grid-column:2;font-size:14.5px;line-height:1.62;color:var(--text-dim);margin:7px 0 0;max-width:46ch}
/* la section « comment ça marche » : fond blanc, filet d'un bord à l'autre au-dessus */
#how.pgs{background:var(--surface);border-top:1px solid var(--border)}
/* en-tête et propos sur le gris, seul le panneau reste blanc */
.pgs .pg-head{background:var(--surface);box-shadow:-50vw 0 0 var(--surface),50vw 0 0 var(--surface)}
.pgs .pg-l{background:var(--panel,var(--bg));box-shadow:-50vw 0 0 var(--panel,var(--bg))}
.pgs .pg-wide{background:var(--panel,var(--bg));box-shadow:-50vw 0 0 var(--panel,var(--bg)),50vw 0 0 var(--panel,var(--bg))}
.pg-hero-r{background:var(--panel,var(--bg));box-shadow:50vw 0 0 var(--panel,var(--bg))}
@media(max-width:980px){.pgs .pg-l{box-shadow:-50vw 0 0 var(--panel,var(--bg)),50vw 0 0 var(--panel,var(--bg))}}
/* sous 980, le panneau gris passe pleine largeur : on desserre la gouttiere
   de la section pour que le contenu ne colle pas au bord de l ecran */
@media(max-width:980px){.pgs>.wrap{padding-left:30px;padding-right:30px}}
/* les trois temps, côte à côte, sans carte */
.pg-steps-3{position:relative;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 44px;padding:34px 0 42px}
.pg-steps-3::before{content:"";position:absolute;left:-50vw;right:-50vw;top:0;bottom:0;
  background:var(--panel,var(--bg));z-index:-1}
.pg-steps-3>*{position:relative;z-index:1}
.pg-steps-3 .pg-s{align-content:start}
.pg-steps-3 .pg-s p{max-width:38ch}
@media(max-width:980px){.pg-steps-3{grid-template-columns:minmax(0,1fr);gap:26px;padding:26px 0 32px}}
/* liste de points cochés */
.pg-pts{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:12px}
.pg-pts li{display:grid;grid-template-columns:17px minmax(0,1fr);column-gap:11px;align-items:start;
  font-size:14.5px;line-height:1.6;color:var(--text-dim)}
.pg-pts svg{width:17px;height:17px;color:var(--green);margin-top:2px}
.pg-pts b{color:var(--text);font-weight:600}
/* cartes de rang dans le panneau */
.pg-cards{display:flex;flex-direction:column;gap:10px;max-width:520px}
.pg-card{position:relative;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);
  padding:14px 16px 15px;box-shadow:0 1px 2px rgba(20,22,31,.04)}
[data-theme="noir"] .pg-card{box-shadow:0 1px 2px rgba(0,0,0,.5)}
.pg-card::before{content:"";position:absolute;left:0;top:0;bottom:0;width:2px;border-radius:2px 0 0 2px;
  background:var(--st,var(--border-hi))}
.pg-card.chaud{--st:var(--chaud)}.pg-card.tiede{--st:var(--tiede)}.pg-card.froid{--st:var(--froid)}
.pg-card.ok{--st:var(--green)}.pg-card.ia{--st:var(--accent)}
.pg-card h4{display:flex;align-items:center;gap:8px;font-family:var(--sans);font-size:14px;font-weight:700;
  letter-spacing:-.014em;margin:0}
.pg-card h4 i{width:6px;height:6px;border-radius:50%;background:var(--st,var(--muted));flex:none;
  box-shadow:0 0 0 3px color-mix(in srgb,var(--st,var(--muted)) 15%,transparent)}
.pg-card h4 b{margin-left:auto;font-family:var(--mono);font-size:10px;font-weight:700;letter-spacing:.08em;
  text-transform:uppercase;color:color-mix(in srgb,var(--st,var(--muted)) 85%,var(--text))}
.pg-card p{font-size:13.5px;line-height:1.6;color:var(--text-dim);margin:7px 0 0}
/* FAQ pleine largeur, en rangs séparés par un filet */
.pg-faq{display:flex;flex-direction:column;max-width:none}
.pg-faq>div{padding:20px 0;border-top:1px solid var(--border);display:grid;
  grid-template-columns:minmax(0,.82fr) minmax(0,1.4fr);gap:0 52px;align-items:start}
.pg-faq>div:first-child{border-top:0;padding-top:6px}
.pg-faq h3{font-size:16px;font-weight:700;letter-spacing:-.024em;margin:0}
.pg-faq p{font-size:14.5px;line-height:1.66;color:var(--text-dim);margin:0;max-width:74ch}
.pg-faq p b{color:var(--text);font-weight:600}
@media(max-width:980px){
  .pg-grid{grid-template-columns:minmax(0,1fr)}
  .pg-head,.pg-l,.pg-r,.pg-wide{grid-column:1}
  .pg-head{padding-bottom:28px}
  .pg-l{padding:28px 0 30px}
  .pg-r{padding:30px 0 34px}
  .pg-r::before{display:none}
  .pg-r::after{left:-50vw}
  .pg-faq>div{grid-template-columns:minmax(0,1fr);gap:9px 0}
  .pg-head h2{font-size:25px}
  .pg-head p{font-size:15px}
}

/* hero en deux volets : le propos à gauche, l'animation sur le panneau */
.pg-hero{padding-top:0;background:var(--panel,var(--bg))}
.pg-hero .pg-l{box-shadow:-50vw 0 0 var(--panel,var(--bg))}
.pg-hero>.wrap{padding-top:0}
/* propos à gauche, animation sur le panneau à droite */
.pg-hero .pg-grid,.pg-hero>.wrap{grid-template-columns:minmax(0,.86fr) minmax(0,1.14fr)}
.pg-hero .pg-l{padding:96px 64px 104px 0;align-items:flex-start;text-align:left}
.pg-hero .pg-l .eye{color:var(--muted)}
.pg-hero .pg-l h1{font-size:clamp(34px,3.7vw,52px)!important;line-height:1.04;letter-spacing:-.034em;margin:26px 0 0;text-align:left;white-space:nowrap}
@media(max-width:1180px){.pg-hero .pg-l h1{white-space:normal}}
.pg-hero .pg-l .sub{font-size:17.5px!important;line-height:1.5;color:var(--text-dim);margin:20px 0 0!important;max-width:34ch;text-align:left}
.pg-hero .pg-l .sub b{color:var(--text);font-weight:600}
.pg-hero .pg-l .constel-cta{display:flex;flex-wrap:wrap;gap:10px;margin-top:30px!important;justify-content:flex-start}

.pg-hero-r{padding:76px 0 84px 0;overflow:visible;justify-content:center}
.pg-hero-r{display:flex;align-items:center;justify-content:flex-end}
.pg-hero-r .psx{margin:0;width:auto;min-width:660px;max-width:none}
/* l'animation vit sur le panneau : plus de cadres blancs autour */
.pg-hero-r .psx-detail{background:var(--surface);border-color:var(--border)!important;box-shadow:none}
.pg-hero-r .psx{margin-top:0}
.pg-hero-r .ps-field{z-index:0}
@media(max-width:980px){
  .pg-hero .pg-grid,.pg-hero>.wrap{grid-template-columns:minmax(0,1fr)}
  .pg-hero .pg-l{padding:34px 0 26px}
  .pg-hero-r{padding:12px 0 34px;overflow:hidden}
  .pg-hero-r .psx{min-width:0;width:100%}
  .pg-hero .pg-l h1{font-size:33px!important}
}

/* ── hero prospection : le scan converge, le lead sort ───────── */
.hsn{position:relative;width:100%;max-width:600px;aspect-ratio:5/4;min-height:340px}
.hsn-cv{position:absolute;inset:0;width:100%;height:100%;display:block}
.hsn-hud{position:absolute;left:50%;transform:translateX(-50%);top:auto;bottom:-26px;
  display:flex;align-items:center;justify-content:center;gap:9px;white-space:nowrap;
  font-family:var(--mono);font-size:9.5px;font-weight:600;letter-spacing:.11em;text-transform:uppercase;
  color:var(--muted)}
.hsn-hud::before{content:"";width:5px;height:5px;border-radius:50%;background:var(--chaud);
  animation:hsnPulse 1.3s ease-in-out infinite}
@keyframes hsnPulse{0%,100%{opacity:1}50%{opacity:.28}}
.hsn-ct{color:var(--text-dim);font-variant-numeric:tabular-nums}
/* la pile : trois signaux dans la même UI que le score */
.hsn-stack{position:absolute;left:50%;bottom:34%;transform:translateX(-50%);
  width:min(80%,330px);display:flex;flex-direction:column-reverse;align-items:center;
  pointer-events:none}
.hsn-stack>*:not(:last-child){margin-top:-28px}
.hsn-c{position:relative;flex:none;width:100%;display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:0 9px;
  padding:7px 11px;background:var(--surface);border:1px solid var(--border);border-radius:10px;
  box-shadow:0 1px 2px rgba(20,22,31,.04),0 12px 28px -20px rgba(20,22,31,.24);
  opacity:0;transform:translateY(9px) scale(.965);
  transition:opacity .34s ease,transform .34s cubic-bezier(.2,.9,.2,1)}
[data-theme="noir"] .hsn-c{box-shadow:0 1px 2px rgba(0,0,0,.5),0 12px 28px -20px rgba(0,0,0,.85)}
.hsn-c[data-i="1"]{z-index:1}.hsn-c[data-i="2"]{z-index:2}.hsn-c[data-i="3"]{z-index:3}
.hsn-lead{z-index:4}
.hsn-c-d{width:6px;height:6px;border-radius:50%;flex:none;background:var(--c);
  box-shadow:0 0 0 2.5px color-mix(in srgb,var(--c) 15%,transparent)}
.hsn-c-m{min-width:0}
.hsn-c-m b{display:block;font-size:11.5px;font-weight:650;letter-spacing:-.012em;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hsn-c-m i{display:block;margin-top:.5px;font-family:var(--mono);font-size:8.5px;font-style:normal;
  color:var(--muted)}
.hsn-c-v{flex:none;font-family:var(--mono);font-size:11px;font-weight:700;
  font-variant-numeric:tabular-nums;color:color-mix(in srgb,var(--c) 86%,var(--text))}
/* la fiche qui émerge au centre */
.hsn-lead{position:relative;flex:none;display:grid;grid-template-columns:auto minmax(0,1fr) auto;
  align-items:center;gap:0 11px;width:calc(100% + 42px);padding:10px 13px;background:var(--surface);
  border:1px solid var(--border);border-radius:12px;
  box-shadow:0 1px 2px rgba(20,22,31,.04),0 16px 36px -22px rgba(20,22,31,.3);
  opacity:0;transform:translateY(14px);
  transition:opacity .4s ease,transform .4s cubic-bezier(.2,.9,.2,1)}
[data-theme="noir"] .hsn-lead{box-shadow:0 1px 2px rgba(0,0,0,.5),0 20px 44px -24px rgba(0,0,0,.85)}
.hsn-lead.on{opacity:1;transform:none}
.hsn-ring{position:relative;width:40px;height:40px;flex:none;display:grid;place-items:center}
.hsn-ring svg{position:absolute;inset:0;width:40px;height:40px;transform:rotate(-90deg)}
.hsn-ring circle{fill:none;stroke-width:3.2}
.hsn-ring .bg{stroke:var(--s3)}
.hsn-ring .fg{stroke:var(--chaud);stroke-linecap:round;stroke-dasharray:106.8;stroke-dashoffset:106.8;
  transition:stroke-dashoffset 1.1s cubic-bezier(.3,.7,.2,1)}
.hsn-lead.on .hsn-ring .fg{stroke-dashoffset:14}
.hsn-ring b{position:relative;font-family:var(--mono);font-size:13px;font-weight:700;
  font-variant-numeric:tabular-nums;color:color-mix(in srgb,var(--chaud) 86%,var(--text))}
.hsn-lm{min-width:0}
.hsn-lm b{display:block;font-size:13px;font-weight:700;letter-spacing:-.014em;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hsn-lm i{display:block;margin-top:2px;font-family:var(--mono);font-size:9.5px;font-style:normal;color:var(--muted)}
.hsn-tag{flex:none;padding:4px 10px;border-radius:99px;font-family:var(--mono);font-size:10px;
  font-weight:700;letter-spacing:.08em;text-transform:uppercase;
  color:color-mix(in srgb,var(--chaud) 86%,var(--text));
  background:color-mix(in srgb,var(--chaud) 13%,transparent);
  border:1px solid color-mix(in srgb,var(--chaud) 28%,transparent)}
@media(max-width:980px){.hsn{max-width:none;aspect-ratio:auto;height:320px;min-height:0}}

/* bascule d'aperçu desktop / mobile — outil de revue, jamais en prod */
#vpToggle{position:fixed;z-index:100998;right:16px;bottom:16px;display:flex;gap:3px;padding:3px;
  background:var(--surface);border:1px solid var(--border);border-radius:9px;
  box-shadow:0 6px 22px rgba(20,22,31,.16);font-family:var(--mono)}
[data-theme="noir"] #vpToggle{box-shadow:0 6px 22px rgba(0,0,0,.6)}
#vpToggle button{font-family:inherit;font-size:9.5px;font-weight:700;letter-spacing:.09em;
  text-transform:uppercase;color:var(--muted);background:none;border:0;padding:6px 11px;
  border-radius:6px;cursor:pointer}
#vpToggle button[aria-pressed="true"]{background:var(--s2);border:1px solid var(--border);color:var(--text)}
#vpStage{position:fixed;inset:0;z-index:100997;display:none;place-items:center;
  background:#0e1014;padding:26px 0 64px}
#vpStage.on{display:grid}
#vpStage .dev{width:390px;height:min(844px,calc(100vh - 96px));border-radius:36px;
  border:9px solid #17181d;background:#000;overflow:hidden;position:relative;
  box-shadow:0 30px 80px rgba(0,0,0,.6)}
#vpStage iframe{width:100%;height:100%;border:0;display:block;background:#fff}
#vpStage .cap{position:absolute;left:50%;bottom:-38px;transform:translateX(-50%);
  font-family:var(--mono);font-size:9.5px;letter-spacing:.14em;text-transform:uppercase;color:#6b7285}
html.vp-embed #vpToggle,html.vp-embed #vpStage{display:none!important}

/* ── section « outil gratuit », reprise de la page d'accueil ── */
  .sec.etw{padding:0}
  .etw{position:relative;overflow:hidden;background:var(--surface);border-top:1px solid var(--border)}
  .etw-in{display:grid;grid-template-columns:minmax(0,.82fr) minmax(0,1.4fr);gap:0;align-items:stretch}
  .etw-head{grid-column:1/-1;position:relative;max-width:none;padding:30px 0 26px}
  .etw-head h2{font-size:clamp(26px,2.7vw,36px);line-height:1.14;letter-spacing:-.028em;margin-top:12px;text-wrap:balance}
  .etw-head p{font-size:16.5px;line-height:1.62;color:var(--text-dim);margin-top:12px;max-width:60ch}
  .etw-head::after{content:"";position:absolute;left:-50vw;right:-50vw;bottom:0;height:1px;background:var(--border)}
  .etw-l{padding:30px 56px 44px 0;display:flex;flex-direction:column;justify-content:center;gap:22px;align-items:flex-start}
  .etw-r{position:relative;padding:26px 0 40px 56px;display:flex;align-items:center}
  .etw-r::before{content:"";position:absolute;left:0;top:0;bottom:0;width:1px;background:var(--border)}
  .etw-r::after{content:"";position:absolute;left:0;right:-50vw;top:0;bottom:0;background:var(--panel);z-index:0}
  .etw-r>*{position:relative;z-index:1;width:100%}
  /* le champ de recherche : les villes se tapent l'une après l'autre */
  .etw-fld{display:flex;align-items:center;gap:10px;width:100%;max-width:260px;min-height:41px;
    background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:0 13px}
  .etw-fld svg{width:15px;height:15px;color:var(--muted);flex-shrink:0}
  .etw-q{font-size:13.5px;font-weight:500;letter-spacing:-.01em;white-space:nowrap;line-height:1}
  .etw-cur{width:1px;height:15px;background:var(--accent);animation:etwCur 1s steps(1) infinite}
  @keyframes etwCur{50%{opacity:0}}
  .etw-facts{display:flex;flex-direction:column;width:100%}
  .etw-facts div{padding:14px 0}
  .etw-facts div+div{border-top:1px solid var(--border)}
  .etw-facts b{display:block;font-size:14.5px;font-weight:600;letter-spacing:-.014em}
  .etw-facts span{display:block;font-size:13.5px;line-height:1.5;color:var(--muted);margin-top:4px}
  .hwrap{display:flex;flex-direction:column;gap:14px}
  .heat{display:grid;grid-template-columns:repeat(30,1fr);gap:2px}
  .heat i{position:relative;aspect-ratio:1;border-radius:2px}
  /* la donnée arrive en vague depuis le coin, puis respire */
  .heat i::before{content:"";position:absolute;inset:0;border-radius:2px;
    background:color-mix(in srgb,var(--accent) calc(var(--w) * 100%),transparent);
    opacity:0;transform:scale(.35);animation:heatIn 9s cubic-bezier(.2,.8,.2,1) infinite;animation-delay:var(--d)}
  @keyframes heatIn{0%{opacity:0;transform:scale(.35)}
    9%{opacity:1;transform:scale(1)}
    40%{opacity:1}52%{opacity:.62}64%{opacity:1}
    86%{opacity:1;transform:scale(1)}
    96%,100%{opacity:0;transform:scale(.35)}}
  @media(prefers-reduced-motion:reduce){.heat i::before{animation:none;opacity:1;transform:none}}
  .hlg{display:flex;align-items:center;gap:8px;font-family:var(--mono);font-size:9.5px;
    letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
  .hlg span{width:26px;height:6px;border-radius:2px}
  .hlg .c1{background:color-mix(in srgb,var(--accent) 12%,transparent)}
  .hlg .c2{background:color-mix(in srgb,var(--accent) 70%,transparent)}
  .hnum{display:flex;border-top:1px solid var(--border)}
  .hnum div{flex:1;padding:13px 14px 0 0}
  .hnum div+div{padding-left:16px;border-left:1px solid var(--border)}
  .hnum b{display:block;font-family:var(--disp);font-size:20px;font-weight:800;
    letter-spacing:-.03em;font-variant-numeric:tabular-nums}
  .hnum span{display:block;font-size:12px;line-height:1.45;color:var(--muted);margin-top:4px}
  @media(max-width:900px){.etw-in{grid-template-columns:1fr}.etw-l{padding:24px 0}
    .etw-r{padding:0 0 32px;margin-right:-32px}
    .etw-r::before{display:none}.etw-r::after{left:-50vw}
    .hnum{flex-direction:column}.hnum div+div{padding:14px 0 0;border-left:0;border-top:1px solid var(--border)}}

/* ── hero pilotage : la donnée descend les liaisons vers le résultat ── */
.cn-flow{fill:none}
.cn-fp{stroke:var(--accent);stroke-width:1.6;stroke-linecap:round;
  stroke-dasharray:.14 .86;stroke-dashoffset:1;opacity:.5;
  animation:cnFlow 3.4s linear infinite;animation-delay:calc(var(--i) * .42s)}
@keyframes cnFlow{to{stroke-dashoffset:0}}
.cn-dt{fill:var(--accent);opacity:.85}
/* le résultat respire quand la donnée arrive */
.cn-result{position:relative}
.cn-result::after{content:"";position:absolute;inset:-1px;border-radius:inherit;pointer-events:none;
  box-shadow:0 0 0 0 color-mix(in srgb,var(--accent) 42%,transparent);
  animation:cnPulse 3.4s cubic-bezier(.2,.8,.2,1) 2.2s infinite}
@keyframes cnPulse{0%,72%{box-shadow:0 0 0 0 color-mix(in srgb,var(--accent) 0%,transparent)}
  80%{box-shadow:0 0 0 5px color-mix(in srgb,var(--accent) 22%,transparent)}
  100%{box-shadow:0 0 0 12px color-mix(in srgb,var(--accent) 0%,transparent)}}
@media(prefers-reduced-motion:reduce){
  .cn-fp,.cn-result::after{animation:none}
  .cn-fp{stroke-dasharray:none;opacity:.28}
  .cn-dots{display:none}}

/* le plan du secteur, en fond du hero pilotage */
.cfunnel .constel-stage{position:relative}
.cn-plan{position:absolute;inset:0;width:100%;height:100%;display:block;z-index:0;pointer-events:none;
  /* le plan ne vit qu'au-dessus des cartes : rien derrière le tunnel */
  -webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 10%,#000 30%,transparent 46%),
    linear-gradient(to right,transparent 0,#000 12%,#000 88%,transparent 100%);
  mask-image:linear-gradient(to bottom,transparent 0,#000 10%,#000 30%,transparent 46%),
    linear-gradient(to right,transparent 0,#000 12%,#000 88%,transparent 100%);
  -webkit-mask-composite:source-in;mask-composite:intersect}
.cfunnel .constel-lines,.cfunnel .constel-center,.cfunnel .cn-card{z-index:1}

.cfunnel .constel-center h1{font-size:clamp(32px,3.4vw,46px);line-height:1.1;letter-spacing:-.03em}

/* CTA : le noir tranche avec le reste de la page */
.pcta{background:#0e1014;border-top:1px solid var(--border);padding:0;text-align:center}
.pcta>.wrap{padding-top:0;padding-bottom:0}
.pcta-in{padding-top:96px!important;padding-bottom:100px!important}
.pcta-in{max-width:none;margin:0;padding:96px 0 100px;background:none!important;border:0!important;
  box-shadow:none!important;border-radius:0;display:flex;flex-direction:column;align-items:center}
.pcta .eye{color:#7b8296}
.pcta .eye::before{background:#2a2a35}
.pcta-in h2{margin:16px 0 0;font-size:clamp(28px,3.1vw,42px);line-height:1.1;letter-spacing:-.032em;
  color:#f4f5f8;max-width:20ch;text-wrap:balance}
.pcta-in p{margin:14px 0 0;font-size:16.5px;line-height:1.6;color:#b4b9c8;max-width:52ch}
.pcta-in .btn-p{margin-top:30px;background:#f2f3f7;color:#000}
.pcta-in .btn-p:hover{background:#fff}
.pcta-note{margin-top:14px;font-size:13px;color:#767d92}
.pcta-tr{display:flex;flex-wrap:wrap;justify-content:center;gap:10px 26px;margin-top:30px;
  font-size:13.5px;color:#b4b9c8}
.pcta-tr span{display:inline-flex;align-items:center;gap:7px}
.pcta-tr svg{width:15px;height:15px;color:var(--green)}
.foot{background:var(--panel,var(--bg));border-top:1px solid var(--border)}
@media(max-width:820px){.pcta-in{padding-top:62px!important;padding-bottom:66px!important}}

/* le filet sous la barre est là dès le haut de page */
#nav{border-bottom:1px solid var(--border)}

/* ── hero mandats : le plan de données derrière la chaîne du dossier ── */
.cflow-wrap{position:relative}
.gm-plan{position:absolute;inset:0;width:100%;height:100%;display:block;z-index:0;pointer-events:none;
  -webkit-mask-image:linear-gradient(to bottom,#000 0,#000 44%,transparent 74%),
    linear-gradient(to right,transparent 0,#000 14%,#000 86%,transparent 100%);
  mask-image:linear-gradient(to bottom,#000 0,#000 44%,transparent 74%),
    linear-gradient(to right,transparent 0,#000 14%,#000 86%,transparent 100%);
  -webkit-mask-composite:source-in;mask-composite:intersect}
.cflow{position:relative;z-index:1}
/* le relais violet passe d'une étape à la suivante */
.gm-ar{position:relative;color:var(--border-hi)}
.gm-ar::after{content:"";position:absolute;left:50%;top:50%;width:7px;height:7px;margin:-3.5px 0 0 -3.5px;
  border-radius:50%;background:var(--accent);opacity:0;
  animation:gmRelay 3.6s cubic-bezier(.3,.7,.2,1) infinite;animation-delay:calc(var(--i) * .55s)}
@keyframes gmRelay{0%{opacity:0;transform:translateX(-16px) scale(.6)}
  12%{opacity:1;transform:none}
  30%{opacity:0;transform:translateX(16px) scale(.6)}
  100%{opacity:0;transform:translateX(16px) scale(.6)}}
@media(prefers-reduced-motion:reduce){.gm-ar::after{animation:none;opacity:0}}

/* ── hero agentique : le champ de données et la tâche résolue ── */
.agf{position:relative;width:100%;max-width:1040px;margin:26px auto 0;aspect-ratio:16/9;min-height:400px}
.agf-cv{position:absolute;inset:0;width:100%;height:100%;display:block}
.agf-cards{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  width:min(88%,520px);display:flex;flex-direction:column;gap:10px}
.agf-task,.agf-out{background:var(--surface);border:1px solid var(--border);border-radius:14px;
  box-shadow:0 1px 3px rgba(20,22,31,.07),0 22px 46px -22px rgba(20,22,31,.34);
  opacity:0;transform:translateY(10px);transition:opacity .45s ease,transform .45s cubic-bezier(.2,.9,.2,1)}
[data-theme="noir"] .agf-task,[data-theme="noir"] .agf-out{box-shadow:0 1px 2px rgba(0,0,0,.5),0 18px 40px -26px rgba(0,0,0,.85)}
.agf-task.on,.agf-out.on{opacity:1;transform:none}
.agf-task{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:0 11px;
  padding:14px 16px 0}
.agf-orb{width:26px;height:26px;border-radius:8px;flex:none;display:grid;place-items:center;
  color:var(--accent);background:var(--accent-dim);
  border:1px solid color-mix(in srgb,var(--accent) 24%,transparent)}
.agf-orb svg{width:14px;height:14px}
.agf-task.busy .agf-orb{animation:agfOrb 1.2s ease-in-out infinite}
@keyframes agfOrb{0%,100%{box-shadow:0 0 0 0 color-mix(in srgb,var(--accent) 0%,transparent)}
  45%{box-shadow:0 0 0 5px color-mix(in srgb,var(--accent) 16%,transparent)}}
.agf-t{font-size:16px;font-weight:700;letter-spacing:-.02em;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.agf-ai{flex:none;padding:3px 9px;border-radius:99px;font-family:var(--mono);font-size:10px;font-weight:700;
  letter-spacing:.08em;text-transform:uppercase;color:var(--text-dim);
  background:var(--s2);border:1px solid var(--border)}
.agf-q{grid-column:1/-1;margin:12px 0 0;padding:13px 0 15px;border-top:1px solid var(--border);
  font-size:14.5px;color:var(--muted)}
.agf-out{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:0 11px;
  padding:13px 16px;margin:0 14px}
.agf-ck{width:24px;height:24px;border-radius:7px;display:grid;place-items:center;flex:none;
  color:var(--green);background:color-mix(in srgb,var(--green) 12%,transparent);
  border:1px solid color-mix(in srgb,var(--green) 28%,transparent)}
.agf-ck svg{width:13px;height:13px}
.agf-out b{font-size:14.5px;font-weight:650;letter-spacing:-.014em;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
@media(max-width:760px){
  .agf{aspect-ratio:auto;height:360px;min-height:0;margin-top:24px}
  .agf-cards{width:min(94%,420px)}
  .agf-t{font-size:14.5px}
  .agf-q{font-size:13.5px}}

/* hero agentique : deux volets, le champ à droite */
.ag-hero .pg-l h1{font-size:clamp(32px,3.5vw,48px)!important;line-height:1.08;letter-spacing:-.032em;
  text-align:left;white-space:normal}
.ag-hero .pg-l .sub{font-size:16.5px!important;max-width:44ch;text-align:left;margin-left:0!important;margin-right:0!important}
.ag-hero .pg-hero-r{padding:44px 0 52px 52px}
.ag-hero .agf{margin:0;max-width:none;aspect-ratio:auto;height:420px;min-height:0}
.ag-hero .agf-cards{width:min(96%,470px)}
@media(max-width:980px){
  .ag-hero .pg-hero-r{padding:16px 0 34px}
  .ag-hero .agf{height:340px}
  .ag-hero .pg-l h1{font-size:28px!important}}

/* le hero occupe la hauteur d'écran, barre de nav déduite */
.pg-hero>.wrap{min-height:calc(100svh - 66px);align-content:center}
.constel:first-of-type>.wrap,.cfunnel>.wrap{min-height:calc(100svh - 66px);
  display:flex;flex-direction:column;justify-content:center}
@media(max-width:980px){
  .pg-hero>.wrap,.constel:first-of-type>.wrap,.cfunnel>.wrap{min-height:0}}

/* le second bouton du hero reste blanc sur le panneau gris */
.pg-hero .constel-cta .btn-s{background:var(--surface);border-color:var(--border)}
.pg-hero .constel-cta .btn-s:hover{background:var(--surface);border-color:var(--border-hi)}

/* les deux boutons du hero restent côte à côte, même en mobile */
.pg-hero .constel-cta{display:flex;flex-wrap:nowrap;gap:9px;align-items:center}
.pg-hero .constel-cta .btn{white-space:nowrap}
@media(max-width:400px){.pg-hero .constel-cta .btn-lg{padding-left:15px;padding-right:15px;font-size:13.5px}}

/* ── hero pilotage : l'objectif se règle, tout se recalcule ── */
.plt-wrap{position:relative;width:100%;max-width:470px;margin-left:auto;
  padding:52px 0 58px;display:flex;align-items:center}
/* les barres de fond : pleine largeur du hero, ancrées en bas */
.pg-hero{min-height:0}
.pg-hero{position:relative;background:var(--panel,var(--bg))}
.plt-bars{position:absolute;left:0;right:0;bottom:0;height:58%;width:100%;
  display:block;z-index:0;pointer-events:none;color:color-mix(in srgb,var(--text-dim) 42%,var(--border-hi))}
.pg-hero>.wrap{position:relative;z-index:1}
.pg-hero .pg-l,.pg-hero .pg-hero-r{background:transparent!important;box-shadow:none!important}
@media(max-width:980px){.plt-wrap{max-width:none;margin:0;padding:30px 0 36px}
  .pg-hero{overflow:hidden}
  .plt-bars{height:42%}}
.plt{position:relative;z-index:1;width:100%;
  background:var(--surface);border:1px solid var(--border);border-radius:16px;overflow:hidden;
  box-shadow:0 1px 2px rgba(20,22,31,.04),0 22px 50px -30px rgba(20,22,31,.26)}
[data-theme="noir"] .plt{box-shadow:0 1px 2px rgba(0,0,0,.5),0 22px 50px -30px rgba(0,0,0,.85)}
.plt *{box-sizing:border-box}
/* l'entrée */
.plt-in{padding:16px 18px 18px;border-bottom:1px solid var(--border);background:var(--s2)}
.plt-lb{display:block;font-family:var(--mono);font-size:9.5px;font-weight:600;letter-spacing:.12em;
  text-transform:uppercase;color:var(--muted)}
.plt-goal{display:flex;align-items:baseline;gap:6px;margin-top:6px}
.plt-goal b{font-size:30px;font-weight:650;letter-spacing:-.028em;font-variant-numeric:tabular-nums;
  color:color-mix(in srgb,var(--accent) 84%,var(--text))}
.plt-goal i{font-style:normal;font-size:13px;font-weight:600;color:var(--text-dim)}
.plt-rail{position:relative;display:block;height:5px;margin:13px 0 0;border-radius:99px;background:var(--s3)}
.plt-rail i{position:absolute;left:0;top:0;bottom:0;border-radius:99px;background:var(--accent)}
.plt-rail em{position:absolute;top:50%;width:13px;height:13px;margin:-6.5px 0 0 -6.5px;border-radius:50%;
  background:var(--surface);border:2px solid var(--accent);
  box-shadow:0 1px 3px rgba(20,22,31,.16)}
.plt-scale{display:flex;justify-content:space-between;margin-top:7px;font-family:var(--mono);
  font-size:9.5px;color:var(--muted);font-variant-numeric:tabular-nums}
/* la dérivation */
.plt-der{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;background:var(--border)}
.plt-d{background:var(--surface);padding:12px 14px 13px;min-width:0}
.plt-d-l{display:block;font-family:var(--mono);font-size:9px;font-weight:600;letter-spacing:.1em;
  text-transform:uppercase;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.plt-d-v{display:flex;align-items:baseline;gap:3px;margin-top:5px;font-size:18px;font-weight:650;
  letter-spacing:-.022em;font-variant-numeric:tabular-nums;color:var(--text)}
.plt-d-v u{font-style:normal;text-decoration:none;font-family:var(--mono);font-size:9.5px;
  font-weight:600;color:var(--muted)}
/* le résultat */
.plt-out{padding:15px 18px 17px;border-top:1px solid var(--border);background:var(--s2)}
.plt-o-l{display:block;font-family:var(--mono);font-size:9.5px;font-weight:600;letter-spacing:.12em;
  text-transform:uppercase;color:var(--muted)}
.plt-o-v{display:flex;align-items:baseline;gap:4px;margin-top:5px;font-size:32px;font-weight:650;
  letter-spacing:-.03em;font-variant-numeric:tabular-nums;
  color:color-mix(in srgb,var(--accent) 84%,var(--text))}
.plt-o-v u{font-style:normal;text-decoration:none;font-size:15px;font-weight:600;color:var(--text-dim)}
.plt-team{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:9px;
  align-items:end;height:46px;margin:14px 0 0}
.plt-t{display:flex;flex-direction:column;align-items:center;gap:5px;height:100%;justify-content:flex-end}
.plt-t i{display:block;width:100%;height:var(--h);border-radius:3px 3px 0 0;
  background:color-mix(in srgb,var(--accent) 30%,transparent);
  border-top:2px solid color-mix(in srgb,var(--accent) 62%,transparent);
  transition:height .5s cubic-bezier(.3,.7,.2,1)}
.plt-t b{font-family:var(--mono);font-size:9px;font-weight:700;color:var(--muted)}
.plt-o-s{display:block;margin-top:10px;font-size:12px;color:var(--muted)}
.plt-o-s b{color:var(--text-dim);font-weight:650}
@media(max-width:980px){.plt{max-width:none;margin:0}}
@media(max-width:520px){
  .plt-der{grid-template-columns:repeat(3,minmax(0,1fr))}
  .plt-d{padding:10px 9px 11px}
  .plt-d-v{font-size:15px}}