/* Fairwai — site v8
   Une seule couleur de marque (le bleu de la vidéo), des gris neutres, du noir pour le texte.
   Les couleurs sémantiques (vert en ligne, rouge raccrocher) ne servent qu'aux états d'appel. */

:root{
  --ink:#0A0B0F;
  --ink-2:#2B2E36;
  --muted:#5F6470;
  --subtle:#8A8F99;
  --line:#E7E7EA;
  --line-2:#D9DADF;
  --bg:#FFFFFF;
  --bg-soft:#F7F7F8;
  --bg-sunk:#F1F1F3;

  --blue:#1F73F3;
  --blue-hover:#1A60D1;
  --blue-soft:#EAF2FE;
  --blue-line:#CCE0FC;
  --blue-rgb:31,115,243;
  --blue-deep:#163D5A;
  --blue-light:#6FA8F7;
  --on-blue:#FFFFFF;

  --green:#12A150;
  --green-soft:#E7F6EE;
  --red:#DC2626;

  --radius-s:10px;
  --radius:16px;
  --radius-l:24px;
  --shadow-s:0 1px 2px rgba(10,11,15,.06),0 1px 1px rgba(10,11,15,.04);
  --shadow:0 1px 2px rgba(10,11,15,.05),0 12px 32px -12px rgba(10,11,15,.14);
  --shadow-l:0 2px 4px rgba(10,11,15,.04),0 32px 64px -24px rgba(10,11,15,.22);

  --wrap:1180px;
  --gutter:32px;
  --font:'Inter',system-ui,-apple-system,'Segoe UI',sans-serif;
  --ease:cubic-bezier(.2,.7,.2,1);
}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--font);font-size:16px;line-height:1.55;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-feature-settings:'cv11','ss01','ss03'}
img,video,svg{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button,input,select{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--blue);outline-offset:3px;border-radius:6px}
[id]{scroll-margin-top:88px}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

.wrap{max-width:var(--wrap);margin:0 auto;padding:0 var(--gutter)}
.section{padding:128px 0}
.section.tight{padding:96px 0}
.section.soft{background:var(--bg-soft)}

/* Typo */
.eyebrow{display:inline-flex;align-items:center;gap:8px;font-size:13px;font-weight:600;letter-spacing:.02em;color:var(--blue)}
.eyebrow.muted{color:var(--muted)}
.h1{margin:0;font-size:clamp(44px,6.6vw,84px);line-height:1;letter-spacing:-.045em;font-weight:700}
.h2{margin:0;font-size:clamp(34px,4.2vw,52px);line-height:1.06;letter-spacing:-.038em;font-weight:700}
.h3{margin:0;font-size:22px;line-height:1.25;letter-spacing:-.02em;font-weight:650}
.lead{margin:0;font-size:clamp(18px,1.6vw,20px);line-height:1.55;color:var(--muted);letter-spacing:-.005em}
.body{margin:0;font-size:16px;color:var(--muted)}
.accent{color:var(--blue)}
.head{max-width:760px}
.head.center{margin:0 auto;text-align:center}
.head .eyebrow{margin-bottom:18px}
.head .lead{margin-top:20px}

/* Buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:48px;padding:0 22px;border-radius:12px;border:1px solid transparent;font-size:15.5px;font-weight:600;letter-spacing:-.005em;white-space:nowrap;cursor:pointer;transition:background .2s ease,border-color .2s ease,color .2s ease,transform .2s var(--ease),box-shadow .2s ease}
.btn svg{flex-shrink:0;transition:transform .25s var(--ease)}
.btn:hover svg.arr{transform:translateX(3px)}
.btn-primary{background:var(--blue);color:#fff;box-shadow:0 1px 0 rgba(255,255,255,.18) inset,0 8px 20px -10px rgba(var(--blue-rgb),.7)}
.btn-primary:hover{background:var(--blue-hover)}
.btn-primary:active{transform:translateY(1px)}
.btn-dark{background:var(--ink);color:#fff}
.btn-dark:hover{background:#25272E}
.btn-ghost{background:#fff;border-color:var(--line-2);color:var(--ink)}
.btn-ghost:hover{border-color:var(--ink);}
.btn-white{background:#fff;color:var(--ink)}
.btn-white:hover{background:#ECECEF}
.btn-sm{height:40px;padding:0 16px;font-size:14.5px;border-radius:10px}
.btn-lg{height:56px;padding:0 26px;font-size:16.5px;border-radius:14px}
.link{display:inline-flex;align-items:center;gap:6px;font-weight:600;color:var(--blue)}
.link:hover{color:var(--blue-hover)}
.link:hover svg{transform:translateX(3px)}
.link svg{transition:transform .25s var(--ease)}

/* Nav */
.nav{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.82);-webkit-backdrop-filter:saturate(1.6) blur(16px);backdrop-filter:saturate(1.6) blur(16px);border-bottom:1px solid transparent;transition:border-color .25s ease}
.nav.scrolled{border-bottom-color:var(--line)}
.nav-in{height:72px;display:flex;align-items:center;gap:40px}
.nav-logo svg{width:116px;height:auto}
.nav-links{display:flex;align-items:center;gap:4px;font-size:15px;font-weight:500}
.nav-links > a,.nav-links > .menu > button{display:inline-flex;align-items:center;gap:6px;height:38px;padding:0 12px;border:0;border-radius:9px;background:transparent;color:var(--ink-2);cursor:pointer;transition:background .2s ease,color .2s ease}
.nav-links > a:hover,.nav-links > .menu > button:hover,.nav-links > a.on{background:var(--bg-sunk);color:var(--ink)}
.nav-right{margin-left:auto;display:flex;align-items:center;gap:8px}
.nav-right .login{font-size:15px;font-weight:500;color:var(--ink-2);padding:0 12px}
.nav-right .login:hover{color:var(--ink)}
.menu{position:relative}
.menu > button svg{transition:transform .25s var(--ease)}
.menu:hover > button svg,.menu:focus-within > button svg{transform:rotate(180deg)}
.menu-panel{position:absolute;top:100%;left:-8px;padding-top:10px;opacity:0;visibility:hidden;transform:translateY(-4px);transition:opacity .18s ease,transform .22s var(--ease),visibility 0s linear .22s}
.menu:hover .menu-panel,.menu:focus-within .menu-panel{opacity:1;visibility:visible;transform:none;transition:opacity .18s ease,transform .22s var(--ease),visibility 0s}
.menu-card{width:340px;padding:8px;background:#fff;border:1px solid var(--line);border-radius:18px;box-shadow:var(--shadow-l)}
.menu-item{display:flex;align-items:center;gap:14px;padding:12px;border-radius:12px;transition:background .15s ease}
.menu-item:hover{background:var(--bg-soft)}
.menu-item strong{display:block;font-size:15px;font-weight:600;color:var(--ink)}
.menu-item small{display:block;font-size:13.5px;color:var(--muted)}
.tile{width:40px;height:40px;flex-shrink:0;border-radius:11px;display:flex;align-items:center;justify-content:center;background:var(--blue-soft);color:var(--blue)}
.tile.dark{background:var(--ink);color:#fff}
.burger{display:none;margin-left:auto;width:44px;height:44px;border:0;border-radius:10px;background:transparent;align-items:center;justify-content:center;cursor:pointer}
.burger:hover{background:var(--bg-sunk)}
.mnav{display:none}

/* Hero */
.hero{position:relative;padding:72px 0 0;overflow:hidden}
.hero-glow{position:absolute;left:50%;top:-180px;width:1100px;height:720px;margin-left:-550px;background:radial-gradient(closest-side,rgba(var(--blue-rgb),.13),rgba(var(--blue-rgb),0));pointer-events:none}
.hero-in{position:relative;display:flex;flex-direction:column;align-items:center;text-align:center}
.badge{display:inline-flex;align-items:center;gap:10px;height:34px;padding:0 14px 0 6px;border-radius:999px;background:#fff;border:1px solid var(--line);box-shadow:var(--shadow-s);font-size:14px;font-weight:500;color:var(--ink-2)}
.badge b{display:inline-flex;align-items:center;height:24px;padding:0 9px;border-radius:999px;background:var(--blue);color:#fff;font-size:12px;font-weight:600;letter-spacing:.01em}
.hero .h1{margin-top:28px;max-width:900px}
.hero .lead{margin-top:24px;max-width:620px}

/* Action card: create or get called */
.action{margin-top:40px;width:100%;max-width:620px}
.seg{display:inline-flex;padding:4px;gap:4px;border-radius:12px;background:var(--bg-sunk);margin-bottom:12px}
.seg button{display:inline-flex;align-items:center;gap:8px;height:36px;padding:0 14px;border:0;border-radius:9px;background:transparent;font-size:14.5px;font-weight:600;color:var(--muted);cursor:pointer;transition:background .2s ease,color .2s ease,box-shadow .2s ease}
.seg button:hover{color:var(--ink)}
.seg button[aria-selected="true"]{background:#fff;color:var(--ink);box-shadow:var(--shadow-s)}
.field{display:flex;align-items:center;gap:8px;padding:8px 8px 8px 18px;border-radius:18px;background:#fff;border:1px solid var(--line-2);box-shadow:var(--shadow);transition:border-color .2s ease,box-shadow .2s ease}
.field:focus-within{border-color:var(--blue);box-shadow:0 0 0 4px rgba(var(--blue-rgb),.12),var(--shadow)}
.field.err{border-color:var(--red)}
.field input{flex:1;min-width:0;height:48px;border:0;outline:0;background:transparent;font-size:17px;color:var(--ink)}
.field input::placeholder{color:var(--subtle)}
.field .ico{color:var(--subtle);flex-shrink:0}
.cc{position:relative;display:flex;align-items:center;gap:6px;height:48px;padding-right:12px;margin-right:4px;border-right:1px solid var(--line);font-size:16px;font-weight:500;color:var(--ink);flex-shrink:0}
.cc select{position:absolute;inset:0;opacity:0;cursor:pointer;width:100%}
.cc .flag{font-size:16px;line-height:1}
.hint{margin:14px 0 0;font-size:14px;color:var(--muted);display:flex;align-items:center;justify-content:center;gap:16px;flex-wrap:wrap}
.hint span{display:inline-flex;align-items:center;gap:6px}
.hint svg{color:var(--green)}
.error{margin:10px 0 0;font-size:14px;color:var(--red);font-weight:500}
.consent{margin:12px auto 0;max-width:540px;font-size:12.5px;line-height:1.5;color:var(--subtle)}
.consent a{text-decoration:underline;text-underline-offset:2px}

/* Live call (simulated) */
.call{margin-top:16px;text-align:left;border:1px solid var(--line);border-radius:20px;background:#fff;box-shadow:var(--shadow);overflow:hidden;animation:pop .4s var(--ease) both}
.call-top{display:flex;align-items:center;gap:12px;padding:14px 16px;border-bottom:1px solid var(--line)}
.call-top .who{flex:1;min-width:0}
.call-top strong{display:block;font-size:15px}
.call-top small{display:block;font-size:13px;color:var(--muted)}
.pill{display:inline-flex;align-items:center;gap:7px;height:26px;padding:0 10px;border-radius:999px;font-size:12.5px;font-weight:600;background:var(--bg-sunk);color:var(--muted)}
.pill i{width:7px;height:7px;border-radius:50%;background:currentColor}
.pill.live{background:var(--green-soft);color:var(--green)}
.pill.live i{animation:blink 1.4s ease-in-out infinite}
.pill.ring{background:var(--blue-soft);color:var(--blue)}
.call-body{padding:16px;display:flex;flex-direction:column;gap:10px;max-height:340px;overflow:auto}
.bubble{max-width:86%;padding:10px 14px;border-radius:16px;font-size:14.5px;line-height:1.5;animation:pop .35s var(--ease) both}
.bubble small{display:block;margin-bottom:2px;font-size:11.5px;font-weight:600;letter-spacing:.02em;color:var(--subtle)}
.bubble.agent{align-self:flex-start;background:var(--bg-sunk);border-bottom-left-radius:6px}
.bubble.me{align-self:flex-end;background:var(--blue);color:#fff;border-bottom-right-radius:6px}
.bubble.me small{color:rgba(255,255,255,.7)}
.recap{margin:4px 16px 16px;padding:14px 16px;border-radius:14px;background:var(--bg-soft);border:1px solid var(--line);font-size:14px;color:var(--ink-2)}
.recap h4{margin:0 0 6px;font-size:13px;font-weight:600;color:var(--muted)}
.recap p{margin:4px 0 0}
.call-foot{display:flex;gap:8px;flex-wrap:wrap;padding:0 16px 16px}
.note{padding:0 16px 14px;font-size:12px;color:var(--subtle)}
.dots{display:inline-flex;gap:4px}
.dots i{width:6px;height:6px;border-radius:50%;background:var(--subtle);animation:blink 1.2s ease-in-out infinite}
.dots i:nth-child(2){animation-delay:.2s}.dots i:nth-child(3){animation-delay:.4s}

/* Hero video */
.stage{position:relative;margin-top:72px}
.stage::before{content:"";position:absolute;left:4%;right:4%;top:8%;bottom:-10%;border-radius:40px;background:radial-gradient(60% 70% at 50% 40%,rgba(var(--blue-rgb),.22),rgba(var(--blue-rgb),0));filter:blur(30px);pointer-events:none}
.frame{position:relative;border-radius:22px;padding:8px;background:linear-gradient(180deg,#fff,#F2F2F4);border:1px solid var(--line);box-shadow:var(--shadow-l)}
.video{position:relative;aspect-ratio:16/9;border-radius:15px;overflow:hidden;background:#EDEDF0}
.video video,.video img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.play{position:absolute;inset:0;display:flex;align-items:flex-end;justify-content:flex-start;padding:28px;border:0;background:linear-gradient(180deg,rgba(10,11,15,0) 55%,rgba(10,11,15,.35));cursor:pointer;transition:opacity .3s ease}
.play-btn{display:inline-flex;align-items:center;gap:12px;height:56px;padding:0 22px 0 8px;border-radius:999px;background:rgba(255,255,255,.95);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:var(--shadow-l);font-size:15.5px;font-weight:600;color:var(--ink);transition:transform .25s var(--ease)}
.play-btn i{width:40px;height:40px;border-radius:50%;background:var(--blue);display:flex;align-items:center;justify-content:center;color:#fff}
.play:hover .play-btn{transform:scale(1.04)}
.video.on .play{opacity:0;pointer-events:none}

/* Logos */
.logos{padding:72px 0 0}
.logos p{margin:0 0 28px;text-align:center;font-size:14px;font-weight:500;color:var(--muted)}
.marquee{overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent);mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent)}
.marquee-track{display:flex;align-items:center;gap:72px;width:max-content;animation:marq 45s linear infinite}
.marquee:hover .marquee-track{animation-play-state:paused}
.marquee img{height:28px;width:auto;max-width:130px;object-fit:contain;filter:grayscale(1) contrast(1.1);opacity:.5;transition:opacity .2s ease,filter .2s ease}
.marquee img:hover{opacity:1;filter:none}

/* Generic cards */
.card{background:#fff;border:1px solid var(--line);border-radius:var(--radius-l)}
.grid-3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.grid-2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:64px;align-items:center}

/* Day timeline */
.day{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:72px;align-items:start}
.day-side{position:sticky;top:120px}
.stats{display:flex;gap:12px;margin-top:36px}
.stat{flex:1;padding:20px;border-radius:var(--radius);background:#fff;border:1px solid var(--line)}
.stat b{display:block;font-size:44px;line-height:1;letter-spacing:-.04em;font-weight:700;font-variant-numeric:tabular-nums}
.stat span{display:block;margin-top:8px;font-size:14px;color:var(--muted)}
.stat.hi b{color:var(--blue)}
.evening{margin-top:12px;padding:18px 20px;border-radius:var(--radius);background:var(--ink);color:#fff;font-size:15px;line-height:1.55}
.evening b{font-weight:600}
.evening span{color:rgba(255,255,255,.7)}
.tl{position:relative;display:flex;flex-direction:column;gap:12px}
.tl::before{content:"";position:absolute;left:31px;top:12px;bottom:12px;width:1px;background:var(--line-2)}
.ev{position:relative;display:grid;grid-template-columns:64px 1fr;gap:16px;align-items:start}
.ev time{position:relative;z-index:1;display:inline-flex;align-items:center;justify-content:center;height:30px;margin-top:18px;border-radius:999px;background:var(--bg-soft);border:1px solid var(--line-2);font-size:13px;font-weight:600;font-variant-numeric:tabular-nums;color:var(--ink-2)}
.ev-card{padding:18px 20px;border-radius:var(--radius);background:#fff;border:1px solid var(--line);transition:border-color .25s ease,box-shadow .25s ease,transform .25s var(--ease)}
.ev-card:hover{border-color:var(--line-2);box-shadow:var(--shadow);transform:translateY(-2px)}
.ev-ctx{font-size:12.5px;font-weight:500;color:var(--subtle)}
.ev-q{margin:6px 0 10px;font-size:17px;font-weight:600;letter-spacing:-.01em}
.ev-r{display:inline-flex;align-items:center;gap:8px;font-size:14px;font-weight:500;color:var(--ink-2)}
.ev-r svg{color:var(--green)}
.ev.urgent .ev-r svg{color:var(--red)}

/* Use cases */
.uc{display:grid;grid-template-columns:300px minmax(0,1fr);gap:24px;margin-top:56px}
.uc-tabs{display:flex;flex-direction:column;gap:4px}
.uc-tab{display:flex;align-items:center;gap:14px;width:100%;padding:12px 14px;border:1px solid transparent;border-radius:14px;background:transparent;text-align:left;cursor:pointer;transition:background .18s ease,border-color .18s ease}
.uc-tab:hover{background:var(--bg-soft)}
.uc-tab[aria-selected="true"]{background:#fff;border-color:var(--line);box-shadow:var(--shadow-s)}
.uc-tab .tile{width:36px;height:36px;border-radius:10px;background:var(--bg-sunk);color:var(--ink-2);transition:background .18s ease,color .18s ease}
.uc-tab[aria-selected="true"] .tile{background:var(--blue);color:#fff}
.uc-tab strong{display:block;font-size:15px;font-weight:600}
.uc-tab small{display:block;font-size:13px;color:var(--muted);line-height:1.4}
.uc-more{margin-top:12px;padding:16px;border-radius:14px;border:1px dashed var(--line-2);font-size:13.5px;color:var(--muted)}
.uc-more strong{display:block;color:var(--ink);font-size:14.5px;margin-bottom:4px}
.uc-panel{padding:40px;border-radius:var(--radius-l);background:#fff;border:1px solid var(--line);box-shadow:var(--shadow);animation:fadeUp .35s var(--ease) both}
.uc-panel .h3{font-size:28px;letter-spacing:-.03em}
.uc-panel > p{margin:12px 0 0;color:var(--muted);font-size:16.5px;max-width:560px}
.steps{display:flex;align-items:center;gap:10px;margin-top:28px;flex-wrap:wrap}
.steps span{display:inline-flex;align-items:center;gap:8px;height:34px;padding:0 12px;border-radius:999px;background:var(--bg-soft);border:1px solid var(--line);font-size:13.5px;font-weight:500}
.steps span em{font-style:normal;font-size:12px;font-weight:700;color:var(--blue)}
.steps svg{color:var(--subtle)}
.excerpt{margin-top:28px;padding:20px;border-radius:var(--radius);background:var(--bg-soft);display:flex;flex-direction:column;gap:10px}
.excerpt > small{font-size:12px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--subtle)}
.excerpt .bubble{animation:none;max-width:80%}
.excerpt .bubble.agent{background:#fff;border:1px solid var(--line)}
.excerpt .bubble.me{background:var(--ink)}
.tags{display:flex;gap:8px;flex-wrap:wrap;margin-top:20px}
.tag{display:inline-flex;align-items:center;gap:6px;height:28px;padding:0 10px;border-radius:8px;background:var(--blue-soft);color:var(--blue);font-size:13px;font-weight:500}
.uc-cta{margin-top:28px;display:flex;align-items:center;gap:16px}

/* How it works */
.how{margin-top:64px}
.how-card{display:flex;flex-direction:column;padding:28px;border-radius:var(--radius-l);background:#fff;border:1px solid var(--line)}
.how-num{font-size:13px;font-weight:700;color:var(--blue);font-variant-numeric:tabular-nums}
.how-card .h3{margin-top:10px;font-size:20px}
.how-card p{margin:8px 0 0;color:var(--muted);font-size:15px}
.mock{margin-top:24px;flex:1;min-height:236px;padding:16px;border-radius:16px;background:var(--bg-soft);border:1px solid var(--line);font-size:13px;display:flex;flex-direction:column;gap:8px}
.mock-row{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:10px;background:#fff;border:1px solid var(--line)}
.mock-row.sel{border-color:var(--blue);box-shadow:0 0 0 3px rgba(var(--blue-rgb),.1)}
.mock-row b{font-weight:600}
.mock-row small{display:block;color:var(--muted);font-size:12px}
.mock-row .r{margin-left:auto;color:var(--muted);font-size:12px}
.mock-row .no{margin-left:auto;font-size:11.5px;font-weight:600;color:var(--red);background:#FDECEC;padding:2px 8px;border-radius:6px}
.mock-input{display:flex;align-items:center;gap:8px;height:36px;padding:0 10px;border-radius:8px;border:1px solid var(--blue);background:#fff;font-size:13px}
.caret{display:inline-block;width:1.5px;height:14px;background:var(--blue);animation:caretBlink 1s steps(1) infinite}
.mock-call{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;border-radius:12px;background:var(--ink);color:#fff;padding:16px;text-align:center}
.mock-call small{color:rgba(255,255,255,.6)}
.wave{display:flex;align-items:center;gap:3px;height:28px}
.wave i{width:3px;height:100%;border-radius:2px;background:currentColor;animation:wave 1s ease-in-out infinite;transform-origin:center}
.wave i:nth-child(2n){animation-delay:-.3s}.wave i:nth-child(3n){animation-delay:-.6s}.wave i:nth-child(5n){animation-delay:-.15s}
.mock-call q{font-size:13.5px;line-height:1.45;quotes:none}
.how-foot{margin-top:40px;display:flex;align-items:center;justify-content:center;gap:16px;flex-wrap:wrap}
.how-foot span{font-size:14px;color:var(--muted)}

/* Guardrails (dark) */
.dark{background:var(--ink);color:#fff}
.dark .lead,.dark .body{color:rgba(255,255,255,.66)}
.dark .eyebrow{color:#8EA0FF}
.rules{list-style:none;margin:32px 0 0;padding:0;display:flex;flex-direction:column;gap:2px}
.rules li{display:flex;align-items:center;gap:14px;padding:14px 0;border-top:1px solid rgba(255,255,255,.1);font-size:16.5px;font-weight:500}
.rules li:last-child{border-bottom:1px solid rgba(255,255,255,.1)}
.rules svg{flex-shrink:0;color:#8EA0FF}
.tscript{padding:24px;border-radius:var(--radius-l);background:#15171D;border:1px solid rgba(255,255,255,.08)}
.tscript > small{display:block;margin-bottom:16px;font-size:12px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:rgba(255,255,255,.45)}
.tscript .bubble{animation:none;font-size:15px}
.tscript .bubble.agent{background:#22252D;color:#fff}
.tscript .bubble.agent small{color:rgba(255,255,255,.5)}
.tscript .bubble + .bubble{margin-top:10px}
.tscript .done{margin-top:16px;display:flex;align-items:center;gap:10px;padding:12px 14px;border-radius:12px;background:rgba(18,161,80,.14);color:#6EE7A4;font-size:14px;font-weight:500}

/* Knowledge */
.kb{margin-top:64px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.src{padding:22px;border-radius:var(--radius-l);background:#fff;border:1px solid var(--line)}
.src-h{display:flex;align-items:center;gap:12px}
.src-h strong{display:block;font-size:16px;font-weight:600}
.src-h small{display:block;font-size:13px;color:var(--muted)}
.src-list{margin-top:16px;display:flex;flex-direction:column;gap:6px}
.chip{display:flex;align-items:center;gap:8px;height:34px;padding:0 10px;border-radius:9px;background:var(--bg-soft);font-size:13.5px;color:var(--ink-2)}
.chip svg{color:var(--subtle);flex-shrink:0}
.kb-flow{display:flex;justify-content:center;height:56px}
.kb-flow svg{height:100%;width:auto;color:var(--line-2)}
.kb-flow path{stroke-dasharray:3 6;animation:flow 1.2s linear infinite}
.kb-core{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:0;border-radius:var(--radius-l);overflow:hidden;border:1px solid var(--line);background:#fff;box-shadow:var(--shadow)}
.kb-base{padding:28px;background:var(--blue);color:#fff;display:flex;flex-direction:column;justify-content:center;gap:10px}
.kb-base strong{font-size:22px;letter-spacing:-.02em}
.kb-base span{color:rgba(255,255,255,.78);font-size:15px}
.kb-live{padding:24px;display:flex;flex-direction:column;gap:10px}
.kb-live > small{font-size:12px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--subtle)}
.kb-live .bubble{animation:none}
.kb-src{display:flex;align-items:center;gap:8px;margin-top:4px;font-size:13px;color:var(--muted)}
.kb-src b{color:var(--ink);font-weight:600}
.trust{margin-top:20px}
.trust .card{padding:24px}
.trust .card h3{margin:14px 0 6px;font-size:17px;letter-spacing:-.01em}
.trust .card p{margin:0;font-size:14.5px;color:var(--muted)}

/* Chat */
.browser{border-radius:var(--radius-l);background:#fff;border:1px solid var(--line);box-shadow:var(--shadow-l);overflow:hidden}
.browser-bar{display:flex;align-items:center;gap:12px;height:44px;padding:0 16px;border-bottom:1px solid var(--line);background:var(--bg-soft)}
.browser-bar i{width:10px;height:10px;border-radius:50%;background:var(--line-2)}
.browser-bar .url{flex:1;max-width:280px;margin:0 auto;height:26px;display:flex;align-items:center;justify-content:center;gap:6px;border-radius:7px;background:#fff;border:1px solid var(--line);font-size:12.5px;color:var(--muted)}
.browser-in{position:relative;height:500px;padding:28px;background:linear-gradient(180deg,#fff,var(--bg-soft))}
.site-sk{display:flex;flex-direction:column;gap:10px;max-width:56%}
.site-sk b{display:block;font-size:18px;letter-spacing:-.02em}
.sk{height:10px;border-radius:5px;background:var(--bg-sunk)}
.widget{position:absolute;right:20px;bottom:20px;width:340px;max-width:calc(100% - 40px);border-radius:20px;background:#fff;border:1px solid var(--line);box-shadow:var(--shadow-l);overflow:hidden}
.widget-h{display:flex;align-items:center;gap:10px;padding:12px 14px;background:var(--ink);color:#fff}
.widget-h small{display:block;font-size:12px;color:rgba(255,255,255,.6)}
.widget-h strong{font-size:14px}
.widget-b{padding:12px;display:flex;flex-direction:column;gap:8px}
.widget-b .bubble{font-size:13.5px;padding:9px 12px;max-width:90%;animation:none}
.widget-src{align-self:flex-start;display:inline-flex;align-items:center;gap:6px;font-size:12px;color:var(--muted);padding:0 4px}
.widget-act{display:flex;gap:6px}
.widget-act button{height:34px;padding:0 12px;border-radius:9px;font-size:13px;font-weight:600;border:1px solid var(--line-2);background:#fff;cursor:default}
.widget-act button.p{background:var(--blue);border-color:var(--blue);color:#fff}
.widget-f{display:flex;align-items:center;justify-content:space-between;padding:10px 14px;border-top:1px solid var(--line);font-size:13px;color:var(--subtle)}
.feat{list-style:none;margin:32px 0 0;padding:0;display:flex;flex-direction:column;gap:20px}
.feat li{display:grid;grid-template-columns:40px 1fr;gap:16px}
.feat strong{display:block;font-size:16.5px;font-weight:600}
.feat p{margin:4px 0 0;font-size:15px;color:var(--muted)}
.fine{margin:12px 0 0;font-size:12.5px;color:var(--subtle);text-align:center}

/* Partners band */
.band{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:48px;align-items:center;padding:56px;border-radius:32px;background:var(--bg-soft);border:1px solid var(--line)}
.models{display:flex;flex-direction:column;gap:10px}
.model{display:grid;grid-template-columns:44px 1fr;gap:14px;align-items:center;padding:18px;border-radius:var(--radius);background:#fff;border:1px solid var(--line)}
.model em{font-style:normal;font-size:13px;font-weight:700;color:var(--blue)}
.model strong{display:block;font-size:16px}
.model p{margin:2px 0 0;font-size:14px;color:var(--muted)}

/* FAQ */
.faq{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,7fr);gap:72px;align-items:start}
.qa{border-top:1px solid var(--line)}
.qa:last-child{border-bottom:1px solid var(--line)}
.qa summary{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:24px 0;cursor:pointer;list-style:none;font-size:18px;font-weight:600;letter-spacing:-.015em}
.qa summary::-webkit-details-marker{display:none}
.qa summary i{position:relative;width:28px;height:28px;flex-shrink:0;border-radius:50%;background:var(--bg-sunk);transition:background .2s ease,transform .3s var(--ease)}
.qa summary i::before,.qa summary i::after{content:"";position:absolute;left:50%;top:50%;width:11px;height:1.75px;margin:-1px 0 0 -5.5px;border-radius:1px;background:var(--ink);transition:transform .3s var(--ease)}
.qa summary i::after{transform:rotate(90deg)}
.qa[open] summary i{background:var(--ink)}
.qa[open] summary i::before,.qa[open] summary i::after{background:#fff}
.qa[open] summary i::after{transform:rotate(0)}
.qa summary:hover i{background:var(--line)}
.qa[open] summary:hover i{background:var(--ink)}
.qa p{margin:-8px 0 24px;max-width:620px;color:var(--muted);font-size:16px}

/* Final CTA */
.final{position:relative;overflow:hidden;padding:96px 56px;border-radius:32px;background:var(--ink);color:#fff;text-align:center}
.final::before{content:"";position:absolute;left:50%;bottom:-320px;width:900px;height:520px;margin-left:-450px;border-radius:50%;background:radial-gradient(closest-side,rgba(var(--blue-rgb),.75),rgba(var(--blue-rgb),0));pointer-events:none}
.final > *{position:relative}
.final .lead{color:rgba(255,255,255,.68);margin:20px auto 0;max-width:520px}
.final .btns{margin-top:36px;display:flex;justify-content:center;gap:12px;flex-wrap:wrap}
.final .btn-ghost{background:transparent;color:#fff;border-color:rgba(255,255,255,.25)}
.final .btn-ghost:hover{border-color:#fff}

/* Footer */
.foot{padding:56px 0 48px}
.foot-in{display:flex;align-items:flex-start;justify-content:space-between;gap:48px;flex-wrap:wrap}
.foot-brand svg{width:104px;height:auto}
.foot-brand p{margin:14px 0 0;font-size:14px;color:var(--muted)}
.foot-cols{display:flex;gap:64px}
.foot-cols .foot-h{margin:0 0 14px;font-size:13px;font-weight:600;color:var(--ink)}
.foot-cols a{display:block;padding:4px 0;font-size:14.5px;color:var(--muted)}
.foot-cols a:hover{color:var(--ink)}
.foot-legal{margin-top:48px;padding-top:24px;border-top:1px solid var(--line);display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;font-size:13px;color:var(--subtle)}

/* Floating demo pill */
.fab{position:fixed;right:24px;bottom:24px;z-index:40;display:flex;align-items:center;gap:12px;padding:8px 8px 8px 16px;border-radius:999px;background:rgba(255,255,255,.92);-webkit-backdrop-filter:blur(16px) saturate(1.5);backdrop-filter:blur(16px) saturate(1.5);border:1px solid var(--line);box-shadow:var(--shadow-l);font-size:14.5px;font-weight:500;opacity:0;transform:translateY(16px);visibility:hidden;transition:opacity .3s ease,transform .4s var(--ease),visibility 0s linear .4s}
.fab.on{opacity:1;transform:none;visibility:visible;transition:opacity .3s ease,transform .4s var(--ease),visibility 0s}
.fab .avatars{display:flex}
.fab .avatars i{width:28px;height:28px;border-radius:50%;border:2px solid #fff;background:var(--ink);color:#fff;display:flex;align-items:center;justify-content:center;font-style:normal;font-size:11px;font-weight:700}
.fab .avatars i + i{margin-left:-8px;background:var(--blue)}
.fab .x{width:32px;height:32px;border:0;border-radius:50%;background:transparent;color:var(--subtle);display:flex;align-items:center;justify-content:center;cursor:pointer}
.fab .x:hover{background:var(--bg-sunk);color:var(--ink)}

/* Motion */
@keyframes pop{from{opacity:0;transform:translateY(6px) scale(.99)}to{opacity:1;transform:none}}
@keyframes fadeUp{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
@keyframes blink{0%,100%{opacity:.35}50%{opacity:1}}
@keyframes caretBlink{50%{opacity:0}}
@keyframes wave{0%,100%{transform:scaleY(.25)}50%{transform:scaleY(1)}}
@keyframes flow{to{stroke-dashoffset:-18}}
@keyframes marq{to{transform:translateX(-50%)}}
.reveal{opacity:0;transform:translateY(16px);transition:opacity .7s var(--ease),transform .7s var(--ease)}
.reveal.in{opacity:1;transform:none}
.rise{animation:riseIn .6s var(--ease) both}
@keyframes riseIn{from{opacity:.01;transform:translateY(10px)}to{opacity:1;transform:none}}
.rise.d1{animation-delay:.06s}.rise.d2{animation-delay:.14s}.rise.d3{animation-delay:.22s}.rise.d4{animation-delay:.32s}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}.reveal{opacity:1;transform:none}}

/* Responsive */
@media (max-width:1080px){
  .nav-links{display:none}
  .nav-right .login,.nav-right .btn-ghost{display:none}
  .day{grid-template-columns:1fr;gap:48px}
  .day-side{position:static}
  .uc{grid-template-columns:1fr}
  .uc-tabs{flex-direction:row;overflow-x:auto;scrollbar-width:none;margin:0 calc(var(--gutter) * -1);padding:2px var(--gutter)}
  .uc-tabs::-webkit-scrollbar{display:none}
  .uc-tab{width:auto;flex-shrink:0}
  .uc-tab small,.uc-more{display:none}
  .grid-2,.faq,.band{grid-template-columns:1fr;gap:48px}
  .grid-3,.kb{grid-template-columns:1fr}
  .kb-core{grid-template-columns:1fr}
}
@media (max-width:720px){
  :root{--gutter:16px}
  .section{padding:88px 0}
  .section.tight{padding:72px 0}
  .nav-in{height:64px;gap:12px}
  .nav-right{margin-left:auto}
  .nav-right .btn{height:40px;padding:0 14px;font-size:14.5px}
  .burger{display:flex;margin-left:0}
  .mnav.open{display:block;position:fixed;inset:64px 0 0;z-index:49;background:#fff;padding:16px;overflow:auto}
  .mnav a{display:flex;align-items:center;justify-content:space-between;padding:16px 4px;border-bottom:1px solid var(--line);font-size:18px;font-weight:600}
  .mnav .btn{width:100%;margin-top:20px}
  .hero{padding-top:44px}
  .hero .h1{font-size:44px}
  .seg{width:100%}
  .seg button{flex:1;justify-content:center;padding:0 8px;font-size:14px}
  .field{flex-wrap:wrap;padding:6px;border-radius:16px}
  .field .ico{margin-left:10px}
  .field input{font-size:16px}
  .field .btn{width:100%;height:50px}
  .cc{margin-left:10px}
  .stage{margin-top:48px}
  .frame{padding:5px;border-radius:16px}
  .video{border-radius:12px}
  .play{padding:14px}
  .play-btn{height:46px;font-size:14px;padding-right:16px}
  .play-btn i{width:32px;height:32px}
  .stats{flex-direction:column}
  .ev{grid-template-columns:52px 1fr;gap:10px}
  .tl::before{left:25px}
  .ev time{font-size:12px}
  .uc-panel{padding:24px}
  .uc-panel .h3{font-size:24px}
  .uc-cta{flex-direction:column;align-items:stretch}
  .band{padding:28px 20px;border-radius:24px}
  .final{padding:64px 20px;border-radius:24px}
  .final .btn{width:100%}
  .browser-in{height:540px;padding:20px}
  .site-sk{max-width:100%}
  .widget{right:12px;left:12px;bottom:12px;width:auto;max-width:none}
  .foot-cols{gap:40px;flex-wrap:wrap}
  .fab{left:16px;right:16px;bottom:16px;justify-content:space-between}
  .fab .avatars{display:none}
}
@media (max-width:720px){.hide-s{display:none}.hero-glow{width:700px;margin-left:-350px;top:-260px}}

/* Hero : l'écran de l'agent (repris de l'app, cf. vidéo) */
.stage{width:100%;max-width:1040px;margin-left:auto;margin-right:auto;text-align:left}
.app{position:relative;display:grid;grid-template-columns:300px minmax(0,1fr);border-radius:24px;background:#fff;border:1px solid var(--line);box-shadow:var(--shadow-l)}
.app-side{padding:20px;background:var(--bg-soft);border-right:1px solid var(--line);border-radius:24px 0 0 24px}
.agent-card{padding:18px;border-radius:18px;background:#fff;border:1px solid var(--line);box-shadow:var(--shadow-s)}
.agent-h{display:flex;align-items:center;gap:12px}
.agent-h strong{display:block;font-size:17px;letter-spacing:-.01em}
.agent-h small{display:block;font-size:13px;color:var(--muted)}
.agent-av{width:44px;height:44px;border-radius:50%;background:var(--blue-soft);color:var(--blue);display:flex;align-items:center;justify-content:center;box-shadow:inset 0 0 0 1px var(--blue-line)}
.wave.sm{height:18px;gap:2px}
.wave.sm i{width:2.5px}
.toggle{display:flex;align-items:center;gap:10px;margin-top:14px;font-size:14px;font-weight:500}
.toggle i{position:relative;width:38px;height:22px;border-radius:999px;background:var(--green)}
.toggle i::after{content:"";position:absolute;right:3px;top:3px;width:16px;height:16px;border-radius:50%;background:#fff;box-shadow:0 1px 2px rgba(0,0,0,.2)}
.agent-call{width:100%;margin-top:14px;cursor:default}
.app-label{display:block;margin:24px 0 8px 4px;font-size:11.5px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--subtle)}
.set{display:flex;gap:12px;padding:10px 12px;border-radius:12px;color:var(--ink-2)}
.set svg{margin-top:2px;flex-shrink:0;color:var(--muted)}
.set b{display:block;font-size:14px;font-weight:600;color:var(--ink)}
.set small{display:block;font-size:12.5px;color:var(--muted)}
.set.on{background:#fff;border:1px solid var(--line);box-shadow:var(--shadow-s)}
.set.on svg{color:var(--blue)}
.app-main{padding:32px 32px 96px}
.app-main h3{margin:0;font-size:24px;letter-spacing:-.025em}
.app-main > p{margin:6px 0 0;font-size:14.5px;color:var(--muted)}
.acts{margin-top:22px;border:1px solid var(--line);border-radius:16px}
.act{display:flex;align-items:center;gap:14px;padding:16px 18px}
.act + .act{border-top:1px solid var(--line)}
.act > span:nth-child(2){flex:1;min-width:0}
.act b{display:block;font-size:15px;font-weight:600}
.act small{display:block;font-size:13px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.act .tile{width:36px;height:36px;border-radius:10px}
.sw{position:relative;width:34px;height:20px;flex-shrink:0;border-radius:999px;background:var(--line-2)}
.sw::after{content:"";position:absolute;left:2px;top:2px;width:16px;height:16px;border-radius:50%;background:#fff;box-shadow:0 1px 2px rgba(0,0,0,.2)}
.sw.on{background:var(--blue)}
.sw.on::after{left:auto;right:2px}
.live-bar{position:absolute;left:50%;bottom:-28px;transform:translateX(-50%);display:flex;align-items:center;gap:20px;padding:10px 10px 10px 22px;border-radius:999px;background:var(--ink);color:#fff;box-shadow:0 24px 48px -16px rgba(10,11,15,.45);white-space:nowrap}
.live-bar strong{display:block;font-size:16px;letter-spacing:-.01em}
.live-bar small{display:block;font-size:12.5px;color:rgba(255,255,255,.6);font-variant-numeric:tabular-nums}
.live-bar .wave{height:26px}
.live-bar .wave i{width:2.5px}
.hang{display:inline-flex;align-items:center;gap:8px;height:42px;padding:0 18px;border-radius:999px;background:var(--red);font-size:14.5px;font-weight:600}
.recap-float{position:absolute;right:-28px;top:56px;display:flex;align-items:center;gap:12px;padding:12px 16px 12px 12px;border-radius:16px;background:#fff;border:1px solid var(--line);box-shadow:var(--shadow-l);animation:floaty 6s ease-in-out infinite}
.recap-float b{display:block;font-size:14px}
.recap-float small{display:block;font-size:12.5px;color:var(--muted)}
@keyframes floaty{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}

.vid-grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:64px;align-items:center}
.hero + .logos{padding-top:112px}

@media (max-width:1080px){
  .vid-grid{grid-template-columns:1fr;gap:32px}
  .recap-float{right:16px;top:-24px}
}
@media (max-width:720px){
  .app{grid-template-columns:1fr}
  .app-side{border-right:0;border-bottom:1px solid var(--line);border-radius:20px 20px 0 0;padding:14px}
  .app-side .app-label,.app-side .set{display:none}
  .app-main{padding:20px 16px 80px}
  .app-main h3{font-size:19px}
  .act{padding:12px}
  .act small{white-space:normal}
  .live-bar{gap:12px;padding:8px 8px 8px 16px;bottom:-22px}
  .live-bar .wave{display:none}
  .hang{height:38px;padding:0 14px;font-size:13.5px}
  .recap-float{display:none}
  .hero + .logos{padding-top:80px}
}
.nav-links > a,.nav-links > .menu > button,.nav-right .login{white-space:nowrap}
.hero{padding-bottom:48px}
@media (min-width:1081px){.recap-float{top:-26px;right:-40px}}
.menu > button svg{display:inline-block}
.site-sk{max-width:58%;gap:12px}
.site-nav{display:flex;align-items:center;gap:14px;margin-bottom:18px}
.site-nav b{font-size:15px;margin-right:auto}
.site-nav .sk{height:8px}
.site-h{font-size:22px;line-height:1.2;font-weight:700;letter-spacing:-.025em;color:var(--ink);margin-bottom:4px}
.site-btn{width:120px;height:34px;border-radius:9px;background:var(--ink);margin-top:6px}
.site-img{height:150px;margin-top:14px;border-radius:14px;background:linear-gradient(135deg,#E9E9EC,#F4F4F6)}
@media (max-width:720px){.site-sk{max-width:100%}.site-img,.site-btn{display:none}}
.uc > *,.grid-2 > *,.day > *,.faq > *,.band > *,.vid-grid > *{min-width:0}
@media (max-width:720px){.steps > svg{display:none}.ev-r{align-items:flex-start}.ev-r svg{margin-top:2px;flex-shrink:0}}
.menu > button svg{flex-shrink:0;width:14px;height:14px}.cc svg{flex-shrink:0;width:14px}
.nav-logo{flex-shrink:0}.nav-logo svg{width:116px;height:17px;max-width:none}.foot-brand svg{width:104px;height:15px}
.nav-in{gap:28px}
.nav-links{gap:2px}
.nav-links > a,.nav-links > .menu > button{padding:0 10px}
@media (max-width:1240px){.nav-right .login{display:none}}

/* ===== v8.1 : pages Fair Call / Fair Chat / Partenaires ===== */
.nav-links > .menu > button.on,.nav-links > a.on{background:var(--bg-sunk);color:var(--ink)}
.menu-item.on{background:var(--blue-soft)}
.alt{margin:18px 0 0;font-size:15px;color:var(--muted);display:flex;align-items:center;justify-content:center;gap:8px;flex-wrap:wrap}
.hero-btns{margin-top:36px;display:flex;gap:12px;justify-content:center;flex-wrap:wrap}
.fine{margin:14px 0 0;font-size:12.5px;color:var(--subtle);text-align:center}

/* Carte de renvoi vers l'autre produit */
.xsell{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:20px;padding:24px 28px;border-radius:var(--radius-l);background:var(--bg-soft);border:1px solid var(--line);transition:border-color .2s ease,box-shadow .2s ease,transform .25s var(--ease)}
a.xsell:hover{border-color:var(--line-2);box-shadow:var(--shadow);transform:translateY(-2px)}
.xsell .tile{width:48px;height:48px;border-radius:14px}
.xsell-t b{display:block;font-size:18px;font-weight:650;letter-spacing:-.015em}
.xsell-t small{display:block;margin-top:4px;font-size:15px;color:var(--muted)}

/* Bulles flottantes autour des maquettes */
.float-chip{position:absolute;z-index:2;display:flex;align-items:center;gap:12px;padding:12px 16px 12px 12px;border-radius:16px;background:#fff;border:1px solid var(--line);box-shadow:var(--shadow-l);text-align:left;animation:floaty 6s ease-in-out infinite}
.float-chip b{display:block;font-size:14px}
.float-chip small{display:block;font-size:12.5px;color:var(--muted)}
.float-chip.c1{left:-36px;top:38%}
.float-chip.c2{right:-36px;top:14%;animation-delay:-3s}

/* Fair Chat : navigateur du hero */
.browser-hero{position:relative;overflow:visible}
.browser-hero .browser-bar{border-radius:24px 24px 0 0}
.browser-hero .browser-in{height:560px;border-radius:0 0 24px 24px}
.browser-hero .widget{right:28px;bottom:28px;width:360px}
.known{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:12px;background:#fff;border:1px solid var(--line)}
.known > span:nth-child(2){flex:1;min-width:0}
.known b{display:block;font-size:14.5px}
.known small{display:block;font-size:13px;color:var(--muted)}
.known em{font-style:normal;font-size:12px;font-weight:600;color:var(--green);background:var(--green-soft);padding:3px 9px;border-radius:999px}
.known .tile{width:34px;height:34px;border-radius:10px}
.handoff{margin-top:4px;padding:12px 14px;border-radius:12px;background:#fff;border:1px solid var(--line);border-left:3px solid var(--blue);font-size:14px;color:var(--ink-2)}
.handoff b{display:block;margin-bottom:2px;color:var(--ink)}
.ringing{display:flex;align-items:center;gap:12px;margin-top:4px;padding:12px 14px;border-radius:12px;background:#fff;border:1px solid var(--line)}
.ringing b{display:block;font-size:14.5px}
.ringing small{display:block;font-size:13px;color:var(--muted)}
a.tag:hover{background:var(--blue-line)}
.integ{margin-top:28px;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.integ div{display:flex;flex-direction:column;align-items:center;gap:12px;padding:24px 12px;border-radius:var(--radius);background:var(--bg-soft);border:1px solid var(--line)}
.integ b{font-size:15px}
.code{padding:12px;border-radius:10px;background:var(--ink);color:#C9D1FF;font:12.5px/1.5 ui-monospace,SFMono-Regular,Menlo,monospace;word-break:break-all}
.final-form{max-width:560px;margin:36px auto 0;text-align:left}
.final-form .field{border-color:transparent}
.final-alt{margin:18px 0 0;font-size:14.5px}
.final-alt a{color:rgba(255,255,255,.75);text-decoration:underline;text-underline-offset:3px}
.final-alt a:hover{color:#fff}

/* Partenaires : console */
.console{position:relative;border-radius:24px;background:#fff;border:1px solid var(--line);box-shadow:var(--shadow-l)}
.console .browser-bar{border-radius:24px 24px 0 0}
.console .url{transition:color .2s ease}
.brand-sw{display:flex;padding:3px;gap:2px;border-radius:9px;background:var(--bg-sunk)}
.brand-sw button{height:26px;padding:0 10px;border:0;border-radius:7px;background:transparent;font-size:12.5px;font-weight:600;color:var(--muted);cursor:pointer}
.brand-sw button[aria-pressed="true"]{background:#fff;color:var(--ink);box-shadow:var(--shadow-s)}
.console-in{display:grid;grid-template-columns:220px minmax(0,1fr);min-height:400px}
.console-side{padding:20px 14px;border-right:1px solid var(--line);background:var(--bg-soft);border-radius:0 0 0 24px;display:flex;flex-direction:column;gap:2px}
.console-brand{height:36px;display:flex;align-items:center;padding:0 10px;margin-bottom:14px}
.brand-mark{display:flex;align-items:center;gap:8px;font-weight:700;font-size:15px;letter-spacing:-.02em}
.brand-mark i{width:22px;height:22px;border-radius:6px;background:linear-gradient(135deg,#0A0B0F,#3B3F4A)}
.cs{display:flex;align-items:center;gap:10px;height:38px;padding:0 10px;border-radius:10px;font-size:14px;font-weight:500;color:var(--ink-2)}
.cs svg{color:var(--subtle)}
.cs.on{background:#fff;border:1px solid var(--line);box-shadow:var(--shadow-s);color:var(--ink)}
.cs.on svg{color:var(--blue)}
.console.you .cs.on svg{color:var(--ink)}
.console.you .console-main .btn-primary{background:var(--ink);box-shadow:none}
.console-main{padding:28px}
.console-top{display:flex;align-items:center;justify-content:space-between;gap:12px}
.console-top .console-t{margin:0;font-weight:700;color:var(--ink);font-size:22px;letter-spacing:-.025em}
.level{margin-top:20px;display:flex;align-items:center;gap:20px;padding:14px 16px;border-radius:14px;background:var(--bg-soft);border:1px solid var(--line)}
.level b{display:block;font-size:14.5px}
.level small{display:block;font-size:12.5px;color:var(--muted)}
.level .bar{flex:1;height:8px;border-radius:999px;background:var(--line)}
.level .bar i{display:block;height:100%;border-radius:999px;background:var(--blue)}
.console.you .level .bar i{background:var(--ink)}
.tbl{margin-top:16px;border:1px solid var(--line);border-radius:14px;overflow:hidden}
.tr{display:grid;grid-template-columns:1.4fr 1fr .6fr;gap:12px;align-items:center;padding:13px 16px;font-size:14px;color:var(--ink-2)}
.tr + .tr{border-top:1px solid var(--line)}
.tr.th{background:var(--bg-soft);font-size:12px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--subtle)}
.tr b{color:var(--ink);font-weight:600}
.st{font-style:normal;font-size:12px;font-weight:600;padding:3px 9px;border-radius:999px;background:#FEF3E2;color:#9A5B00}
.st.ok{background:var(--green-soft);color:var(--green)}

.dist{margin-top:112px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:var(--bg-soft)}
.dist-in{display:grid;grid-template-columns:200px minmax(0,1fr) auto;gap:40px;align-items:center;padding-top:28px;padding-bottom:28px}
.dist p{margin:0;font-size:15px;font-weight:600}
.dist-more{font-size:14px;color:var(--muted);white-space:nowrap}
.pname{display:inline-flex;align-items:center;gap:10px;font-size:20px;font-weight:700;letter-spacing:-.02em;color:#6B7080;white-space:nowrap}
.pname img{height:24px;width:auto;filter:grayscale(1);opacity:.75}

.bento{margin-top:56px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.bc{display:flex;flex-direction:column;gap:14px;padding:28px;border-radius:var(--radius-l);background:#fff;border:1px solid var(--line)}
.bc .h3{font-size:19px}
.bc.big{grid-row:span 2;background:var(--ink);color:#fff;border-color:var(--ink)}
.bc.big .h3{font-size:30px;line-height:1.15;letter-spacing:-.03em}
.bc.big .body{color:rgba(255,255,255,.65)}
.bc.big .eyebrow.muted{color:rgba(255,255,255,.55)}
.rev{margin-top:auto;display:flex;flex-direction:column;gap:8px}
.rev div{display:flex;justify-content:space-between;gap:12px;padding:14px 16px;border-radius:12px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.1);font-size:14.5px}
.rev span{color:rgba(255,255,255,.65)}
.months{margin-top:auto;display:flex;align-items:flex-end;gap:6px;height:64px}
.months i{flex:1;border-radius:4px 4px 2px 2px;background:var(--blue-soft)}
.months i:last-child{background:var(--blue)}
.bill-sw{margin-top:auto;display:flex;padding:4px;gap:4px;border-radius:12px;background:var(--bg-sunk);font-size:13.5px;font-weight:600}
.bill-sw span{flex:1;text-align:center;padding:8px;border-radius:9px;color:var(--muted)}
.bill-sw span.on{background:#fff;color:var(--ink);box-shadow:var(--shadow-s)}
.domain{margin-top:auto;display:flex;align-items:center;height:42px;padding:0 14px;border-radius:10px;border:1px solid var(--line-2);font-size:15px;font-weight:500}
.domain span{color:var(--subtle)}
.big24{font-size:64px;line-height:1;font-weight:700;letter-spacing:-.05em;color:var(--blue)}
.big24 small{font-size:16px;font-weight:600;letter-spacing:0;color:var(--muted);margin-left:8px}

.plans{margin-top:56px}
.plan{display:flex;flex-direction:column;padding:28px;border-radius:var(--radius-l);background:#fff;border:1px solid var(--line)}
.plan.plan-hl{border-color:var(--blue);box-shadow:0 0 0 3px rgba(var(--blue-rgb),.08),var(--shadow)}
.plan .h3{margin-top:10px}
.plan > p{margin:10px 0 0;color:var(--muted);font-size:15px}
.plan dl{margin:24px 0 0;padding-top:16px;border-top:1px solid var(--line);display:flex;flex-direction:column;gap:10px}
.plan dl div{display:flex;justify-content:space-between;gap:12px;font-size:14.5px}
.plan dt{color:var(--muted)}
.plan dd{margin:0;font-weight:600;text-align:right}

.kit{margin-top:56px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.kit > div{display:flex;align-items:center;gap:16px;padding:22px;border-radius:var(--radius);background:var(--bg-soft);border:1px solid var(--line)}
.kit b{font-size:16px;font-weight:600}
.trust-row{margin-top:40px;display:flex;flex-wrap:wrap;justify-content:center;gap:10px}
.trust-row span{display:inline-flex;align-items:center;gap:8px;height:44px;padding:0 16px;border-radius:999px;background:#fff;border:1px solid var(--line);font-size:14.5px;font-weight:500}
.trust-row svg{color:var(--blue)}

@media (max-width:1080px){
  .float-chip.c1{left:12px;top:auto;bottom:-24px}
  .float-chip.c2{right:12px;top:-24px}
  .bento,.kit{grid-template-columns:repeat(2,minmax(0,1fr))}
  .bc.big{grid-column:span 2;grid-row:auto}
  .dist-in{grid-template-columns:1fr;gap:16px;text-align:center}
}
@media (max-width:720px){
  .xsell{grid-template-columns:1fr;gap:14px;padding:22px}
  .float-chip{display:none}
  .browser-hero .browser-in{height:520px}
  .browser-hero .widget{left:12px;right:12px;bottom:12px;width:auto}
  .integ{grid-template-columns:repeat(2,minmax(0,1fr))}
  .console-in{grid-template-columns:1fr}
  .console-side{display:none}
  .console-main{padding:18px}
  .tr{grid-template-columns:1.3fr 1fr;font-size:13px}
  .tr > :nth-child(2){display:none}
  .tr{grid-template-columns:1fr auto}
  .brand-sw button{padding:0 8px;font-size:12px}
  .console .url{display:none}
  .bento,.kit{grid-template-columns:1fr}
  .bc.big{grid-column:auto}
  .hero-btns .btn{width:100%}
  .final-form .field .btn{width:100%}
}
.hero .h1{max-width:1060px}
.nav-in{gap:20px}
.nav-right{gap:6px}
.nav-right .login{padding:0 8px}
@media (max-width:1320px){.nav-right .login{display:none}}
.console .float-chip.c1{top:auto;bottom:44px}

/* v8.2 : titres plus sobres */
.h1{font-size:clamp(36px,4.6vw,62px);line-height:1.04;letter-spacing:-.04em}
.hero .h1{max-width:820px;margin-top:24px}
.h2{font-size:clamp(30px,3.3vw,42px);line-height:1.1;letter-spacing:-.032em}
@media (max-width:720px){.hero .h1{font-size:36px}}

/* v8.3 : textes d'introduction plus petits */
.lead{font-size:clamp(16px,1.25vw,17.5px);line-height:1.6}
.hero .lead{font-size:17px;max-width:580px;margin-top:20px}
@media (max-width:720px){.hero .lead{font-size:16px}}

/* v8.4 : boutons d'action plus compacts */
.btn{height:42px;padding:0 18px;border-radius:10px;font-size:14.5px;gap:7px}
.btn-sm{height:36px;padding:0 14px;font-size:13.5px;border-radius:9px}
.btn-lg{height:46px;padding:0 20px;font-size:15px;border-radius:11px}
.btn svg{width:16px;height:16px}
.btn-sm svg{width:15px;height:15px}
.field{padding:6px 6px 6px 16px;border-radius:14px}
.field input{height:42px;font-size:16px}
.cc{height:42px}
.play-btn{height:48px;font-size:14.5px}
.play-btn i{width:34px;height:34px}
.hang{height:36px;font-size:13.5px;padding:0 14px}
@media (max-width:720px){.field .btn{height:44px}}

/* ===== Parcours « Devenir partenaire » ===== */
body[data-page="devenir-partenaire"]{background:var(--bg-soft)}
.flow-top{position:sticky;top:0;z-index:20;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;height:64px;padding:0 24px;background:rgba(247,247,248,.9);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}
.flow-top .nav-logo{justify-self:center}
.flow-back-site{display:inline-flex;align-items:center;gap:8px;font-size:14px;font-weight:500;color:var(--muted)}
.flow-back-site:hover{color:var(--ink)}
.flow-count{justify-self:end;font-size:13.5px;font-weight:500;color:var(--muted);font-variant-numeric:tabular-nums}
.flow-bar{position:sticky;top:64px;z-index:20;height:3px;background:var(--line)}
.flow-bar i{display:block;height:100%;width:0;background:var(--blue);transition:width .45s var(--ease)}
.flow{min-height:calc(100vh - 67px);display:flex;justify-content:center;padding:72px 16px 96px}
#flow{width:100%;max-width:620px}
.step{animation:fadeUp .4s var(--ease) both}
.step-q{margin:14px 0 0;font-size:clamp(26px,3vw,34px);line-height:1.15;letter-spacing:-.03em;font-weight:700}
.step-q:focus{outline:none}
.step-help{margin:10px 0 0;font-size:15.5px;color:var(--muted)}
.opts{margin-top:28px;display:flex;flex-direction:column;gap:10px}
.opts.grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr))}
.opt{position:relative;display:flex;align-items:center;gap:14px;min-height:56px;padding:12px 18px;border-radius:14px;border:1px solid var(--line);background:#fff;font-size:16px;font-weight:600;color:var(--ink);text-align:left;cursor:pointer;transition:border-color .15s ease,box-shadow .15s ease,transform .15s ease}
.opts.grid .opt{justify-content:center;text-align:center;font-variant-numeric:tabular-nums}
.opt svg{flex-shrink:0;color:var(--muted)}
.opt:hover{border-color:var(--ink);box-shadow:var(--shadow-s)}
.opt:active{transform:scale(.99)}
.opt[aria-checked="true"]{border-color:var(--blue);box-shadow:0 0 0 3px rgba(var(--blue-rgb),.14)}
.opt[aria-checked="true"] svg{color:var(--blue)}
.opt-2l{flex-direction:column;align-items:flex-start;gap:2px}
.opt-2l small{font-size:14px;font-weight:400;color:var(--muted)}
.fields{margin-top:28px;display:grid;grid-template-columns:1fr 1fr;gap:14px}
.f{display:flex;flex-direction:column;gap:6px}
.f.wide{grid-column:span 2}
.f span{font-size:13.5px;font-weight:600}
.f em{font-style:normal;font-weight:400;color:var(--subtle)}
.f input{height:46px;padding:0 14px;border-radius:11px;border:1px solid var(--line-2);background:#fff;font-size:16px;outline:0;transition:border-color .15s ease,box-shadow .15s ease}
.f input:focus{border-color:var(--blue);box-shadow:0 0 0 3px rgba(var(--blue-rgb),.12)}
.f.bad input{border-color:var(--red)}
.consent.left{text-align:left;margin:16px 0 0;max-width:none}
.step-nav{margin-top:28px;display:flex;justify-content:space-between;gap:10px}
.step-nav.center{justify-content:center;flex-wrap:wrap}
.cal{margin-top:28px;padding:16px;border-radius:18px;background:#fff;border:1px solid var(--line)}
.days{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px}
.cal-day{display:flex;flex-direction:column;align-items:center;gap:2px;padding:10px 4px;border-radius:12px;border:1px solid var(--line);background:#fff;cursor:pointer;transition:border-color .15s ease,background .15s ease}
.cal-day small{font-size:12px;color:var(--muted)}
.cal-day b{font-size:20px;font-variant-numeric:tabular-nums}
.cal-day:hover{border-color:var(--ink)}
.cal-day[aria-checked="true"]{background:var(--ink);border-color:var(--ink);color:#fff}
.cal-day[aria-checked="true"] small{color:rgba(255,255,255,.7)}
.slots{margin-top:14px;padding-top:14px;border-top:1px solid var(--line);display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.cal-slot{height:40px;border-radius:10px;border:1px solid var(--line);background:#fff;font-size:14.5px;font-weight:600;font-variant-numeric:tabular-nums;cursor:pointer}
.cal-slot:hover{border-color:var(--blue);color:var(--blue)}
.cal-slot[aria-checked="true"]{background:var(--blue);border-color:var(--blue);color:#fff}
.cal-slot:disabled{color:var(--subtle);text-decoration:line-through;background:var(--bg-soft);cursor:not-allowed}
.step.done{text-align:center}
.step .done-ico{display:inline-flex;align-items:center;justify-content:center;width:56px;height:56px;border-radius:50%;background:var(--green-soft);color:var(--green)}
.recap-card{margin-top:28px;padding:6px 20px;border-radius:16px;background:#fff;border:1px solid var(--line);text-align:left}
.recap-card div{display:flex;justify-content:space-between;gap:16px;padding:12px 0;font-size:14.5px}
.recap-card div + div{border-top:1px solid var(--line)}
.recap-card span{color:var(--muted)}
.recap-card b{text-align:right}
.next-h{margin:32px 0 0;font-size:17px;text-align:left}
.next{list-style:none;counter-reset:n;margin:14px 0 0;padding:0;display:flex;flex-direction:column;gap:10px;text-align:left}
.next li{counter-increment:n;display:grid;grid-template-columns:32px 1fr;column-gap:12px;font-size:14.5px}
.next li::before{content:counter(n);grid-row:span 2;width:28px;height:28px;border-radius:50%;background:var(--blue-soft);color:var(--blue);font-weight:700;font-size:13px;display:flex;align-items:center;justify-content:center}
.next span{color:var(--muted)}
@media (max-width:720px){
  .flow{padding-top:40px}
  .opts.grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .fields{grid-template-columns:1fr}
  .f.wide{grid-column:auto}
  .slots{grid-template-columns:repeat(3,minmax(0,1fr))}
  .days{gap:4px}
  .step-nav .btn{flex:1}
}
.cal-embed{margin-top:24px;min-height:700px;border-radius:18px;background:#fff;border:1px solid var(--line);overflow:hidden}
.cal-embed .calendly-inline-widget{min-width:320px;height:700px}
.cal-loading{margin:0;padding:48px 24px;text-align:center;color:var(--muted);font-size:15px}
.cal-loading a{color:var(--blue);font-weight:600}
.cal-alt{align-self:center;font-size:14px;font-weight:500;color:var(--muted);text-decoration:underline;text-underline-offset:3px}
.cal-alt:hover{color:var(--ink)}
@media (max-width:720px){.cal-embed{margin-left:-16px;margin-right:-16px;border-radius:0;border-left:0;border-right:0}.step-nav .cal-alt{flex:1;text-align:right}}
#flow:has(.step[data-step="5"]:not([hidden])){max-width:1000px}
.cal-embed .calendly-inline-widget{height:720px}
.cal-embed{min-height:720px}
.cal-embed{height:720px}
.cal-embed iframe{width:100%;height:100%!important;border:0;display:block}
@media (max-width:720px){.cal-embed{height:900px}}
.slots-wait{grid-column:1/-1;padding:10px 0;font-size:14px;color:var(--muted);text-align:center}
.slots-wait a{color:var(--blue);font-weight:600}
.handoff-cta{margin:20px 0 0}

/* v8.5 : entre 901 et 1080 px, on garde les colonnes (seule la navigation passe en menu) */
@media (min-width:901px) and (max-width:1080px){
  .section{padding:104px 0}
  .day{grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:48px}
  .day-side{position:sticky;top:110px}
  .uc{grid-template-columns:250px minmax(0,1fr)}
  .uc-tabs{flex-direction:column;overflow:visible;margin:0;padding:0}
  .uc-tab{width:100%}
  .uc-tab small,.uc-more{display:block}
  .uc-panel{padding:32px}
  .grid-2{grid-template-columns:repeat(2,minmax(0,1fr));gap:48px}
  .faq{grid-template-columns:minmax(0,4fr) minmax(0,7fr);gap:48px}
  .band{grid-template-columns:repeat(2,minmax(0,1fr));gap:40px;padding:44px}
  .grid-3,.kb{grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
  .kb-core{grid-template-columns:repeat(2,minmax(0,1fr))}
  .vid-grid{grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:40px}
  .bento,.kit{grid-template-columns:repeat(3,minmax(0,1fr))}
  .bc.big{grid-column:auto;grid-row:span 2}
  .bc.big .h3{font-size:24px}
  .dist-in{grid-template-columns:180px minmax(0,1fr) auto;gap:28px;text-align:left}
  .how-card,.plan{padding:22px}
  .app{grid-template-columns:240px minmax(0,1fr)}
  .app-main{padding:24px 24px 88px}
}

/* v8.6 : finitions typographiques et alignements */
.h1,.h2,.h3,.step-q,.xsell-t b{text-wrap:balance}
.lead,.body,.step-help,.uc-panel > p,.how-card p,.plan > p{text-wrap:pretty}
.kb-src{display:block;line-height:1.5}
.kb-src svg{display:inline-block;vertical-align:-3px;margin-right:6px}
.plan dl{margin-top:auto;padding-top:16px}
.plan > p{margin-bottom:24px}
.rev span{white-space:nowrap;text-align:right}
.rev div{align-items:center}
.bento > *,.kit > *,.plans > *{min-width:0}
@media (max-width:720px){.rev span{white-space:normal}.rev div{gap:16px}}
@media (max-width:720px){
  .stats{flex-direction:row;gap:10px}
  .stat{padding:16px}
  .stat b{font-size:36px}
  .hint{gap:6px 14px;font-size:13px}
  .vid-grid{gap:24px}
}

/* v8.7 : badge simple et rond Fairwai (repris de la v7) */
.badge-plain{padding:0 14px;gap:9px}
.dot-live{width:8px;height:8px;border-radius:50%;background:var(--green);box-shadow:0 0 0 3px rgba(18,161,80,.18)}
.orb-hero{margin-top:28px;display:flex;flex-direction:column;align-items:center;gap:14px}
.orb{position:relative;width:200px;height:200px;display:flex;align-items:center;justify-content:center}
.orb-glow{position:absolute;inset:-26px;border-radius:50%;background:radial-gradient(circle,rgba(var(--blue-rgb),.32),rgba(var(--blue-rgb),0) 66%);filter:blur(16px);animation:orbBreathe 4.5s ease-in-out infinite;transition:background .4s ease}
.orb-core{position:absolute;inset:18px;border-radius:50%;background:conic-gradient(from 0deg,var(--blue-hover),var(--blue),var(--blue-light),var(--blue-soft),var(--blue),var(--blue-light),var(--blue-hover));filter:blur(12px);animation:orbSpin 9s linear infinite;transition:filter .4s ease}
.orb-glass{position:relative;width:120px;height:120px;border-radius:50%;background:rgba(255,255,255,.26);border:1px solid rgba(255,255,255,.6);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:inset 0 2px 16px rgba(255,255,255,.55),0 18px 44px -18px rgba(var(--blue-rgb),.65);display:flex;align-items:center;justify-content:center;animation:orbBreathe 4.5s ease-in-out infinite;transition:box-shadow .4s ease}
.orb-sym{display:block}
.orb-ring{position:absolute;inset:40px;border-radius:50%;border:1.5px solid rgba(var(--blue-rgb),.35);opacity:0}
.orb-bars,.orb-check{display:none}
.orb-bars{gap:5px;align-items:center;height:40px}
.orb-bars i{width:5px;height:36px;border-radius:3px;background:#fff;animation:wave .9s ease-in-out infinite}
.orb-bars i:nth-child(2){animation-delay:.12s}.orb-bars i:nth-child(3){animation-delay:.24s}.orb-bars i:nth-child(4){animation-delay:.36s}.orb-bars i:nth-child(5){animation-delay:.48s}
.orb-status{display:flex;align-items:center;gap:10px;font-size:15px}
.orb-status b{font-weight:600}
.orb-pill{display:inline-flex;align-items:center;gap:7px;height:26px;padding:0 11px;border-radius:999px;background:var(--green-soft);color:var(--green);font-size:12.5px;font-weight:600;transition:background .25s ease,color .25s ease}
.orb-pill i{width:7px;height:7px;border-radius:50%;background:currentColor}
.orb-pill > span{display:none}
.orb-hero[data-state="idle"] .st-idle,.orb-hero[data-state="ringing"] .st-ringing,.orb-hero[data-state="live"] .st-live,.orb-hero[data-state="done"] .st-done{display:inline}
/* Le visiteur s'approche du champ : Claire est prête */
.hero:has(#phone-field:hover,#phone-field:focus-within,#vsite-field:hover,#vsite-field:focus-within) .orb-hero[data-state="idle"] .st-idle{display:none}
.hero:has(#phone-field:hover,#phone-field:focus-within,#vsite-field:hover,#vsite-field:focus-within) .orb-hero[data-state="idle"] .st-ready{display:inline}
.hero:has(#phone-field:hover,#phone-field:focus-within,#vsite-field:hover,#vsite-field:focus-within) .orb-hero[data-state="idle"] .orb-pill i{animation:onlinePulse 1.6s ease-in-out infinite}
.hero:has(#phone-field:hover,#phone-field:focus-within,#vsite-field:hover,#vsite-field:focus-within) .orb-hero[data-state="idle"] .orb-core{animation-duration:3.5s}
.orb-hero[data-state="ringing"] .orb-ring{animation:orbRipple 1.6s ease-out infinite}
.orb-hero[data-state="ringing"] .orb-ring.r2{animation-delay:.5s}
.orb-hero[data-state="ringing"] .orb-ring.r3{animation-delay:1s}
.orb-hero[data-state="ringing"] .orb-core{animation-duration:3s}
.orb-hero[data-state="ringing"] .orb-pill,.orb-hero[data-state="live"] .orb-pill{background:var(--blue-soft);color:var(--blue)}
.orb-hero[data-state="live"] .orb-sym,.orb-hero[data-state="done"] .orb-sym{display:none}
.orb-hero[data-state="live"] .orb-bars{display:flex}
.orb-hero[data-state="live"] .orb-glass{animation:orbTalk 1.1s ease-in-out infinite}
.orb-hero[data-state="done"] .orb-check{display:block}
.orb-hero[data-state="done"] .orb-pill{background:var(--bg-sunk);color:var(--muted)}
@keyframes orbSpin{to{transform:rotate(360deg)}}
@keyframes orbBreathe{0%,100%{transform:scale(1)}50%{transform:scale(1.05)}}
@keyframes orbRipple{0%{transform:scale(.8);opacity:.7}100%{transform:scale(1.7);opacity:0}}
@keyframes orbTalk{0%,100%{transform:scale(1)}30%{transform:scale(1.07)}60%{transform:scale(.98)}}
@keyframes onlinePulse{0%,100%{box-shadow:0 0 0 2px rgba(18,161,80,.3)}50%{box-shadow:0 0 0 6px rgba(18,161,80,0)}}
.hero .action{margin-top:28px}
@media (max-width:720px){.orb{width:160px;height:160px}.orb-glass{width:96px;height:96px}.orb-sym{width:50px;height:24px}.orb-hero{margin-top:20px}}

/* v8.8 : boutons plus courts */
.btn{padding:0 15px}
.btn-lg{padding:0 18px}
.btn-sm{padding:0 12px}
@media (max-width:720px){
  .final .btn,.hero-btns .btn,.uc-cta .btn{width:auto}
  .final .btns,.hero-btns{justify-content:center}
  .uc-cta{flex-direction:row;flex-wrap:wrap;align-items:center}
}

/* v8.9 : parcours partenaire au format carte (inspiré fonio) */
body[data-page="devenir-partenaire"]{background:#fff}
.flow-top{background:rgba(255,255,255,.92)}
.flow{padding:56px 16px 96px}
.flow-wrap{width:100%;max-width:680px}
.flow-wrap:has(.step[data-step="5"]:not([hidden])){max-width:760px}
.flow-seg{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;margin-bottom:28px}
.flow-seg i{height:4px;border-radius:999px;background:var(--line);transition:background .35s ease}
.flow-seg i.on{background:var(--blue)}
.flow-card{max-width:none;padding:44px 48px;border-radius:24px;background:#fff;border:1px solid var(--line);box-shadow:0 1px 2px rgba(10,11,15,.04),0 24px 48px -32px rgba(10,11,15,.18)}
.flow-card .step-q{margin-top:10px}
.f input,.sel select{background:var(--bg-soft)}
.f input:focus,.sel select:focus{background:#fff}
.sel{position:relative;display:block}
.sel select{width:100%;height:46px;padding:0 42px 0 14px;border-radius:11px;border:1px solid var(--line-2);font-size:16px;color:var(--ink);appearance:none;-webkit-appearance:none;outline:0;cursor:pointer;transition:border-color .15s ease,box-shadow .15s ease}
.sel select:focus{border-color:var(--blue);box-shadow:0 0 0 3px rgba(var(--blue-rgb),.12)}
.sel select:invalid{color:var(--subtle)}
.sel svg{position:absolute;right:14px;top:50%;margin-top:-9px;color:var(--muted);pointer-events:none}
.f.bad .sel select{border-color:var(--red)}
.step.done .done-ico{width:64px;height:64px;background:var(--blue);color:#fff;box-shadow:0 12px 28px -12px rgba(var(--blue-rgb),.7)}
.step.done .step-q{margin-top:22px}
.step.done .step-help{max-width:520px;margin-left:auto;margin-right:auto}
.done-cta{margin-top:28px}
.done-rdv{margin-top:28px;display:grid;grid-template-columns:auto 1fr;gap:4px 14px;align-items:center;padding:16px 18px;border-radius:16px;background:var(--bg-soft);border:1px solid var(--line);text-align:left}
.done-rdv b{display:block;font-size:15px}
.done-rdv small{display:block;font-size:13.5px;color:var(--muted)}
.done-rdv .link{grid-column:2;font-size:14px}
.done-recap{margin-top:14px;text-align:left}
.done-recap summary{display:inline-flex;align-items:center;gap:6px;font-size:14px;font-weight:600;color:var(--muted);cursor:pointer;list-style:none}
.done-recap summary::-webkit-details-marker{display:none}
.done-recap summary::after{content:"+";font-weight:500}
.done-recap[open] summary::after{content:"–"}
.done-recap .recap-card{margin-top:10px}
@media (max-width:720px){
  .flow{padding-top:28px}
  .flow-card{padding:26px 20px;border-radius:20px}
  .flow-seg{margin-bottom:18px}
}

/* v8.10 : barres d'action du hero plus étroites (Fair Call et Fair Chat) */
.hero .action{max-width:460px}
.hero .action .field{padding:5px 5px 5px 14px}
.hero .action .field input{font-size:15.5px}
.final-form{max-width:500px}
.hero .action .consent{max-width:440px}
.hero .action .hint{width:640px;max-width:calc(100vw - 32px);position:relative;left:50%;transform:translateX(-50%)}

/* Variante B (index-b.html) : hero en deux colonnes, rond Fairwai à gauche comme dans la v7 */
@media (min-width:721px){
  body[data-page="index-b"] .hero{padding-top:56px}
  body[data-page="index-b"] .hero-in{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);grid-template-areas:"orb badge" "orb h1" "orb action" "stage stage";column-gap:72px;align-items:start;justify-items:start;text-align:left}body[data-page="index-b"] .hero-in > .badge,body[data-page="index-b"] .hero-in > .hero-h1 > .badge{grid-area:badge;align-self:end;margin-top:40px}body[data-page="index-b"] .hero-in > .h1,body[data-page="index-b"] .hero-in > .hero-h1 > .h1{grid-area:h1;margin-top:22px;max-width:none;font-size:clamp(44px,4.6vw,64px)}
  body[data-page="index-b"] .orb-hero{grid-area:orb;align-self:center;justify-self:center;margin:0;gap:22px}
  body[data-page="index-b"] .orb{width:300px;height:300px}
  body[data-page="index-b"] .orb::before{content:"";position:absolute;inset:-46px;border-radius:50%;border:1px dashed rgba(var(--blue-rgb),.22);animation:orbSpin 60s linear infinite}
  body[data-page="index-b"] .orb-glow{inset:-44px}
  body[data-page="index-b"] .orb-core{inset:26px}
  body[data-page="index-b"] .orb-ring{inset:60px}
  body[data-page="index-b"] .orb-glass{width:180px;height:180px}
  body[data-page="index-b"] .orb-sym{width:92px;height:44px}
  body[data-page="index-b"] .orb-bars i{height:48px;width:6px}
  body[data-page="index-b"] .orb-status{font-size:16px}
  body[data-page="index-b"] .hero-in > .action{grid-area:action;margin-top:32px;max-width:460px;justify-self:start}
  body[data-page="index-b"] .hero .action .consent{text-align:left;margin-left:0}
  body[data-page="index-b"] .hero .alt{justify-content:flex-start}
  body[data-page="index-b"] .hero-in > .stage{grid-area:stage;justify-self:center;margin-top:88px}
  body[data-page="index-b"] .hero-glow{left:30%}
}
@media (min-width:721px){
  body[data-page="index-b"] .orb::before{inset:-34px}
  body[data-page="index-b"] .orb-hero{gap:60px}
}
body[data-page="index"] .hero .action,body[data-page="index-b"] .hero .action{max-width:480px}

/* Variante B : le hero occupe tout le premier écran, la maquette de l'app commence en dessous */
@media (min-width:721px){
  body[data-page="index-b"] .hero{padding-top:0}
  body[data-page="index-b"] .hero-in{grid-template-areas:"orb top" "orb badge" "orb h1" "orb action" "orb bottom" "stage stage";grid-template-rows:1fr auto auto auto 1fr auto}
  body[data-page="index-b"] .orb-hero{height:calc(100vh - 72px);height:calc(100svh - 72px);min-height:600px;max-height:1000px;justify-content:center;align-self:stretch}body[data-page="index-b"] .hero-in > .badge,body[data-page="index-b"] .hero-in > .hero-h1 > .badge{margin-top:0}
  body[data-page="index-b"] .hero-in > .stage{margin-top:40px}
}

@media (min-width:721px) and (max-width:1080px){
  body[data-page="index-b"] .hero-in{column-gap:44px;grid-template-columns:minmax(0,4fr) minmax(0,6fr)}
  body[data-page="index-b"] .orb{width:240px;height:240px}
  body[data-page="index-b"] .orb-glass{width:144px;height:144px}
  body[data-page="index-b"] .orb-sym{width:74px;height:36px}
  body[data-page="index-b"] .orb-ring{inset:48px}
  body[data-page="index-b"] .orb::before{inset:-28px}
  body[data-page="index-b"] .orb-hero{gap:48px;height:calc(100svh - 64px)}body[data-page="index-b"] .hero-in > .h1,body[data-page="index-b"] .hero-in > .hero-h1 > .h1{font-size:clamp(40px,4.8vw,52px)}
  body[data-page="index-b"] .hero-glow{left:20%}
}

@media (min-width:721px) and (max-width:900px){
  body[data-page="index-b"] .hero-in{column-gap:32px;grid-template-columns:minmax(0,4fr) minmax(0,6fr)}
  body[data-page="index-b"] .orb{width:200px;height:200px}
  body[data-page="index-b"] .orb-glass{width:120px;height:120px}
  body[data-page="index-b"] .orb-sym{width:62px;height:30px}
  body[data-page="index-b"] .orb-ring{inset:40px}
  body[data-page="index-b"] .orb::before{inset:-22px}body[data-page="index-b"] .hero-in > .h1,body[data-page="index-b"] .hero-in > .hero-h1 > .h1{font-size:40px}
  body[data-page="index-b"] .hero-in > .action{max-width:100%}
}
@media (min-width:721px) and (max-width:900px){
  body[data-page="index-b"] .hero .action .field{flex-wrap:wrap;padding:6px}
  body[data-page="index-b"] .hero .action .field .cc{margin-left:10px}
  body[data-page="index-b"] .hero .action .field .btn{width:100%;height:44px}
}

/* Variante B : plus d'air dans la colonne de texte */
@media (min-width:721px){body[data-page="index-b"] .hero-in > .h1,body[data-page="index-b"] .hero-in > .hero-h1 > .h1{margin-top:32px;line-height:1.06}
  body[data-page="index-b"] .hero-in > .action{margin-top:48px}
  body[data-page="index-b"] .hero .action .consent{margin-top:18px;line-height:1.6}
  body[data-page="index-b"] .hero .alt{margin-top:32px}
  body[data-page="index-b"] .orb-hero{gap:64px}
}
@media (min-width:1081px){body[data-page="index-b"] .hero-in > .h1,body[data-page="index-b"] .hero-in > .hero-h1 > .h1{font-size:clamp(52px,4.8vw,68px);margin-top:36px}
  body[data-page="index-b"] .hero-in > .action{margin-top:56px}
  body[data-page="index-b"] .hero .alt{margin-top:36px}
}

/* Logos clients et distributeurs en couleur */
.marquee img{filter:none;opacity:1}
.marquee img:hover{filter:none;opacity:1}
.pname img{filter:none;opacity:1}
.marquee img{width:auto;max-width:150px;object-fit:contain}
.marquee-track{gap:64px}
.marquee-track{align-items:center}
.logos .marquee{padding:6px 0}

/* Rendez-vous à deux interlocuteurs */
.hosts{display:flex;margin-bottom:6px}
.host-av{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:44px;height:44px;border-radius:50%;background:var(--c,var(--ink));color:#fff;font-size:14px;font-weight:700;letter-spacing:.02em;border:3px solid #fff;box-shadow:var(--shadow-s)}
.hosts .host-av + .host-av{margin-left:-12px}
.host-av.sm{width:22px;height:22px;font-size:9.5px;border-width:2px;box-shadow:none;margin-left:8px}
.cal-slot{display:inline-flex;align-items:center;justify-content:center}
.cal-slot[aria-checked="true"] .host-av.sm{border-color:rgba(255,255,255,.7)}
.cal-pick{display:flex;align-items:center;gap:12px;margin-top:14px;padding-top:14px;border-top:1px solid var(--line);text-align:left}
.cal-pick b{display:block;font-size:15px}
.cal-pick small{display:block;font-size:13px;color:var(--muted)}
.cal-pick .host-av{width:40px;height:40px;font-size:13px}
.done-rdv .host-av{width:40px;height:40px;font-size:13px}

/* ===== Thème de test : jaune Bpifrance (data-theme="bpi") ===== */
html[data-theme="bpi"]{--blue:#FFCD00;--blue-hover:#F5C400;--blue-soft:#FFF8D6;--blue-line:#FFE266}
html[data-theme="bpi"] .btn-primary{color:var(--ink);box-shadow:0 1px 0 rgba(255,255,255,.4) inset,0 8px 20px -10px rgba(200,150,0,.6)}
html[data-theme="bpi"] .btn-primary:hover{color:var(--ink)}
html[data-theme="bpi"] .accent{color:var(--ink);background:linear-gradient(transparent 62%,#FFCD00 62%,#FFCD00 92%,transparent 92%);padding:0 .06em}
html[data-theme="bpi"] .eyebrow{color:#8A6A00}
html[data-theme="bpi"] .dark .eyebrow{color:#FFCD00}
html[data-theme="bpi"] .link,html[data-theme="bpi"] .consent a,html[data-theme="bpi"] .slots-wait a,html[data-theme="bpi"] .cal-loading a{color:var(--ink);text-decoration:underline;text-decoration-color:#FFCD00;text-decoration-thickness:2px;text-underline-offset:4px}
html[data-theme="bpi"] .tile,html[data-theme="bpi"] .tag,html[data-theme="bpi"] .how-num,html[data-theme="bpi"] .model em,html[data-theme="bpi"] .steps span em,html[data-theme="bpi"] .menu-item .tile{color:var(--ink)}
html[data-theme="bpi"] .uc-tab[aria-selected="true"] .tile,html[data-theme="bpi"] .badge b,html[data-theme="bpi"] .pill.ring,html[data-theme="bpi"] .orb-hero[data-state="ringing"] .orb-pill,html[data-theme="bpi"] .orb-hero[data-state="live"] .orb-pill{color:var(--ink)}
html[data-theme="bpi"] .stat.hi b,html[data-theme="bpi"] .big24{color:var(--ink)}
html[data-theme="bpi"] .bubble.me,html[data-theme="bpi"] .widget-act button.p,html[data-theme="bpi"] .cal-slot[aria-checked="true"],html[data-theme="bpi"] .kb-base{color:var(--ink)}
html[data-theme="bpi"] .bubble.me small,html[data-theme="bpi"] .kb-base span{color:rgba(10,11,15,.65)}
html[data-theme="bpi"] .kb-base .tile{background:rgba(10,11,15,.08)!important;color:var(--ink)!important}
html[data-theme="bpi"] .cal-slot:hover{color:var(--ink);border-color:var(--ink)}
html[data-theme="bpi"] .step.done .done-ico{color:var(--ink)}
html[data-theme="bpi"] .step.done .done-ico svg{stroke:var(--ink)}
html[data-theme="bpi"] .play-btn i{color:var(--ink)}
html[data-theme="bpi"] .widget-h .tile{color:var(--ink)!important}
html[data-theme="bpi"] .host-av{color:#fff}
html[data-theme="bpi"] .host-av[style*="var(--blue)"]{color:var(--ink)}
html[data-theme="bpi"] .hero-glow{background:radial-gradient(closest-side,rgba(255,205,0,.2),rgba(255,205,0,0))}
html[data-theme="bpi"] .stage::before{background:radial-gradient(60% 70% at 50% 40%,rgba(255,205,0,.25),rgba(255,205,0,0))}
html[data-theme="bpi"] .final::before{background:radial-gradient(closest-side,rgba(255,205,0,.55),rgba(255,205,0,0))}
html[data-theme="bpi"] .field:focus-within,html[data-theme="bpi"] .f input:focus,html[data-theme="bpi"] .sel select:focus{box-shadow:0 0 0 4px rgba(255,205,0,.3)}
html[data-theme="bpi"] .orb-glow{background:radial-gradient(circle,rgba(255,205,0,.45),rgba(255,205,0,0) 66%)}
html[data-theme="bpi"] .orb-core{background:conic-gradient(from 0deg,#E6A800,#FFCD00,#FFE066,#FFF6CC,#FFCD00,#FFB800,#E6A800)}
html[data-theme="bpi"] .orb-glass{box-shadow:inset 0 2px 16px rgba(255,255,255,.55),0 18px 44px -18px rgba(180,130,0,.6)}
html[data-theme="bpi"] .orb-sym path{fill:#0A0B0F}
html[data-theme="bpi"] .orb-bars i{background:var(--ink)}
html[data-theme="bpi"] .orb-check{stroke:var(--ink)}
html[data-theme="bpi"] .orb-ring{border-color:rgba(200,150,0,.4)}
html[data-theme="bpi"] body[data-page="index-b"] .orb::before{border-color:rgba(200,150,0,.35)}
html[data-theme="bpi"] .plan.plan-hl{box-shadow:0 0 0 3px rgba(255,205,0,.25),var(--shadow)}
html[data-theme="bpi"] .mock-row.sel{box-shadow:0 0 0 3px rgba(255,205,0,.25)}
html[data-theme="bpi"] .opt[aria-checked="true"]{box-shadow:0 0 0 3px rgba(255,205,0,.35)}
html[data-theme="bpi"] .badge-plain .dot-live{background:#FFCD00;box-shadow:0 0 0 3px rgba(255,205,0,.3)}
html[data-theme="bpi"] .dark .rules svg{color:#FFCD00}
html[data-theme="bpi"] .code{color:#FFE066}
html[data-theme="bpi"] .excerpt .bubble.me{color:#fff}
html[data-theme="bpi"] .excerpt .bubble.me small{color:rgba(255,255,255,.65)}
.host-av.sm{width:24px;height:24px;font-size:8.5px;letter-spacing:0}

/* ===== Thèmes de couleur à tester (data-theme sur <html>) ===== */
html[data-theme="vert"]{--blue:#0E8F5F;--blue-hover:#0B7A51;--blue-soft:#E6F5EE;--blue-line:#BFE6D3;--blue-rgb:14,143,95;--blue-light:#4FC79A}
html[data-theme="violet"]{--blue:#6D3AE6;--blue-hover:#5A2BCB;--blue-soft:#F1ECFE;--blue-line:#DACDFB;--blue-rgb:109,58,230;--blue-light:#A487F5}
html[data-theme="corail"]{--blue:#E8492A;--blue-hover:#CF3B1E;--blue-soft:#FDEEEA;--blue-line:#F8CFC5;--blue-rgb:232,73,42;--blue-light:#F59A82}
html[data-theme="petrole"]{--blue:#0B6E80;--blue-hover:#095D6C;--blue-soft:#E5F3F5;--blue-line:#BCDFE5;--blue-rgb:11,110,128;--blue-light:#4FB3C4}
html[data-theme="encre"]{--blue:#0A0B0F;--blue-hover:#2B2E36;--blue-soft:#F1F1F3;--blue-line:#D9DADF;--blue-rgb:10,11,15;--blue-light:#6B6F7B}
html[data-theme="encre"] .accent{color:var(--ink);text-decoration:underline;text-decoration-thickness:.08em;text-underline-offset:.12em}
html[data-theme="bpi"]{--blue-rgb:255,205,0;--blue-light:#FFE066}

/* Sélecteur de couleurs (mode test : ?couleurs) */
.swatches{position:fixed;left:16px;bottom:16px;z-index:60;display:flex;align-items:center;gap:6px;padding:8px 10px;border-radius:999px;background:rgba(255,255,255,.95);border:1px solid var(--line);box-shadow:var(--shadow-l);font-size:12.5px;font-weight:600;color:var(--muted)}
.swatches span{margin-right:4px}
.swatches button{width:26px;height:26px;border-radius:50%;border:2px solid #fff;box-shadow:0 0 0 1px var(--line-2);cursor:pointer;padding:0}
.swatches button[aria-pressed="true"]{box-shadow:0 0 0 2px var(--ink)}

/* ===== Labo Fair Chat : testez votre site (classes préfixées lab-) ===== */
.lab{position:fixed;inset:0;z-index:100;display:flex;flex-direction:column;background:var(--bg-soft);animation:fadeUp .35s var(--ease) both}
.lab[hidden]{display:none}
.lab-top{display:flex;align-items:center;gap:16px;height:64px;padding:0 24px;background:#fff;border-bottom:1px solid var(--line)}
.lab-tag{display:inline-flex;align-items:center;gap:8px;height:28px;padding:0 12px;border-radius:999px;background:var(--blue-soft);color:var(--blue);font-size:13px;font-weight:600}
html[data-theme="bpi"] .lab-tag{color:var(--ink)}
.lab-x{margin-left:auto;width:40px;height:40px;border:0;border-radius:10px;background:transparent;display:flex;align-items:center;justify-content:center;cursor:pointer;color:var(--ink-2)}
.lab-x:hover{background:var(--bg-sunk)}
.lab-in{flex:1;min-height:0;display:grid;grid-template-columns:380px minmax(0,1fr);gap:32px;padding:32px;max-width:1280px;width:100%;margin:0 auto}
.lab-side{display:flex;flex-direction:column;min-width:0}
.lab-h{margin:0;font-size:26px;line-height:1.2;letter-spacing:-.025em;text-wrap:balance}
.lab-h .lab-dom{color:var(--blue)}
html[data-theme="bpi"] .lab-h .lab-dom{color:var(--ink);background:linear-gradient(transparent 60%,#FFCD00 60%)}
.lab-sub{margin:8px 0 0;font-size:15px;color:var(--muted)}
.lab-steps{list-style:none;margin:24px 0 0;padding:0;display:flex;flex-direction:column;gap:4px}
.lab-steps li{display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:12px;font-size:14.5px;color:var(--subtle);transition:background .25s ease,color .25s ease}
.lab-steps li i{position:relative;width:20px;height:20px;flex-shrink:0;border-radius:50%;border:2px solid var(--line-2)}
.lab-steps li.doing{color:var(--ink);background:#fff;box-shadow:var(--shadow-s)}
.lab-steps li.doing i{border-color:var(--blue);border-right-color:transparent;animation:orbSpin .8s linear infinite}
.lab-steps li.done{color:var(--ink-2)}
.lab-steps li.done i{border-color:var(--green);background:var(--green)}
.lab-steps li.done i::after{content:"";position:absolute;left:5px;top:2px;width:5px;height:9px;border:solid #fff;border-width:0 2px 2px 0;transform:rotate(45deg)}
.lab-count{font-variant-numeric:tabular-nums;font-weight:600}
.lab-ready{margin-top:20px;padding:14px 16px;border-radius:14px;background:#fff;border:1px solid var(--line);font-size:14.5px;color:var(--ink-2);animation:fadeUp .4s var(--ease) both}
.lab-cta{margin-top:16px;display:flex;flex-direction:column;align-items:flex-start;gap:10px;animation:fadeUp .4s var(--ease) both}
.lab-again{border:0;background:transparent;padding:4px 0;font:inherit;font-size:14px;font-weight:500;color:var(--muted);text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.lab-again:hover{color:var(--ink)}
.lab-note{margin:auto 0 0;padding-top:20px;font-size:12.5px;color:var(--subtle)}
.lab-stage{min-width:0;min-height:0;display:flex}
.lab-browser{flex:1;display:flex;flex-direction:column}
.lab-site{position:relative;flex:1;min-height:480px;padding:28px;background:linear-gradient(180deg,#fff,var(--bg-soft));overflow:hidden}
.lab-sk{display:flex;flex-direction:column;gap:12px;max-width:55%}
.lab-sk .site-nav b{font-size:16px}
.lab-scan{position:absolute;left:0;right:0;top:0;height:120px;background:linear-gradient(180deg,rgba(var(--blue-rgb),0),rgba(var(--blue-rgb),.14) 85%,rgba(var(--blue-rgb),.5) 100%);pointer-events:none;opacity:0}
.lab.scanning .lab-scan{opacity:1;animation:labScan 1.8s ease-in-out infinite}
@keyframes labScan{0%{transform:translateY(-120px)}100%{transform:translateY(560px)}}
.lab-widget{position:absolute;right:24px;bottom:24px;top:24px;width:380px;max-width:calc(100% - 48px);display:flex;flex-direction:column;border-radius:20px;background:#fff;border:1px solid var(--line);box-shadow:var(--shadow-l);overflow:hidden;animation:fadeUp .45s var(--ease) both}
.lab-widget[hidden]{display:none}
.lab-msgs{flex:1;min-height:0;overflow:auto;padding:14px;display:flex;flex-direction:column;gap:8px}
.lab-msgs .bubble{font-size:14px;max-width:88%;animation:pop .3s var(--ease) both}
.lab-msgs .bubble.typing{padding:12px 14px}
.slot{background:var(--blue-soft);color:inherit;border-radius:5px;padding:0 4px;box-shadow:inset 0 -1px 0 var(--blue-line);font-style:italic}
.lab-src{display:flex;align-items:center;gap:6px;margin-top:8px;font-size:12px;color:var(--muted)}
.lab-act{align-self:flex-start}
.lab-phone{display:flex;gap:6px;align-self:stretch}
.lab-phone input{flex:1;min-width:0;height:38px;padding:0 12px;border-radius:10px;border:1px solid var(--line-2);font-size:15px;outline:0}
.lab-phone input:focus{border-color:var(--blue);box-shadow:0 0 0 3px rgba(var(--blue-rgb),.15)}
.lab-phone input[aria-invalid="true"]{border-color:var(--red)}
.lab-phone .p{height:38px;padding:0 14px;border-radius:10px;border:0;background:var(--blue);color:var(--on-blue);font-weight:600;cursor:pointer}
html[data-theme="bpi"] .lab-phone .p{color:var(--ink)}
.lab-ring{animation:pop .3s var(--ease) both}
.lab-chips{display:flex;flex-wrap:wrap;gap:6px;padding:0 14px 10px}
.lab-chip{height:32px;padding:0 12px;border-radius:999px;border:1px solid var(--blue-line);background:var(--blue-soft);color:var(--ink);font:inherit;font-size:13px;font-weight:500;cursor:pointer;display:inline-flex;align-items:center}
.lab-chip:hover{border-color:var(--blue)}
.lab-chip-call{background:var(--ink);border-color:var(--ink);color:#fff}
.lab-input{display:flex;gap:6px;padding:10px;border-top:1px solid var(--line)}
.lab-input input{flex:1;min-width:0;height:40px;padding:0 12px;border-radius:10px;border:1px solid var(--line-2);font-size:15px;outline:0}
.lab-input input:focus{border-color:var(--blue)}
.lab-input button{width:40px;height:40px;border:0;border-radius:10px;background:var(--blue);color:var(--on-blue);display:flex;align-items:center;justify-content:center;cursor:pointer}
html[data-theme="bpi"] .lab-input button{color:var(--ink)}
@media (max-width:900px){
  .lab{overflow:auto}
  .lab-in{grid-template-columns:1fr;padding:16px;gap:16px}
  .lab-tag{display:none}
  .lab-note{margin-top:8px}
  .lab-site{min-height:560px;padding:16px}
  .lab-sk{max-width:100%}
  .lab-widget{left:12px;right:12px;top:auto;bottom:12px;width:auto;max-width:none;height:500px}
}

/* Bleu fairw.ai : bouton principal en dégradé, comme sur fairw.ai */
html:not([data-theme]) .btn-primary{background:linear-gradient(90deg,#1F73F3,#163D5A)}
html:not([data-theme]) .btn-primary:hover{background:linear-gradient(90deg,#1A60D1,#122F46)}
html:not([data-theme]) .orb-core{background:conic-gradient(from 0deg,#163D5A,#1F73F3,#6FA8F7,#EAF2FE,#1F73F3,#1A60D1,#163D5A)}
/* La vidéo tourne en fond : voile plus léger pour la laisser voir */
.play{background:linear-gradient(180deg,rgba(10,11,15,0) 70%,rgba(10,11,15,.22))}

/* Vidéo en grand, texte au-dessus */
.vid-stack .head{margin-bottom:48px}
.vid-big{max-width:1100px;margin:0 auto;padding:10px;border-radius:26px}
.vid-big .video{border-radius:18px}
.vid-big .play{padding:32px}
@media (max-width:720px){.vid-stack .head{margin-bottom:28px}.vid-big{padding:5px;border-radius:16px}.vid-big .video{border-radius:12px}.vid-big .play{padding:14px}}

/* Variante B : tailles ramenées (titre et rond trop gros sur grand écran) */
@media (min-width:1081px){body[data-page="index-b"] .hero-in > .h1,body[data-page="index-b"] .hero-in > .hero-h1 > .h1{font-size:clamp(42px,3.9vw,54px);margin-top:28px}
  body[data-page="index-b"] .orb{width:240px;height:240px}
  body[data-page="index-b"] .orb-glass{width:144px;height:144px}
  body[data-page="index-b"] .orb-sym{width:74px;height:36px}
  body[data-page="index-b"] .orb-core{inset:22px}
  body[data-page="index-b"] .orb-glow{inset:-34px}
  body[data-page="index-b"] .orb-ring{inset:48px}
  body[data-page="index-b"] .orb::before{inset:-28px}
  body[data-page="index-b"] .orb-bars i{height:40px;width:5px}
  body[data-page="index-b"] .orb-hero{gap:52px}
  body[data-page="index-b"] .orb-status{font-size:15px}
  body[data-page="index-b"] .hero-in > .action{margin-top:44px}
  body[data-page="index-b"] .hero .alt{margin-top:30px}
}

/* Variante B : deux colonnes aussi entre 600 et 720 px (fenêtres étroites, panneau d'aperçu) */
@media (min-width:600px) and (max-width:720px){
  body[data-page="index-b"] .hero{padding-top:0}
  body[data-page="index-b"] .hero-in{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,6fr);grid-template-areas:"orb top" "orb badge" "orb h1" "orb action" "orb bottom" "stage stage";grid-template-rows:1fr auto auto auto 1fr auto;column-gap:24px;align-items:start;justify-items:start;text-align:left}body[data-page="index-b"] .hero-in > .badge,body[data-page="index-b"] .hero-in > .hero-h1 > .badge{grid-area:badge;align-self:end;font-size:12.5px}body[data-page="index-b"] .hero-in > .badge .hide-s,body[data-page="index-b"] .hero-in > .hero-h1 > .badge .hide-s{display:none}body[data-page="index-b"] .hero-in > .h1,body[data-page="index-b"] .hero-in > .hero-h1 > .h1{grid-area:h1;margin-top:18px;font-size:32px;max-width:none}
  body[data-page="index-b"] .orb-hero{grid-area:orb;align-self:stretch;justify-self:center;justify-content:center;margin:0;gap:36px;height:calc(100svh - 64px);min-height:520px;max-height:800px}
  body[data-page="index-b"] .orb{width:160px;height:160px}
  body[data-page="index-b"] .orb-glass{width:96px;height:96px}
  body[data-page="index-b"] .orb-sym{width:50px;height:24px}
  body[data-page="index-b"] .orb-ring{inset:32px}
  body[data-page="index-b"] .orb::before{content:"";position:absolute;inset:-18px;border-radius:50%;border:1px dashed rgba(var(--blue-rgb),.22);animation:orbSpin 60s linear infinite}
  body[data-page="index-b"] .orb-status{font-size:13.5px;flex-wrap:wrap;justify-content:center}
  body[data-page="index-b"] .hero-in > .action{grid-area:action;margin-top:24px;max-width:100%;justify-self:stretch}
  body[data-page="index-b"] .hero .action .field{flex-wrap:wrap;padding:6px}
  body[data-page="index-b"] .hero .action .field .cc{margin-left:10px}
  body[data-page="index-b"] .hero .action .field .btn{width:100%;height:44px}
  body[data-page="index-b"] .hero .action .consent{text-align:left;margin-left:0}
  body[data-page="index-b"] .hero .alt{justify-content:flex-start;margin-top:20px}
  body[data-page="index-b"] .hero-in > .stage{grid-area:stage;justify-self:center;margin-top:32px}
}

/* Haut de page : plus d'espace entre les éléments */
.hero .action .consent{margin-top:18px;line-height:1.65}
.hero .alt{margin-top:28px}
body[data-page="index"] .hero .h1{margin-top:32px}
body[data-page="index"] .orb-hero{margin-top:44px;gap:18px}
body[data-page="index"] .hero .action{margin-top:40px}
@media (min-width:1081px){body[data-page="index-b"] .hero-in > .h1,body[data-page="index-b"] .hero-in > .hero-h1 > .h1{margin-top:38px}
  body[data-page="index-b"] .hero-in > .action{margin-top:56px}
  body[data-page="index-b"] .hero .action .consent{margin-top:22px}
  body[data-page="index-b"] .hero .alt{margin-top:40px}
  body[data-page="index-b"] .orb-hero{gap:60px}
}

/* Sélecteur de langue */
.flg{width:20px;height:14px;flex-shrink:0;border-radius:2px;box-shadow:0 0 0 1px rgba(10,11,15,.12)}
.lang > button{display:inline-flex;align-items:center;gap:7px;height:38px;padding:0 10px;border:0;border-radius:9px;background:transparent;font:inherit;font-size:14px;font-weight:600;color:var(--ink-2);cursor:pointer}
.lang > button:hover{background:var(--bg-sunk)}
.lang > button svg:last-child{transition:transform .25s var(--ease)}
.lang:hover > button svg:last-child,.lang:focus-within > button svg:last-child{transform:rotate(180deg)}
.lang .menu-panel{left:auto;right:-8px}
.lang-card{width:200px}
.lang-item{display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:10px;font-size:14.5px;font-weight:500;color:var(--ink)}
.lang-item:hover{background:var(--bg-soft)}
.lang-item.on{font-weight:600}
.lang-ok{margin-left:auto;color:var(--blue)}
.mlang{display:flex;gap:10px;padding:18px 4px 4px}
.mlang a{display:flex;padding:10px 11px;border-radius:10px;border:1px solid var(--line)}
.mlang a.on{border-color:var(--ink)}
.mlang .flg{width:22px;height:15px}
.flow-right{justify-self:end;display:flex;align-items:center;gap:12px}
@media (max-width:720px){.nav-right .lang{display:none}.flow-right .lang > button span{display:none}}
.lang-toast{position:fixed;left:50%;top:84px;z-index:120;transform:translate(-50%,-8px);padding:10px 16px;border-radius:12px;background:var(--ink);color:#fff;font-size:14px;font-weight:500;box-shadow:var(--shadow-l);opacity:0;pointer-events:none;transition:opacity .2s ease,transform .25s var(--ease)}
.lang-toast.on{opacity:1;transform:translate(-50%,0)}
.badge{height:auto;min-height:34px;padding-top:5px;padding-bottom:5px;line-height:1.35}
.lab-end{margin-top:6px;display:flex;flex-direction:column;align-items:flex-start;gap:6px;padding:14px;border-radius:14px;background:var(--blue-soft);border:1px solid var(--blue-line);font-size:13.5px;color:var(--ink-2);animation:pop .3s var(--ease) both}
.lab-end b{font-size:14.5px;color:var(--ink)}
.lab-end .btn{margin-top:6px}
.lab-input input:disabled{background:var(--bg-sunk);cursor:not-allowed}
.lab-input button:disabled{opacity:.4;cursor:not-allowed}

/* Réserver une démo */
body[data-page="reserver-demo"]{background:#fff}
.flow-seg.seg-2{grid-template-columns:repeat(2,1fr)}
.demo-wrap{max-width:720px}
.demo-points{list-style:none;margin:18px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:8px 18px;font-size:14px;color:var(--ink-2)}
.demo-points li{display:inline-flex;align-items:center;gap:6px}
.demo-points svg{color:var(--green)}
.step-nav.end{justify-content:flex-end}
.demo-when{display:flex;align-items:center;gap:10px;padding:10px 14px;border-radius:12px;background:var(--bg-soft);border:1px solid var(--line);font-size:14px;font-weight:500;margin-bottom:18px}
.demo-when .host-av.sm{margin-left:0}
.demo-change{margin-left:auto;border:0;background:transparent;font:inherit;font-size:13.5px;font-weight:600;color:var(--blue);cursor:pointer}
html[data-theme="bpi"] .demo-change{color:var(--ink);text-decoration:underline}
.opts-row{display:flex;gap:8px;flex-wrap:wrap}
.opt.opt-sm{min-height:42px;padding:8px 16px;font-size:14.5px}
.f.bad .opts-row .opt{border-color:var(--red)}
/* Photos dans les ronds des agendas (les initiales restent si la photo manque) */
.host-av{position:relative;overflow:hidden}
.host-av img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border-radius:50%}
.pname img{width:auto;max-width:160px;object-fit:contain}
/* Page d'accueil (variante B) sur mobile : version verticale, mêmes espacements que la version A */
@media (max-width:599px){
  body[data-page="index-b"] .hero .h1{margin-top:32px}
  body[data-page="index-b"] .orb-hero{margin-top:44px;gap:18px}
  body[data-page="index-b"] .hero .action{margin-top:40px}
}
/* En-tête mobile : le menu (☰) ne doit jamais être écrasé */
.burger{flex-shrink:0;width:44px}
@media (max-width:720px){
  .nav-logo{flex-shrink:0}
  .nav-logo svg{width:100px;height:15px}
  .nav-right{min-width:0}
  .nav-right .btn{padding:0 12px;font-size:13.5px}
}
@media (max-width:420px){.hide-xs{display:none}}
@media (min-width:721px) and (max-width:900px){body[data-page="index-b"] .hero-in > .badge .hide-s,body[data-page="index-b"] .hero-in > .hero-h1 > .badge .hide-s{display:none}}


/* ===== Onboarding vocal (vlab-) : site → numéro pendant la lecture → fiche → appel ===== */
.vsite-hint{justify-content:flex-start}
body[data-page="index-b"] .vsite-hint{margin-top:14px}
@media (max-width:599px){.vsite-hint{justify-content:center}}
.vlab-stage{min-width:0;display:flex;align-items:flex-start;justify-content:center;padding-top:8px}
.vlab-card{width:100%;max-width:520px;padding:32px;border-radius:24px;background:#fff;border:1px solid var(--line);box-shadow:var(--shadow-l);animation:fadeUp .4s var(--ease) both}
.vlab-card h3{margin:12px 0 0;font-size:24px;line-height:1.2;letter-spacing:-.025em;text-wrap:balance}
.vlab-card > p{margin:10px 0 0;font-size:15px;color:var(--muted)}
.vlab-kicker{display:inline-flex;align-items:center;gap:8px;height:30px;padding:0 12px;border-radius:999px;background:var(--blue-soft);color:var(--blue);font-size:13px;font-weight:600}
.vlab-kicker .dots i{background:currentColor}
.vlab-card.ready .vlab-kicker{background:var(--green-soft);color:var(--green)}
html[data-theme="bpi"] .vlab-kicker{color:var(--ink)}
.vlab-phone{margin-top:22px;display:flex;gap:8px;padding:6px;border-radius:14px;border:1px solid var(--line-2);box-shadow:var(--shadow)}
.vlab-card.ready .vlab-phone{border-color:var(--blue);box-shadow:0 0 0 4px rgba(var(--blue-rgb),.14),var(--shadow)}
.vlab-phone select{height:42px;padding:0 8px;border:0;border-right:1px solid var(--line);background:transparent;font-size:15px;outline:0;cursor:pointer}
.vlab-phone input{flex:1;min-width:0;height:42px;border:0;outline:0;padding:0 8px;font-size:16px;background:transparent}
.vlab-card .consent.left{margin-top:14px}
.vlab-card.waiting .vlab-phone{opacity:.6;pointer-events:none}
.vlab-agent-h{display:flex;align-items:center;gap:14px}
.vlab-agent-h h3{margin:0}
.vlab-agent-h small{display:block;font-size:14px;color:var(--muted)}
.vlab-agent-h .pill{margin-left:auto}
.vlab-av{width:56px;height:56px;flex-shrink:0;border-radius:50%;background:conic-gradient(from 0deg,var(--blue-hover),var(--blue),var(--blue-light),var(--blue));color:#fff;display:flex;align-items:center;justify-content:center;box-shadow:0 10px 24px -10px rgba(var(--blue-rgb),.7)}
.vlab-av.sm{width:40px;height:40px}
.vlab-learn{list-style:none;margin:22px 0 0;padding:0;display:flex;flex-direction:column;gap:10px;font-size:15px}
.vlab-learn li{display:flex;align-items:center;gap:10px}
.vlab-learn svg{color:var(--green);flex-shrink:0}
.vlab-num{margin-top:22px;display:flex;justify-content:space-between;gap:12px;padding:12px 14px;border-radius:12px;background:var(--bg-soft);border:1px solid var(--line);font-size:14px;color:var(--muted)}
.vlab-num b{color:var(--ink);font-variant-numeric:tabular-nums}
.vlab-go{width:100%;margin-top:16px}
.vlab-card .lab-again{display:block;margin:12px auto 0}
.vlab-call-h{display:flex;align-items:center;gap:12px;padding-bottom:14px;border-bottom:1px solid var(--line)}
.vlab-call-h b{display:block;font-size:15px}
.vlab-call-h small{display:block;font-size:13px;color:var(--muted)}
.vlab-call-h .pill{margin-left:auto;flex-shrink:0}
.vlab-msgs{max-height:320px;overflow:auto;padding:14px 0;display:flex;flex-direction:column;gap:8px}
.vlab-msgs .bubble{font-size:14.5px}
#vlab-live .recap{margin:4px 0 0}
.vlab-end{margin-top:16px;display:flex;align-items:center;gap:16px;flex-wrap:wrap}
@media (max-width:900px){.vlab-card{padding:22px;max-width:none}.vlab-phone{flex-wrap:wrap}.vlab-phone .btn{width:100%}}
@media (min-width:600px){body[data-page="index-b"] .hero .action .hint{width:auto;max-width:none;left:auto;transform:none;justify-content:flex-start}}
.vlab .lab-h .vlab-dom{color:var(--blue)}
/* Onboarding vocal sur mobile : l'action (numéro, fiche, appel) d'abord, les étapes ensuite */
@media (max-width:900px){
  .vlab .lab-in{display:flex;flex-direction:column}
  .vlab .vlab-stage{order:-1;padding-top:0}
  .vlab .lab-h{font-size:20px}
  .vlab .lab-steps{margin-top:14px}
  .vlab .lab-steps li{padding:7px 10px;font-size:13.5px}
  .vlab .vlab-card h3{font-size:21px}
}
.vlab-card{max-width:560px}
.vlab-phone .btn{flex-shrink:0}

/* Test A/B du haut de page */
html[data-ab="tel"] .ab-site,html:not([data-ab="tel"]) .ab-tel{display:none!important}

/* ===== Passe accessibilité (contrastes WCAG AA, cibles tactiles) ===== */
:root{--subtle:#6E7380;--blue-ink:#1A66DB;--green-ink:#0B7A3B}
html[data-theme]{--blue-ink:var(--blue)}
/* Texte bleu en petit corps : bleu légèrement plus foncé (5,3:1) ; le bleu de marque reste pour les grands titres */
.link,.eyebrow,.tag,.how-num,.model em,.vlab-kicker,.lab-tag,.lang-ok,.demo-change,.steps span em,.tile,.slot-link,.lab-h .lab-dom{color:var(--blue-ink)}
.dark .eyebrow{color:#8EA0FF}
html:not([data-theme]) .btn-primary{background:linear-gradient(90deg,#1A66DB,#163D5A)}
html:not([data-theme]) .btn-primary:hover{background:linear-gradient(90deg,#1658BE,#122F46)}
/* Vert des pastilles « Disponible / En ligne / Actif » */
.orb-pill,.pill.live,.st.ok,.known em,.vlab-card.ready .vlab-kicker{color:var(--green-ink)}
/* Cibles tactiles d'au moins 44 px sur mobile */
@media (max-width:768px){
  .nav-logo,.flow-back-site{min-height:44px;display:inline-flex;align-items:center}
  .uc-cta .link,.alt .link,.xsell .link{min-height:44px}
  .brand-sw button{height:36px;padding:0 12px}
}
/* Titre de la home : badge + accroche dans un seul h1, sans changer la mise en page */
.hero-h1{display:contents;margin:0;font-size:inherit;font-weight:inherit;line-height:inherit;letter-spacing:normal}
.hero-h1 > .h1{display:block}

/* Passe mobile (26/10) */
.pp-btns{margin-top:28px;display:flex;gap:10px;flex-wrap:wrap}
@media (max-width:600px){
  .section{padding:64px 0}
  .section.tight{padding:56px 0}
  /* Boutons en paire : empilés, même largeur (celle du plus long), centrés */
  .hero-btns,.final .btns{display:grid;grid-template-columns:max-content;justify-content:center;gap:10px}
  .hero-btns .btn,.final .btns .btn{width:100%;justify-content:center}
  .pp-btns{display:grid;grid-template-columns:max-content;gap:10px}
  .pp-btns .btn{width:100%;justify-content:center}
  /* Modèles partenaires : numéro au-dessus du titre, plus de colonne vide */
  .model{grid-template-columns:1fr;gap:6px;align-items:start}
  /* Garanties : liste alignée à gauche plutôt que des pastilles qui se coupent */
  .trust-row{flex-direction:column;align-items:stretch;gap:8px}
  .trust-row span{height:auto;min-height:44px;padding:10px 16px;border-radius:14px;line-height:1.35}
  /* Réserver une démo : créneaux plus aérés, étape sur une ligne */
  .slots{grid-template-columns:repeat(2,minmax(0,1fr))}
  .cal-slot{gap:8px}
  .flow-top{padding:0 16px}
  .flow-count{white-space:nowrap;font-size:13px}
}
/* Bouton flottant : texte sur deux lignes nettes sur mobile */
.fab-t b{font-weight:500}
.fab-t small{font-size:inherit}
@media (max-width:600px){
  .fab{padding:8px 6px 8px 18px;gap:8px}
  .fab-t{display:flex;flex-direction:column;line-height:1.25;min-width:0}
  .fab-t b{font-weight:600;font-size:14.5px}
  .fab-t small{font-size:13px;color:var(--muted)}
  .fab .btn{flex:none}
  .fab .x{width:36px;height:36px;flex:none}
}
@media (max-width:600px){
  .fab{gap:6px;padding-left:16px}
  .fab-t small{white-space:nowrap;font-size:12.5px}
  .fab .btn{padding:0 14px}
  .fab .x{width:32px}
}
@media (max-width:600px){.fab{gap:4px;padding-left:14px}.fab .btn{padding:0 12px}}

/* 27/10 : en-tête plus large (logo et menu décalés vers la gauche) */
.nav .nav-in{max-width:1340px}
/* Vidéo dans le hero, écran de l'agent juste dessous */
.hero-vid{max-width:1100px}
.hero-app{padding:24px 0 56px}
.hero-app .stage{margin-top:0}
@media (max-width:720px){.hero-app{padding:8px 0 32px}}
/* Bouton « avec le son » plus discret sur téléphone : il ne masque plus la vidéo */
@media (max-width:600px){
  .vid-big .play{padding:10px}
  .vid-big .play-btn{height:36px;gap:8px;padding:0 12px 0 4px;font-size:13px}
  .vid-big .play-btn i{width:28px;height:28px}
  .vid-big .play-btn i svg{width:12px;height:12px}
}

/* 27/10 : sections du menu cadrées dans un écran d'ordinateur (1440 × 900) */
@media (min-width:1025px){
  #cas-usage .head{max-width:none;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,420px);column-gap:64px;align-items:end}
  #cas-usage .head .eyebrow{grid-column:1/-1}
  #cas-usage .head .lead{margin:0 0 6px}
  #cas-usage .uc{margin-top:44px}
  #comment .how{margin-top:36px}
  #comment .how-foot{margin-top:20px}
}

/* ============ Page Intégrations ============ */
.ig-hero{padding:64px 0 24px}
.ig-hero-in{display:grid;grid-template-columns:minmax(0,1fr) 460px;gap:64px;align-items:center}
.ig-hero .h1{margin-top:22px;max-width:600px}
.ig-hero .lead{margin-top:20px;max-width:540px}
.ig-search{position:relative;margin-top:32px;max-width:520px}
.ig-search .ico{position:absolute;left:18px;top:50%;margin-top:-10px;color:var(--subtle);pointer-events:none}
.ig-search input{width:100%;height:56px;padding:0 20px 0 50px;border-radius:14px;border:1px solid var(--line-2);background:#fff;box-shadow:var(--shadow-s);font-size:16px;outline:none;transition:border-color .15s ease,box-shadow .15s ease}
.ig-search input::placeholder{color:var(--subtle)}
.ig-search input:focus{border-color:var(--blue);box-shadow:0 0 0 4px rgba(var(--blue-rgb),.12)}
.ig-count{margin:14px 0 0;font-size:14px;color:var(--muted)}
.ig-count b{color:var(--ink);font-weight:600}

/* Orbite de logos autour du symbole Fairwai */
.ig-orbit{position:relative;width:460px;height:460px}
.ig-orbit .ring{position:absolute;left:50%;top:50%;border-radius:50%;border:1px dashed var(--line-2);transform:translate(-50%,-50%)}
.ig-orbit .r1{width:248px;height:248px}
.ig-orbit .r2{width:428px;height:428px}
.ig-core{position:absolute;left:50%;top:50%;width:104px;height:104px;margin:-52px 0 0 -52px;border-radius:50%;background:#fff;border:1px solid var(--line);box-shadow:0 0 0 12px rgba(var(--blue-rgb),.06),var(--shadow);display:flex;align-items:center;justify-content:center}
.ig-core img{width:52px;height:auto}
.ig-orbit .spin{position:absolute;inset:0;animation:igSpin 70s linear infinite}
.ig-orbit .s2{animation-duration:110s;animation-direction:reverse}
.ig-orbit .spin i{--r:124px;position:absolute;left:50%;top:50%;width:56px;height:56px;margin:-28px 0 0 -28px;border-radius:50%;background:#fff;border:1px solid var(--line);box-shadow:var(--shadow);display:flex;align-items:center;justify-content:center;transform:rotate(var(--a)) translateX(var(--r)) rotate(calc(-1 * var(--a)))}
.ig-orbit .s2 i{--r:214px;width:52px;height:52px;margin:-26px 0 0 -26px}
.ig-orbit .spin i img{width:26px;height:26px;object-fit:contain;animation:igSpin 70s linear infinite reverse}
.ig-orbit .s2 i img{animation-duration:110s;animation-direction:normal}
@keyframes igSpin{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.ig-orbit .spin,.ig-orbit .spin i img{animation:none}}

/* Catalogue */
.ig-cat-sec{padding:72px 0 112px}
.ig-cat{display:grid;grid-template-columns:220px minmax(0,1fr);gap:56px;align-items:start}
.ig-side{position:sticky;top:96px;display:flex;flex-direction:column;gap:2px}
.ig-side-h{margin:0 0 10px 12px;font-size:12.5px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--subtle)}
.ig-side a{display:flex;align-items:center;gap:10px;height:40px;padding:0 12px;border-radius:10px;font-size:15px;font-weight:500;color:var(--ink-2);transition:background .15s ease,color .15s ease}
.ig-side a svg{color:var(--subtle);transition:color .15s ease}
.ig-side a em{margin-left:auto;font-style:normal;font-size:12.5px;color:var(--subtle);font-variant-numeric:tabular-nums}
.ig-side a:hover{background:var(--bg-soft)}
.ig-side a.on{background:var(--blue-soft);color:var(--blue)}
.ig-side a.on svg,.ig-side a.on em{color:var(--blue)}
.ig-side a.off{opacity:.4;pointer-events:none}
.ig-group + .ig-group{margin-top:56px}
.ig-group-h{display:flex;align-items:baseline;gap:16px;flex-wrap:wrap;margin-bottom:18px}
.ig-group-h p{margin:0;font-size:15px;color:var(--muted)}
.ig-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.ig-card{position:relative;display:flex;flex-direction:column;padding:20px;border-radius:var(--radius);background:#fff;border:1px solid var(--line);transition:border-color .18s ease,box-shadow .18s ease,transform .18s var(--ease)}
.ig-card:hover{border-color:var(--line-2);box-shadow:var(--shadow);transform:translateY(-2px)}
.ig-card h3{margin:16px 0 0;display:flex;align-items:center;gap:8px;font-size:16px;line-height:1.3;font-weight:650;letter-spacing:-.01em}
.ig-card p{margin:6px 0 0;font-size:14px;line-height:1.5;color:var(--muted)}
.ig-logo{width:44px;height:44px;border-radius:12px;background:#fff;border:1px solid var(--line);display:flex;align-items:center;justify-content:center;overflow:hidden}
.ig-logo img{object-fit:contain}
.ig-logo-fw{background:var(--blue-soft);border-color:var(--blue-line);color:var(--blue)}
.ig-soon{display:inline-flex;align-items:center;height:22px;padding:0 8px;border-radius:999px;background:var(--bg-sunk);font-size:11.5px;font-weight:600;color:var(--muted);letter-spacing:0}
.ig-card.is-soon .ig-logo{opacity:.7}
.ig-card[hidden],.ig-group[hidden]{display:none}
.ig-empty{padding:40px 32px;border-radius:var(--radius-l);border:1px dashed var(--line-2);text-align:center}
.ig-empty b{font-size:17px;font-weight:600}
.ig-empty p{margin:8px auto 18px;max-width:440px;font-size:15px;color:var(--muted)}
.ig-ask{margin-top:56px;display:flex;align-items:center;justify-content:space-between;gap:32px;padding:28px 32px;border-radius:var(--radius-l);background:var(--bg-soft);border:1px solid var(--line)}
.ig-ask b{font-size:18px;font-weight:650;letter-spacing:-.015em}
.ig-ask p{margin:6px 0 0;max-width:560px;font-size:15px;color:var(--muted)}
.ig-ask .btn{flex-shrink:0}
.ig-mini{width:24px;height:24px;border-radius:7px;border:1px solid var(--line);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.ig-mini img{width:14px;height:14px}
.mock-row .r.ok{color:var(--green-ink,#0B7A3B);font-weight:600}
body[data-page="integrations"] #branchement .mock{min-height:0}
.mock-row.ig-sel{border-color:var(--blue);box-shadow:0 0 0 3px rgba(var(--blue-rgb),.1)}

@media (max-width:1100px){
  .ig-hero-in{grid-template-columns:minmax(0,1fr) 380px;gap:40px}
  .ig-orbit{width:380px;height:380px}
  .ig-orbit .r1{width:208px;height:208px}.ig-orbit .r2{width:352px;height:352px}
  .ig-orbit .spin i{--r:104px}.ig-orbit .s2 i{--r:176px;width:46px;height:46px;margin:-23px 0 0 -23px}
  .ig-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:900px){
  .ig-hero-in{grid-template-columns:1fr;justify-items:center;text-align:center}
  .ig-hero .h1,.ig-hero .lead{margin-left:auto;margin-right:auto}
  .ig-search{margin-left:auto;margin-right:auto;width:100%}
  .ig-orbit{width:300px;height:300px;margin-top:8px}
  .ig-orbit .r1{width:164px;height:164px}.ig-orbit .r2{width:280px;height:280px}
  .ig-core{width:76px;height:76px;margin:-38px 0 0 -38px;box-shadow:0 0 0 8px rgba(var(--blue-rgb),.06),var(--shadow)}
  .ig-core img{width:38px}
  .ig-orbit .spin i{--r:82px;width:42px;height:42px;margin:-21px 0 0 -21px}
  .ig-orbit .s2 i{--r:140px;width:40px;height:40px;margin:-20px 0 0 -20px}
  .ig-orbit .spin i img{width:20px;height:20px}
  .ig-cat{grid-template-columns:1fr;gap:28px}
  .ig-side{top:64px;z-index:5;flex-direction:row;gap:6px;overflow-x:auto;margin:0 calc(-1 * var(--gutter));padding:10px var(--gutter);background:rgba(255,255,255,.92);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-bottom:1px solid var(--line);scrollbar-width:none}
  .ig-side::-webkit-scrollbar{display:none}
  .ig-side-h{display:none}
  .ig-side a{flex-shrink:0;height:36px;border:1px solid var(--line);border-radius:999px;font-size:14px;background:#fff}
  .ig-side a em{margin-left:2px}
  .ig-group{scroll-margin-top:140px}
}
@media (max-width:600px){
  .ig-hero{padding:40px 0 8px}
  .ig-orbit{display:none}
  .ig-search input{height:52px;font-size:15px}
  .ig-count{font-size:13px}
  .ig-cat-sec{padding:40px 0 72px}
  .ig-grid{grid-template-columns:1fr;gap:10px}
  .ig-card{flex-direction:row;flex-wrap:wrap;align-items:flex-start;column-gap:14px;padding:16px}
  .ig-card .ig-logo{width:40px;height:40px;border-radius:11px}
  .ig-card h3{margin:0;flex:1;min-height:40px}
  .ig-card p{flex-basis:100%;margin-top:10px}
  .ig-group + .ig-group{margin-top:40px}
  .ig-group-h{display:block;margin-bottom:14px}
  .ig-group-h p{margin-top:4px;font-size:14px}
  .ig-ask{flex-direction:column;align-items:flex-start;gap:18px;padding:24px 20px}
  .ig-ask .btn{width:100%;justify-content:center}
}

/* Retours de Jules (28/10) */
/* Bouton principal : le survol assombrit le dégradé en fondu (un dégradé ne se transitionne pas, d'où le voile) */
.btn-primary{position:relative;isolation:isolate}
.btn-primary::after{content:"";position:absolute;inset:-1px;border-radius:inherit;background:rgba(10,11,15,.14);opacity:0;transition:opacity .2s ease;z-index:-1;pointer-events:none}
.btn-primary:hover::after{opacity:1}
html:not([data-theme]) .btn-primary:hover{background:linear-gradient(90deg,#1A66DB,#163D5A)}
.btn-primary:hover{box-shadow:0 1px 0 rgba(255,255,255,.18) inset,0 10px 24px -10px rgba(var(--blue-rgb),.75)}
/* « Produits » et langue : chevron plus petit, plus proche du texte, en gris */
.nav-links > .menu > button{gap:5px;padding:0 9px 0 12px}
.nav-links > .menu > button svg,.lang > button svg:last-child{width:12px;height:12px;flex-shrink:0;color:var(--subtle);transition:transform .25s var(--ease),color .2s ease}
.nav-links > .menu > button:hover svg,.lang > button:hover svg:last-child{color:var(--ink)}
.lang > button{gap:6px}
/* « Se connecter » : même pastille au survol que le menu, séparé de la langue par un filet */
@media (min-width:1321px){
  .nav-right .login{display:inline-flex;align-items:center;height:38px;padding:0 12px;border-radius:9px;transition:background .2s ease,color .2s ease}
  .nav-right .login:hover{background:var(--bg-sunk)}
  .nav-right .lang{position:relative;padding-right:9px;margin-right:2px}
  .nav-right .lang::after{content:"";position:absolute;right:0;top:50%;width:1px;height:18px;margin-top:-9px;background:var(--line-2)}
}

/* =====================================================================
   v9 (29/10/2026) : menu façon fonio, Fair Note, Solutions, Ressources, langues
   Classes préfixées (mm-, mnav-, pc-, sx-, so-, fn-, bl-, post-, sec-, dc-, cl-, pt-) pour ne rien casser ailleurs
   ===================================================================== */
.skip{position:absolute;left:12px;top:-60px;z-index:200;padding:10px 14px;border-radius:10px;background:var(--ink);color:#fff;font-size:14px;font-weight:600;transition:top .2s ease}
.skip:focus{top:12px}

/* Menu : Solutions en deux colonnes */
.mm-new{display:inline-flex;align-items:center;height:18px;margin-left:6px;padding:0 7px;border-radius:999px;background:var(--blue-soft);color:var(--blue-ink);font-style:normal;font-size:11px;font-weight:650;letter-spacing:.01em;vertical-align:2px}
.mm-card{width:660px;padding:12px}
.mm-cols{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px 12px}
.mm-h{display:block;padding:8px 10px 6px;font-size:12px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--subtle)}
.mm-item{display:flex;align-items:flex-start;gap:12px;padding:9px 10px;border-radius:11px;transition:background .15s ease}
.mm-item:hover{background:var(--bg-soft)}
.mm-item.on{background:var(--blue-soft)}
.mm-item svg{flex-shrink:0;margin-top:2px;color:var(--blue-ink)}
.mm-item b{display:block;font-size:14.5px;font-weight:600;color:var(--ink)}
.mm-item small{display:block;margin-top:1px;font-size:13px;line-height:1.35;color:var(--muted)}
.mm-foot{display:flex;align-items:center;justify-content:space-between;margin:8px 2px 0;padding:12px 10px 4px;border-top:1px solid var(--line);font-size:14px;font-weight:600;color:var(--blue-ink)}
.mm-foot svg{transition:transform .25s var(--ease)}
.mm-foot:hover svg{transform:translateX(3px)}
.mm-res{width:330px}
.menu-item strong .mm-new{vertical-align:1px}

/* Menu mobile (burger dès 1080 px) */
.mnav-h{display:block;padding:20px 4px 4px;font-size:12px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--subtle)}
.mnav-d{border-bottom:1px solid var(--line)}
.mnav-d summary{display:flex;align-items:center;justify-content:space-between;padding:16px 4px;font-size:18px;font-weight:600;cursor:pointer;list-style:none}
.mnav-d summary::-webkit-details-marker{display:none}
.mnav-d summary svg{color:var(--subtle);transition:transform .25s var(--ease)}
.mnav-d[open] summary svg{transform:rotate(180deg)}
.mnav-d .mnav-h{padding-top:6px}
.mnav-sub{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 16px;padding:0 4px 12px}
.mnav .mnav-sub a{display:block;padding:10px 0;border:0;font-size:15.5px;font-weight:500;color:var(--ink-2)}
.mnav .mnav-all{font-size:15.5px;color:var(--blue-ink);border-bottom:0}
.mnav-btns{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:20px}
.mnav .mnav-btns .btn{width:100%;margin:0}
@media (max-width:1080px){
  .burger{display:flex;margin-left:4px}
  .mnav.open{display:block;position:fixed;inset:72px 0 0;z-index:49;background:#fff;padding:8px max(16px,calc((100vw - 720px) / 2)) 32px;overflow:auto}
  .mnav > a{display:flex;align-items:center;justify-content:space-between;padding:16px 4px;border-bottom:1px solid var(--line);font-size:18px;font-weight:600}
}
@media (max-width:720px){.mnav.open{inset:64px 0 0}.mnav-sub{grid-template-columns:1fr}}

/* Pied de page enrichi */
.foot-brand{max-width:280px}
.foot-cta{display:flex;gap:8px;flex-wrap:wrap;margin-top:20px}
.foot-cols{gap:48px}
.foot-langs{display:flex;gap:14px;flex-wrap:wrap}
.foot-langs a:hover,.foot-langs a[aria-current]{color:var(--ink)}
.foot-in{flex-direction:column;gap:40px}.foot-brand{max-width:none;display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;column-gap:24px}.foot-brand svg{grid-column:1}.foot-brand p{grid-column:1;max-width:520px}.foot-cta{grid-column:2;grid-row:1 / span 2;margin-top:0}
.foot-cols{width:100%;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:32px}
@media (max-width:720px){.foot-brand{display:block}.foot-cta{margin-top:20px}}
@media (max-width:900px){.foot-cols{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:600px){.foot-cols{grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 20px}}

/* Fil d'Ariane */
.crumbs{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:8px;margin-bottom:22px;font-size:13.5px;color:var(--muted)}
.crumbs a{color:var(--muted);transition:color .2s ease}
.crumbs a:hover{color:var(--ink)}
.crumbs svg{color:var(--line-2)}
.crumbs [aria-current]{color:var(--ink-2);font-weight:500}

/* Accueil : les trois produits */
.pc-grid{margin-top:48px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.pc{position:relative;display:flex;flex-direction:column;padding:28px;border-radius:var(--radius-l);background:#fff;border:1px solid var(--line);transition:border-color .2s ease,box-shadow .2s ease,transform .25s var(--ease)}
.pc:hover{border-color:var(--line-2);box-shadow:var(--shadow);transform:translateY(-2px)}
.pc-top{display:flex;align-items:center;justify-content:space-between;gap:12px}
.pc .tile{width:44px;height:44px;border-radius:13px}
.pc-tag{font-size:13px;font-weight:600;color:var(--muted)}
.pc-name{display:block;margin-top:20px;font-size:24px;font-weight:700;letter-spacing:-.025em}
.pc > p{margin:8px 0 0;font-size:15px;color:var(--muted)}
.pc ul{list-style:none;margin:18px 0 0;padding:16px 0 0;border-top:1px solid var(--line);display:flex;flex-direction:column;gap:9px;font-size:14.5px;color:var(--ink-2)}
.pc li{display:flex;gap:9px;align-items:flex-start}
.pc li svg{flex-shrink:0;margin-top:3px;color:var(--green-ink)}
.pc .link{margin-top:auto;padding-top:22px}
.pc:hover .link svg{transform:translateX(3px)}

/* Accueil : bandeau secteurs */
.sx{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:28px;padding:24px 28px;border-radius:var(--radius-l);background:var(--bg-soft);border:1px solid var(--line)}
.sx-t .eyebrow{margin-bottom:6px}
.sx-t .h3{font-size:19px}
.sx-chips{display:flex;flex-wrap:wrap;gap:8px}
.sx-chips a{display:inline-flex;align-items:center;gap:7px;height:38px;padding:0 14px;border-radius:999px;background:#fff;border:1px solid var(--line);font-size:14px;font-weight:500;color:var(--ink-2);transition:border-color .2s ease,color .2s ease}
.sx-chips a:hover{border-color:var(--ink);color:var(--ink)}
.sx-chips svg{color:var(--blue-ink)}
.uc-more .link{margin-top:10px;font-size:13.5px}

/* Pages Solutions */
.so-hero{padding-bottom:16px}
.so-hero .hero-btns{margin-top:32px}
.so-prods{margin:22px 0 0;display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:8px;font-size:14px;color:var(--muted)}
.so-prods a{display:inline-flex;align-items:center;gap:6px;height:32px;padding:0 12px;border-radius:999px;background:#fff;border:1px solid var(--line);font-weight:600;color:var(--ink-2);transition:border-color .2s ease}
.so-prods a:hover{border-color:var(--ink)}
.so-prods svg{color:var(--blue-ink)}
.so-pains{margin-top:44px}
.so-card{padding:26px}
.so-card h3,.so-hub-c h3,.sec-c h2{margin:18px 0 0;font-size:18px;font-weight:650;letter-spacing:-.015em}
.so-card p,.so-hub-c p{margin:8px 0 0;font-size:15px;color:var(--muted)}
.so-how{margin-top:48px}
.rules li > span{color:rgba(255,255,255,.7);font-weight:400}
.rules li > span b{color:#fff;font-weight:650}
.so-rep{display:flex;flex-direction:column;gap:12px;padding:18px;border-radius:14px;background:#1C1F26;color:#fff}
.so-rep > b{font-size:16px}
.so-rep-s em{display:block;margin-bottom:3px;font-style:normal;font-size:11.5px;font-weight:650;letter-spacing:.05em;text-transform:uppercase;color:#8EA0FF}
.so-rep-s p{margin:0;font-size:14.5px;line-height:1.5;color:rgba(255,255,255,.82)}
.so-int{margin:40px auto 0;max-width:860px;display:flex;flex-wrap:wrap;justify-content:center;gap:10px}
.so-int span{display:inline-flex;align-items:center;gap:10px;height:52px;padding:0 18px 0 14px;border-radius:14px;background:#fff;border:1px solid var(--line);font-size:15px;font-weight:600}
.so-int img{width:26px;height:26px;object-fit:contain}
.so-int-more{margin:24px 0 0;text-align:center}
.so-rel-h{display:flex;align-items:baseline;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-bottom:20px}
.so-rel{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.so-rel-c{display:flex;align-items:center;gap:14px;padding:16px 18px;border-radius:var(--radius);background:#fff;border:1px solid var(--line);transition:border-color .2s ease,box-shadow .2s ease}
.so-rel-c:hover{border-color:var(--line-2);box-shadow:var(--shadow)}
.so-rel-c > span:nth-child(2){flex:1;min-width:0}
.so-rel-c b{display:block;font-size:15px}
.so-rel-c small{display:block;font-size:13px;color:var(--muted)}
.so-rel-c .arr{flex-shrink:0;color:var(--subtle);transition:transform .25s var(--ease),color .2s ease}
.so-rel-c:hover .arr{transform:translateX(3px);color:var(--ink)}
.so-hub{margin-top:44px}
.so-hub-c{display:flex;flex-direction:column;padding:26px;transition:border-color .2s ease,box-shadow .2s ease,transform .25s var(--ease)}
.so-hub-c:hover{border-color:var(--line-2);box-shadow:var(--shadow);transform:translateY(-2px)}
.so-hub-p{margin-top:14px;font-size:12.5px;font-weight:600;color:var(--subtle)}
.so-hub-c .link{margin-top:auto;padding-top:16px}

/* Fair Note */
.fn-hero .hint{margin-top:18px}
.fn-steps{margin-top:48px;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.fn-works{margin-top:40px;display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:16px 28px}
.fn-works span{font-size:13.5px;font-weight:600;color:var(--muted)}
.fn-works img{width:auto;max-width:96px;object-fit:contain}
.fn-rep-s em{display:block;margin-bottom:2px;font-style:normal;font-size:11.5px;font-weight:650;letter-spacing:.05em;text-transform:uppercase;color:var(--blue-ink)}
.fn-rep-s p{margin:0;font-size:14.5px;color:var(--ink-2)}
.fn-rep-s{padding:12px 14px;border-radius:12px;background:#fff;border:1px solid var(--line)}
.fn-task{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:12px;background:#fff;border:1px solid var(--line)}
.fn-task i{width:18px;height:18px;flex-shrink:0;border-radius:6px;border:1.75px solid var(--line-2)}
.fn-task.done i{border-color:var(--green-ink);background:var(--green-ink) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12l5 5L20 7'/%3E%3C/svg%3E") center/12px no-repeat}
.fn-task b{display:block;font-size:14.5px}
.fn-task small{display:block;font-size:13px;color:var(--muted)}
.fn-bar{display:grid;grid-template-columns:70px minmax(0,1fr) 44px;align-items:center;gap:12px;padding:10px 14px;border-radius:12px;background:#fff;border:1px solid var(--line);font-size:14px}
.fn-bar i{height:8px;border-radius:99px;background:linear-gradient(90deg,var(--blue) var(--w),var(--bg-sunk) var(--w))}
.fn-bar b{text-align:right;font-variant-numeric:tabular-nums}
.fn-desk{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:64px;align-items:center}
.fn-apps{margin-top:28px;display:flex;flex-wrap:wrap;gap:8px}
.fn-apps span{display:inline-flex;align-items:center;height:32px;padding:0 12px;border-radius:999px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.12);font-size:13.5px;font-weight:500;color:rgba(255,255,255,.85)}
.fn-note{align-self:center;font-size:13.5px;color:rgba(255,255,255,.6)}
.fn-pop{justify-self:center;width:100%;max-width:360px;padding:16px;border-radius:18px;background:rgba(255,255,255,.96);color:var(--ink);box-shadow:0 30px 60px -20px rgba(0,0,0,.6)}
.fn-pop-h{display:flex;align-items:center;gap:8px;font-size:13px}
.fn-pop-h small{margin-left:auto;color:var(--subtle)}
.fn-pop p{margin:12px 0 0;font-size:14.5px;color:var(--ink-2)}
.fn-pop p b{display:block;color:var(--ink);font-size:15px}
.fn-pop-a{margin-top:14px;display:grid;grid-template-columns:1fr 1fr;gap:8px}
.fn-pop-a span{display:flex;align-items:center;justify-content:center;height:36px;border-radius:10px;background:var(--bg-sunk);font-size:14px;font-weight:600}
.fn-pop-a .p{background:var(--blue);color:#fff}
.fn-adv{margin-top:64px;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1px;border-radius:var(--radius-l);overflow:hidden;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.1)}
.fn-adv > div{padding:24px;background:var(--ink)}
.fn-adv svg{color:#8EA0FF}
.fn-adv b{display:block;margin-top:14px;font-size:15.5px}
.fn-adv p{margin:6px 0 0;font-size:14px;color:rgba(255,255,255,.62)}
.fn-uc{margin-top:48px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.fn-uc-c{display:flex;flex-direction:column;padding:28px}
a.fn-uc-c{transition:border-color .2s ease,box-shadow .2s ease,transform .25s var(--ease)}
a.fn-uc-c:hover{border-color:var(--line-2);box-shadow:var(--shadow);transform:translateY(-2px)}
.fn-uc-c em{margin-top:18px;font-style:normal;font-size:13px;font-weight:600;color:var(--blue-ink)}
.fn-uc-c h3{margin:4px 0 0;font-size:20px;font-weight:650;letter-spacing:-.02em}
.fn-uc-c p{margin:8px 0 0;font-size:15px;color:var(--muted)}
.fn-uc-c .link{margin-top:auto;padding-top:18px}
.fn-sov-l{display:flex;flex-direction:column;gap:10px}
.fn-sov .link{display:inline-flex}

/* Blog */
.bl-hero .h1{margin-top:6px}
.bl-filters{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin-bottom:36px}
.bl-filters button{height:38px;padding:0 16px;border-radius:999px;border:1px solid var(--line);background:#fff;font-size:14px;font-weight:600;color:var(--ink-2);cursor:pointer;transition:border-color .2s ease,background .2s ease,color .2s ease}
.bl-filters button:hover{border-color:var(--ink)}
.bl-filters button[aria-pressed="true"]{background:var(--ink);border-color:var(--ink);color:#fff}
.bl-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.bl-card{display:flex;flex-direction:column;padding:22px;border-radius:var(--radius-l);background:#fff;border:1px solid var(--line);transition:border-color .2s ease,box-shadow .2s ease,transform .25s var(--ease)}
.bl-card:hover{border-color:var(--line-2);box-shadow:var(--shadow);transform:translateY(-2px)}
.bl-card[hidden]{display:none}
.bl-thumb{display:flex;align-items:center;justify-content:center;aspect-ratio:16/9;margin:-8px -8px 18px;border-radius:16px;background:var(--blue-soft);color:var(--blue)}
.bl-thumb.bl-ink{background:var(--ink);color:#fff}
.bl-thumb.bl-soft{background:var(--bg-sunk);color:var(--ink-2)}
.bl-thumb.bl-blue{background:linear-gradient(135deg,#EAF2FE,#CCE0FC)}
.bl-meta{display:flex;align-items:center;flex-wrap:wrap;gap:8px;font-size:13px;color:var(--muted)}
.bl-meta em{font-style:normal;font-weight:650;color:var(--blue-ink)}
.bl-card h2{margin:10px 0 0;font-size:18.5px;line-height:1.3;font-weight:650;letter-spacing:-.018em;text-wrap:balance}
.bl-card p{margin:8px 0 0;font-size:14.5px;color:var(--muted);text-wrap:pretty}
.bl-by{display:flex;align-items:center;gap:8px;margin-top:auto;padding-top:18px;font-size:13px;font-weight:500;color:var(--ink-2)}
.bl-by i,.post-by i{display:flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:50%;background:var(--ink);color:#fff;font-style:normal;font-size:11px;font-weight:700}
.bl-first{grid-column:span 2;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-rows:auto auto auto 1fr auto;column-gap:28px}
.bl-first .bl-thumb{grid-row:1 / -1;margin:0;aspect-ratio:auto;min-height:100%}
.bl-first h2{font-size:24px}
.bl-3 .bl-card h2{font-size:17px}

/* Article */
.post{padding:56px 0 24px}
.post-h{max-width:820px}
.post-h .crumbs{justify-content:flex-start}
.post-t{margin-top:14px;font-size:clamp(30px,3.6vw,46px)}
.post-h .lead{margin-top:18px}
.post-by{display:flex;align-items:center;gap:12px;margin-top:24px;padding-bottom:28px;border-bottom:1px solid var(--line)}
.post-by i{width:40px;height:40px;font-size:13px}
.post-by b{display:block;font-size:15px}
.post-by small{display:block;font-size:13.5px;color:var(--muted)}
.post-body{max-width:820px;padding-top:32px;font-size:17.5px;line-height:1.7;color:var(--ink-2)}
.post-body > *{max-width:700px}
.post-body h2{margin:44px 0 0;font-size:26px;line-height:1.25;letter-spacing:-.025em;color:var(--ink)}
.post-body h3{margin:30px 0 0;font-size:20px;letter-spacing:-.015em;color:var(--ink)}
.post-body p{margin:16px 0 0}
.post-body ul,.post-body ol{margin:16px 0 0;padding-left:22px}
.post-body li{margin-top:8px}
.post-body li::marker{color:var(--blue)}
.post-body a:not(.btn){color:var(--blue-ink);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}
.post-body strong{color:var(--ink)}
.post-body blockquote{margin:28px 0 0;padding:4px 0 4px 22px;border-left:3px solid var(--blue);font-size:19px;line-height:1.6;color:var(--ink)}
.post-cta{margin-top:36px;padding:26px;border-radius:var(--radius-l);background:var(--bg-soft);border:1px solid var(--line)}
.post-cta b{display:block;font-size:19px;color:var(--ink)}
.post-cta p{margin:6px 0 16px;font-size:15.5px;color:var(--muted)}
.post-f{max-width:820px;margin-top:40px}

/* Sécurité */
.sec-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.sec-c{padding:26px}
.sec-c > p{margin:8px 0 0;font-size:15px;color:var(--muted)}
.sec-c ul{list-style:none;margin:16px 0 0;padding:14px 0 0;border-top:1px solid var(--line);display:flex;flex-direction:column;gap:8px;font-size:14.5px;color:var(--ink-2)}
.sec-c li{display:flex;gap:9px;align-items:flex-start}
.sec-c li::before{content:"";flex-shrink:0;width:16px;height:16px;margin-top:3px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230B7A3B' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12l5 5L20 7'/%3E%3C/svg%3E") center/16px no-repeat}
.sec-ai{display:flex;flex-direction:column;gap:10px}
.so-hero .trust-row{margin-top:32px}

/* Documentation */
.dc-pick{margin-top:32px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;width:100%;max-width:720px}
.dc-pick a{display:flex;align-items:center;gap:12px;padding:14px;border-radius:var(--radius);background:#fff;border:1px solid var(--line);text-align:left;transition:border-color .2s ease,box-shadow .2s ease}
.dc-pick a:hover{border-color:var(--line-2);box-shadow:var(--shadow)}
.dc-pick b{display:block;font-size:15px}
.dc-pick small{display:block;font-size:13px;color:var(--muted)}
.dc{display:grid;grid-template-columns:230px minmax(0,1fr);gap:56px;align-items:start}
.dc-side{position:sticky;top:96px;display:flex;flex-direction:column;gap:2px;max-height:calc(100vh - 120px);overflow:auto}
.dc-side-h{margin:18px 0 6px;padding:0 10px;font-size:12px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--subtle)}
.dc-side-h:first-child{margin-top:0}
.dc-side a{padding:7px 10px;border-radius:9px;font-size:14.5px;color:var(--ink-2);transition:background .15s ease,color .15s ease}
.dc-side a:hover{background:var(--bg-soft);color:var(--ink)}
.dc-side a.on{background:var(--blue-soft);color:var(--blue-ink);font-weight:600}
.dc-body{min-width:0;max-width:780px}
.dc-prod{padding-top:8px}
.dc-prod + .dc-art{margin-top:28px}
.dc-art ~ .dc-prod{margin-top:72px;padding-top:56px;border-top:1px solid var(--line)}
.dc-prod .eyebrow{gap:7px}
.dc-prod .h2{margin-top:12px;font-size:clamp(26px,2.6vw,34px)}
.dc-prod .lead{margin-top:12px}
.dc-art{margin-top:20px;padding:26px 28px;border-radius:var(--radius-l);background:#fff;border:1px solid var(--line);font-size:15.5px;line-height:1.65;color:var(--ink-2)}
.dc-art h3{margin:0;font-size:19px;letter-spacing:-.015em;color:var(--ink)}
.dc-art p{margin:12px 0 0}
.dc-art ol,.dc-art ul{margin:12px 0 0;padding-left:20px}
.dc-art li{margin-top:6px}
.dc-art li::marker{color:var(--blue)}
.dc-art b{color:var(--ink);font-weight:600}
.dc-art a:not(.link){color:var(--blue-ink);text-decoration:underline;text-underline-offset:3px}
.dc-art code{padding:1px 6px;border-radius:6px;background:var(--bg-sunk);font:13.5px ui-monospace,SFMono-Regular,Menlo,monospace}
.dc-art .code{margin-top:14px}
.dc-art .code code{padding:0;background:none;color:inherit}
.dc-tip{display:flex;gap:10px;align-items:flex-start;padding:12px 14px;border-radius:12px;background:var(--blue-soft);font-size:14.5px;color:var(--ink-2)}
.dc-tip svg{flex-shrink:0;margin-top:3px;color:var(--blue-ink)}
.dc-table{margin-top:14px;border:1px solid var(--line);border-radius:14px;overflow:hidden}
.dc-table > div{display:grid;grid-template-columns:200px minmax(0,1fr);gap:16px;padding:12px 16px;font-size:14.5px}
.dc-table > div + div{border-top:1px solid var(--line)}
.dc-cards{margin-top:14px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.dc-cards > div{display:flex;flex-direction:column;gap:4px;padding:14px;border-radius:12px;background:var(--bg-soft);border:1px solid var(--line)}
.dc-cards svg{color:var(--blue-ink);margin-bottom:4px}
.dc-cards b{font-size:15px}
.dc-cards span{font-size:14px;color:var(--muted);line-height:1.5}
.dc-help{margin-top:56px}

/* Nouveautés */
.cl-filters{margin:32px 0 0}
.cl{max-width:980px}
.cl-month{display:grid;grid-template-columns:200px minmax(0,1fr);gap:40px;padding:36px 0;border-top:1px solid var(--line)}
.cl-month:first-child{border-top:0;padding-top:8px}
.cl-month[hidden]{display:none}
.cl-when{position:sticky;top:100px;align-self:start}
.cl-when b{display:block;font-size:18px;letter-spacing:-.015em}
.cl-when small{display:block;margin-top:2px;font-size:13.5px;color:var(--muted)}
.cl-items{display:flex;flex-direction:column;gap:14px}
.cl-item{padding:24px 26px;border-radius:var(--radius-l);background:#fff;border:1px solid var(--line)}
.cl-item[hidden]{display:none}
.cl-tag{display:inline-flex;align-items:center;height:24px;padding:0 9px;border-radius:7px;background:var(--bg-sunk);font-size:12.5px;font-weight:650;color:var(--ink-2)}
.cl-tag.new{background:var(--green-soft);color:var(--green-ink)}
.cl-prod{display:inline-flex;align-items:center;gap:6px;margin-left:10px;font-size:13px;font-weight:600;color:var(--muted)}
.cl-prod svg{color:var(--blue-ink)}
.cl-item h2{margin:12px 0 0;font-size:19px;line-height:1.3;letter-spacing:-.018em}
.cl-item p{margin:8px 0 0;font-size:15px;color:var(--muted)}
.cl-item .link{margin-top:14px}
.cl-idea{margin-top:40px}

/* Partenaires (ajouts v9) */
.pt-prods{margin:40px auto 0;max-width:760px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.pt-prods a{display:flex;align-items:center;gap:12px;padding:14px 16px;border-radius:var(--radius);background:var(--bg-soft);border:1px solid var(--line);transition:border-color .2s ease}
.pt-prods a:hover{border-color:var(--ink)}
.pt-prods b{display:block;font-size:15px}
.pt-prods small{display:block;font-size:13px;color:var(--muted)}
.pt-wl{display:flex;flex-direction:column;gap:10px}
.pt-quote{margin:0;padding:48px;border-radius:32px;background:var(--bg-soft);border:1px solid var(--line);text-align:center}
.pt-quote img{height:34px;width:auto;margin:0 auto}
.pt-quote blockquote{max-width:760px;margin:24px auto 0;font-size:clamp(19px,2vw,24px);line-height:1.45;letter-spacing:-.015em;font-weight:500;color:var(--ink);text-wrap:balance}
.pt-quote figcaption{margin-top:16px;font-size:14.5px;color:var(--muted)}
.pt-kpis{margin:32px auto 0;max-width:720px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.pt-kpis div{padding:18px 12px;border-radius:var(--radius);background:#fff;border:1px solid var(--line)}
.pt-kpis b{display:block;font-size:26px;letter-spacing:-.03em;color:var(--blue-ink)}
.pt-kpis span{display:block;margin-top:2px;font-size:13.5px;color:var(--muted)}
.ig-prod{display:inline-flex;align-items:center;height:22px;margin-left:8px;padding:0 8px;border-radius:7px;background:var(--blue-soft);color:var(--blue-ink);font-size:12px;font-weight:650;vertical-align:3px;letter-spacing:0}
.ig-hero-txt .crumbs{justify-content:flex-start}

/* v9 : responsive */
@media (max-width:1080px){
  .pc-grid,.so-rel,.bl-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .pc-grid > :last-child{grid-column:span 2}
  .fn-steps,.fn-adv{grid-template-columns:repeat(2,minmax(0,1fr))}
  .fn-desk{grid-template-columns:1fr;gap:40px}
  .sec-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .sx{grid-template-columns:1fr;gap:16px}
  .dc{grid-template-columns:1fr;gap:24px}
  .dc-side{position:static;flex-direction:row;flex-wrap:nowrap;overflow-x:auto;max-height:none;margin:0 calc(var(--gutter) * -1);padding:0 var(--gutter) 6px;scrollbar-width:none}
  .dc-side::-webkit-scrollbar{display:none}
  .dc-side a{flex-shrink:0;border:1px solid var(--line);white-space:nowrap}
  .dc-side-h{display:none}
}
@media (min-width:901px) and (max-width:1080px){.so-pains,.so-how,.so-hub,.trust{grid-template-columns:repeat(3,minmax(0,1fr))}.pc-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.pc-grid > :last-child{grid-column:auto}.pc{padding:22px}}
@media (max-width:900px){.bl-first{grid-column:auto;display:flex}.bl-first .bl-thumb{margin:-8px -8px 18px;aspect-ratio:16/9;min-height:0}.bl-first h2{font-size:18.5px}}
@media (max-width:720px){
  .pc-grid,.so-rel,.bl-grid,.sec-grid,.fn-uc,.pt-prods,.dc-pick{grid-template-columns:1fr}
  .pc-grid > :last-child{grid-column:auto}
  .fn-adv{grid-template-columns:1fr}
  .fn-steps{grid-template-columns:1fr}
  .cl-month{grid-template-columns:1fr;gap:16px}
  .cl-when{position:static}
  .pt-quote{padding:28px 20px;border-radius:24px}
  .pt-kpis{grid-template-columns:1fr}
  .dc-table > div{grid-template-columns:1fr;gap:2px}
  .dc-cards{grid-template-columns:1fr}
  .dc-art{padding:20px}
  .post{padding-top:32px}
  .post-body{font-size:16.5px}
  .post-body h2{font-size:22px}
  .crumbs{font-size:13px}
  .so-int span{height:46px;font-size:14px}
  .fn-bar{grid-template-columns:60px minmax(0,1fr) 40px}
}
/* Menu mobile ouvert : le flou de l'en-tête créerait un bloc conteneur pour position:fixed */
.nav.menu-open,.nav:has(.mnav.open){-webkit-backdrop-filter:none;backdrop-filter:none;background:#fff;border-bottom-color:var(--line)}
/* Cartes « known » sur fond sombre (Sécurité) */
.dark .known{background:#15171D;border-color:rgba(255,255,255,.1)}
.dark .known b{color:#fff}
.dark .known small{color:rgba(255,255,255,.6)}
.dark .known .tile{background:rgba(255,255,255,.08);color:#8EA0FF}
/* Blog : vignettes plus lisibles */
.bl-thumb{flex-direction:column;gap:10px}
.bl-thumb svg{width:34px;height:34px}
.bl-thumb b{font-size:14px;font-weight:650;letter-spacing:-.01em}
.bl-first .bl-thumb svg{width:48px;height:48px}
.bl-first .bl-thumb b{font-size:18px}

/* 29/10 puis 31/10 (retours Michael) : la vidéo suit le hero sans grand vide, mais commence sous la ligne de flottaison (seul son titre dépasse) */
@media (min-width:600px){
  body[data-page="index-b"] .orb-hero{height:calc(100svh - 158px);min-height:500px;max-height:1000px}
  body[data-page="index-b"] .hero-in > .stage{margin-top:8px}
}
.vid-head{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;gap:10px;margin:0 auto 28px;text-align:center}
.vid-h{margin:0;font-size:clamp(22px,2.2vw,30px);line-height:1.2;letter-spacing:-.025em;font-weight:650;color:var(--ink);text-wrap:balance}
body[data-page="index-b"] .hero-in > .stage{width:100%}
/* Bouton de la vidéo : au centre, plein, bleu Fairwai */
.play.play-c{align-items:center;justify-content:center;padding:0;background:radial-gradient(60% 60% at 50% 50%,rgba(10,11,15,.16),rgba(10,11,15,.04))}
.play-c .play-btn{height:58px;gap:12px;padding:0 24px 0 8px;background:linear-gradient(90deg,#1A66DB,#163D5A);color:#fff;font-size:16px;box-shadow:0 18px 40px -12px rgba(var(--blue-rgb),.6),0 0 0 6px rgba(255,255,255,.35)}
.play-c .play-btn i{width:42px;height:42px;background:#fff;color:var(--blue-ink)}
.play-c .play-btn em{font-style:normal;font-weight:500;opacity:.72}
.play-c:hover .play-btn{transform:scale(1.05)}
html[data-theme] .play-c .play-btn{background:var(--blue);color:var(--on-blue)}
@media (max-width:600px){
  .vid-big .play-c .play-btn{height:44px;gap:9px;padding:0 16px 0 6px;font-size:14px}
  .vid-big .play-c .play-btn i{width:32px;height:32px}
  .vid-head{margin-bottom:18px}
}
/* Zoom doux à l'arrivée de la vidéo (piloté par site.js, coupé si mouvement réduit) */
.vid-zoom{transform-origin:50% 0;will-change:transform}
.nav-links > .menu:first-child .menu-card{width:372px}

/* 29/10 (retour Michael) : bandeau « Réserver une démo » plus visible, en noir Fairwai (pas en bleu) */
.fab{background:#0A0B0F;border-color:rgba(255,255,255,.08);color:#fff;padding:10px 10px 10px 14px;gap:14px;font-size:15px;box-shadow:0 24px 48px -16px rgba(10,11,15,.55),0 0 0 6px rgba(255,255,255,.7)}
.fab .avatars{position:relative}
.fab .avatars i{width:36px;height:36px;border:2px solid #0A0B0F;background:#2B2E36;font-size:12px;position:relative;overflow:hidden}
.fab .avatars i + i{margin-left:-10px;background:var(--blue)}
.fab .avatars img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.fab-on{position:absolute;right:-1px;bottom:-1px;width:11px;height:11px;border-radius:50%;background:#22C55E;border:2px solid #0A0B0F}
.fab-t b{color:#fff;font-weight:650}
.fab-t small{color:rgba(255,255,255,.66)}
.fab .fab-btn{height:40px;padding:0 16px;border-radius:999px;background:#fff;color:#0A0B0F;font-weight:650}
.fab .fab-btn:hover{background:#EAF2FE}
.fab .x{color:rgba(255,255,255,.55)}
.fab .x:hover{background:rgba(255,255,255,.1);color:#fff}
@media (max-width:600px){
  .fab{padding:8px 6px 8px 10px;gap:8px;box-shadow:0 16px 36px -12px rgba(10,11,15,.55),0 0 0 4px rgba(255,255,255,.7)}
  .fab .avatars{display:flex}
  .fab .avatars i{width:30px;height:30px}
  .fab .avatars i + i{display:none}
  .fab-t small{color:rgba(255,255,255,.66)}
  .fab .fab-btn{height:36px;padding:0 12px;font-size:13px}
  .fab .fab-btn svg{display:none}
}

/* 29/10 : photos en situation (Pexels), quelques endroits précis */
.jt-photos{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-bottom:72px}
.jt-photos figure{position:relative;margin:0;border-radius:20px;overflow:hidden;aspect-ratio:4/3;background:var(--bg-sunk);box-shadow:var(--shadow)}
.jt-photos img{width:100%;height:100%;object-fit:cover}
.jt-photos figcaption{position:absolute;left:12px;bottom:12px;right:12px;width:max-content;max-width:calc(100% - 24px);display:flex;flex-direction:column;padding:10px 14px 10px 30px;border-radius:14px;background:rgba(255,255,255,.94);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);font-size:14px;font-weight:650;line-height:1.3;color:var(--ink);box-shadow:var(--shadow-s)}
.jt-photos figcaption small{margin-top:2px;font-size:12.5px;font-weight:500;color:var(--muted)}
.jt-dot{position:absolute;left:12px;top:15px;width:8px;height:8px;border-radius:50%;background:#22C55E;box-shadow:0 0 0 3px rgba(34,197,94,.18)}
@media (max-width:720px){.jt-photos{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-bottom:44px}.jt-photos figure{border-radius:14px}.jt-photos figure:last-child{display:none}.jt-photos figcaption{left:8px;bottom:8px;max-width:calc(100% - 16px);padding:7px 10px 7px 24px;font-size:12.5px}.jt-photos figcaption small{font-size:11.5px}.jt-dot{left:10px;top:12px;width:7px;height:7px}}
.fn-shot{position:relative;justify-self:stretch;border-radius:22px;overflow:hidden;aspect-ratio:4/3;box-shadow:0 30px 60px -24px rgba(0,0,0,.6)}
.fn-shot > img{width:100%;height:100%;object-fit:cover}
.fn-shot .fn-pop{position:absolute;right:16px;bottom:16px;width:min(320px,calc(100% - 32px));max-width:none}
@media (max-width:600px){.fn-shot .fn-pop{right:10px;bottom:10px;width:calc(100% - 20px);padding:12px}.fn-shot .fn-pop p{font-size:13.5px}}
.uc-photo{margin:20px 0 0;border-radius:16px;overflow:hidden;aspect-ratio:12/5}
.uc-photo img{width:100%;height:100%;object-fit:cover}
.pt-photo{margin:28px 0 0;border-radius:20px;overflow:hidden;aspect-ratio:3/2;box-shadow:var(--shadow)}
.pt-photo img{width:100%;height:100%;object-fit:cover}
/* Mobile : les trois photos en bandeau défilant (une photo et demie à l'écran) */
@media (max-width:720px){
  .jt-photos{display:flex;gap:10px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;margin:0 calc(var(--gutter) * -1) 44px;padding:0 var(--gutter) 8px}
  .jt-photos::-webkit-scrollbar{display:none}
  .jt-photos figure,.jt-photos figure:last-child{display:block;flex:0 0 76%;scroll-snap-align:start}
}
@media (max-width:600px){
  .fn-shot{aspect-ratio:auto;overflow:visible;box-shadow:none;border-radius:0}
  .fn-shot > img{aspect-ratio:4/3;height:auto;border-radius:18px}
  .fn-shot .fn-pop{position:relative;right:auto;bottom:auto;width:calc(100% - 24px);margin:-56px auto 0}
}

/* Fair Note : 5 étapes (vidéo), intégration CRM, templates */
.fn-steps-5{grid-template-columns:repeat(5,minmax(0,1fr));gap:14px}
.fn-steps-5 .how-card{padding:22px}
.fn-steps-5 .how-card .h3{font-size:18px}
.fn-steps-5 .how-card p{font-size:14.5px}
@media (max-width:1080px){.fn-steps-5{grid-template-columns:repeat(2,minmax(0,1fr))}.fn-steps-5 > :last-child{grid-column:span 2}}
@media (max-width:720px){.fn-steps-5{grid-template-columns:1fr}.fn-steps-5 > :last-child{grid-column:auto}}
.fn-list{list-style:none;margin:28px 0 0;padding:0;display:flex;flex-direction:column;gap:14px}
.fn-list li{display:flex;gap:12px;align-items:flex-start;font-size:15.5px;line-height:1.5;color:var(--muted)}
.fn-list li b{color:var(--ink);font-weight:600}
.fn-list svg{flex-shrink:0;margin-top:2px;color:var(--blue-ink)}
.fn-crm-logos{display:flex;flex-wrap:wrap;gap:8px;margin-top:28px}
.fn-crm-logos span{display:inline-flex;align-items:center;gap:8px;height:40px;padding:0 14px 0 10px;border-radius:12px;background:#fff;border:1px solid var(--line);font-size:14px;font-weight:600}
.fn-crm-logos img{width:24px;height:24px;object-fit:contain}
.fn-crm-logos svg{color:var(--blue-ink)}
.fn-crm-card,.fn-tpl-card{padding:22px;border-radius:var(--radius-l);background:#fff;border:1px solid var(--line);box-shadow:var(--shadow-l)}
.fn-crm-top,.fn-tpl-top{display:flex;align-items:center;gap:12px;padding-bottom:16px;margin-bottom:6px;border-bottom:1px solid var(--line)}
.fn-crm-top > span,.fn-tpl-top > span:nth-child(2){flex:1;min-width:0}
.fn-crm-top b,.fn-tpl-top b{display:block;font-size:15.5px}
.fn-crm-top small,.fn-tpl-top small{display:block;font-size:13px;color:var(--muted)}
.fn-crm-top em{font-style:normal;font-size:12px;font-weight:650;color:var(--green-ink);background:var(--green-soft);padding:4px 10px;border-radius:999px;white-space:nowrap}
.fn-crm-row{display:grid;grid-template-columns:minmax(0,1fr) auto auto;align-items:center;gap:12px;padding:11px 2px;border-bottom:1px solid var(--line);font-size:14.5px}
.fn-crm-row span{color:var(--muted)}
.fn-crm-row b{font-weight:600;text-align:right}
.fn-ai{font-style:normal;font-size:11px;font-weight:700;color:var(--blue-ink);background:var(--blue-soft);padding:3px 7px;border-radius:6px}
.fn-crm-act{display:flex;align-items:center;flex-wrap:wrap;gap:12px;margin-top:18px}
.fn-crm-act .btn{cursor:default}
.fn-crm-act small{font-size:13px;color:var(--muted)}
.fn-tpl-s{padding:12px 2px;border-bottom:1px solid var(--line)}
.fn-tpl-s:last-child{border-bottom:0}
.fn-tpl-s em{display:block;font-style:normal;font-size:11.5px;font-weight:650;letter-spacing:.05em;text-transform:uppercase;color:var(--blue-ink)}
.fn-tpl-s p{margin:3px 0 0;font-size:14.5px;color:var(--ink-2)}
.fn-chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:24px}
.fn-chips button{display:inline-flex;align-items:center;height:34px;padding:0 14px;border-radius:999px;background:#fff;border:1px solid var(--line);font:inherit;font-size:14px;font-weight:500;color:var(--ink-2);cursor:pointer;transition:background .2s ease,border-color .2s ease,color .2s ease}
.fn-chips button:hover{border-color:var(--line-2);color:var(--ink)}
.fn-chips button:last-child{border-style:dashed;color:var(--muted)}
.fn-chips button[aria-pressed="true"]{background:var(--blue);border-color:var(--blue);border-style:solid;color:#fff}
.fn-chips button:focus-visible{outline:2px solid var(--blue);outline-offset:2px}
.fn-tpl-card.swap{animation:tplIn .35s var(--ease)}
@keyframes tplIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
@media (max-width:1080px){.fn-tpl .fn-tpl-card{order:2}}
@media (max-width:600px){.fn-crm-row{grid-template-columns:minmax(0,1fr) auto;row-gap:2px}.fn-crm-row .fn-ai{display:none}.fn-crm-card,.fn-tpl-card{padding:16px}}
/* Accueil : écran de l'agent retiré, les logos suivent directement la vidéo */
.hero:has(.vid-zoom) + .logos{padding-top:24px}
@media (max-width:720px){.hero:has(.vid-zoom) + .logos{padding-top:16px}}
/* Menu plus compact, à la fonio (31/10) */
.nav-links{font-size:14px}
.nav-links > a,.nav-links > .menu > button{height:36px}
.nav-right .login,.lang > button{font-size:14px}
.menu-item{gap:12px;padding:9px 10px;border-radius:11px}
.menu-item .tile{width:34px;height:34px;border-radius:9px}
.menu-item .tile svg{width:17px;height:17px}
.menu-item strong{font-size:14px}
.menu-item small{font-size:12.5px;line-height:1.4}
.mm-item b{font-size:14px}
.mm-item small{font-size:12.5px}
.mm-res{width:310px}
.lang-item{gap:10px;padding:8px 10px;font-size:14px}

/* 31/10 : Fair Note, pastilles produit sur les cas d'usage, logos CRM larges */
.fn-uc-top{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.fn-uc-p{display:flex;flex-wrap:wrap;gap:6px}
.fn-uc-p i{display:inline-flex;align-items:center;gap:5px;height:26px;padding:0 10px;border-radius:999px;background:var(--blue-soft);color:var(--blue-ink);font-style:normal;font-size:12.5px;font-weight:650;white-space:nowrap}
.fn-crm-logos img.w{width:34px}
@media (prefers-reduced-motion:reduce){.fn-tpl-card.swap{animation:none}}
/* Langues : drapeaux seuls (31/10) */
.lang > button .flg{width:18px;height:12px}
.lang-card{width:auto;padding:6px;display:flex;flex-direction:column;gap:2px}
.lang-item{justify-content:center;padding:9px 12px}
.lang-item .flg{width:20px;height:14px}
.lang-item.on{background:var(--blue-soft)}
/* Badges « Nouveau » en vert Fairwai, pour les distinguer du bleu des liens (31/10) */
.mm-new{background:var(--green-soft);color:var(--green-ink)}

/* Cas d'usage Fair Note : pastilles produit cliquables, le lien du bas couvre toute la carte */
.fn-uc-c{position:relative;transition:border-color .2s ease,box-shadow .2s ease,transform .25s var(--ease)}
.fn-uc-c:has(.fn-uc-go):hover{border-color:var(--line-2);box-shadow:var(--shadow);transform:translateY(-2px)}
.fn-uc-go::after{content:"";position:absolute;inset:0;border-radius:inherit}
.fn-uc-p a{position:relative;z-index:1;display:inline-flex;align-items:center;gap:5px;height:26px;padding:0 10px;border-radius:999px;background:var(--blue-soft);color:var(--blue-ink);font-size:12.5px;font-weight:650;white-space:nowrap;transition:background .2s ease,color .2s ease}
.fn-uc-p a:hover{background:var(--blue);color:#fff}

/* Logos recadrés au plus près : les formats larges gardent une hauteur lisible */
.so-int img{width:auto;max-width:72px}
.fn-crm-logos img{width:auto;max-width:64px;object-fit:contain}

/* Photos du blog et des pages Solutions */
.bl-thumb{position:relative;overflow:hidden;background:var(--bg-sunk)}
.bl-thumb img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .5s var(--ease)}
.bl-card:hover .bl-thumb img{transform:scale(1.03)}
.post-cover{max-width:820px;margin-top:28px}
.post-cover figure,.so-photo figure{margin:0;overflow:hidden;border-radius:var(--radius-l);background:var(--bg-sunk)}
.post-cover img,.so-photo img{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;object-position:center 35%}
.so-photo{max-width:1120px;margin-top:8px}
.so-photo img{aspect-ratio:21/9}
@media (max-width:720px){.so-photo img{aspect-ratio:3/2}.post-cover{margin-top:20px}}
.fn-crm-logos img.w{width:50px}

/* Fair Chat : le site de démonstration du hero, avec de vrais contenus */
.browser-hero .site-sk{height:100%}
.browser-hero .site-nav span{font-size:13px;font-weight:500;color:var(--muted)}
.site-p{font-size:14.5px;line-height:1.5;color:var(--muted)}
.browser-hero .site-btn{display:inline-flex;align-items:center;align-self:flex-start;width:auto;padding:0 16px;font-size:13.5px;font-weight:600;color:#fff}
.browser-hero .site-img{display:block;flex:1 1 0;min-height:0;width:100%;height:auto;margin-top:8px;object-fit:cover;background:var(--bg-sunk)}
@media (min-width:1081px){.browser-hero .float-chip.c1{top:auto;bottom:52px}}
@media (min-width:721px) and (max-width:960px){.browser-hero .site-sk{max-width:calc(100% - 392px)}}
@media (max-width:720px){.browser-hero .browser-in{height:580px}.browser-hero .site-nav span,.browser-hero .site-h,.browser-hero .site-p,.browser-hero .site-img,.browser-hero .site-btn{display:none}}

/* Pages Solutions : logos Unyc et Sewan à la même présence que les autres */
.so-int img[src*="fn-unyc"]{height:16px}
.so-int img[src*="fn-sewan"]{height:17px}

/* Articles : photos dans le texte */
.post-photos{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 14px;margin-top:24px}
.post-photos figure,.post-photo{margin:0}
.post-body .post-photo{max-width:420px;margin-top:24px}
.post-photos img,.post-photo img{display:block;width:100%;height:auto;border-radius:14px;background:var(--bg-sunk)}
.post-photos figcaption,.post-photo figcaption{margin-top:8px;font-size:13.5px;line-height:1.4;color:var(--muted)}
@media (max-width:560px){.post-photos{grid-template-columns:1fr}.post-body .post-photo{max-width:100%}}

/* Accueil : barre d'annonce */
.annonce{position:relative;overflow:hidden;background:#060A14;color:#fff;font-size:13.5px;line-height:1.3;border-bottom:1px solid rgba(255,255,255,.08)}
.annonce[hidden]{display:none}
.annonce::before{content:"";position:absolute;inset:0;background:radial-gradient(420px 90px at 50% 120%,rgba(31,115,243,.55),transparent 70%);pointer-events:none}
.annonce::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:1px;background:linear-gradient(90deg,transparent,#1F73F3 30%,#7DB2FF 50%,#1F73F3 70%,transparent);background-size:200% 100%;animation:annonceLine 7s linear infinite}
@keyframes annonceLine{from{background-position:200% 0}to{background-position:0 0}}
@media (prefers-reduced-motion:reduce){.annonce::after{animation:none}}
.annonce-in{position:relative;z-index:1;display:flex;align-items:center;justify-content:center;gap:18px;min-height:42px;padding:0 48px}
.annonce-a{display:inline-flex;align-items:center;gap:10px;color:#fff;font-weight:500;letter-spacing:-.005em;text-decoration:none}
.annonce-a svg{flex:none;color:#7DB2FF;transition:transform .2s var(--ease)}
.annonce-a:hover svg{transform:translateX(3px)}
.annonce-a:focus-visible,.annonce button:focus-visible{outline:2px solid #7DB2FF;outline-offset:2px;border-radius:6px}
.annonce-b{color:rgba(255,255,255,.72)}
.annonce-b:hover{color:#fff}
.annonce-t{display:inline-flex;align-items:center;gap:6px;height:22px;padding:0 9px;border:1px solid rgba(125,178,255,.45);border-radius:999px;background:rgba(31,115,243,.18);color:#BBD6FF;font-size:11px;font-weight:600;letter-spacing:.08em;text-transform:uppercase}
.annonce-t i{width:6px;height:6px;border-radius:50%;background:#7DB2FF;box-shadow:0 0 8px #7DB2FF}
.annonce-s{width:1px;height:16px;background:rgba(255,255,255,.2)}
.annonce button{position:absolute;z-index:2;right:10px;top:50%;display:flex;width:30px;height:30px;margin-top:-15px;align-items:center;justify-content:center;border:0;border-radius:8px;background:none;color:rgba(255,255,255,.65);cursor:pointer}
.annonce button:hover{background:rgba(255,255,255,.1);color:#fff}
@media (max-width:760px){.annonce{font-size:13px}.annonce-in{flex-direction:column;align-items:flex-start;gap:6px;min-height:0;padding:9px 44px 10px 14px}.annonce-s,.annonce-t{display:none}.annonce-a{gap:8px}.annonce-b{font-size:12.5px}.annonce::before{background:radial-gradient(300px 80px at 30% 120%,rgba(31,115,243,.5),transparent 70%)}}

/* Articles : grande photo dans le texte */
.post-body .post-photo-w{margin:28px 0 0;max-width:700px}
.post-photo-w img{display:block;width:100%;height:auto;border-radius:14px;background:var(--bg-sunk)}

/* Espace presse */
.pr-sec{margin-top:56px}
.pr-tl{list-style:none;margin:24px 0 0;padding:0;border-left:2px solid var(--line)}
.pr-tl li{position:relative;margin:0;padding:0 0 22px 24px}
.pr-tl li::before{content:"";position:absolute;left:-6px;top:6px;width:10px;height:10px;border-radius:50%;background:var(--blue)}
.pr-tl time{display:block;font-size:13px;font-weight:600;color:var(--blue-ink)}
.pr-tl b{display:block;margin-top:2px;font-size:16px;color:var(--ink)}
.pr-tl span{display:block;margin-top:2px;font-size:15px;color:var(--muted)}
.pr-tl a{color:inherit;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}
.pr-y{margin:32px 0 0;font-size:22px;letter-spacing:-.02em;color:var(--ink)}
.pr-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:20px}
.pr-grid .card{display:block}
.pr-grid time{font-size:13px;color:var(--muted)}
.pr-grid h3{margin:6px 0 0;font-size:17px;line-height:1.3}
.pr-kit{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px}
@media (max-width:720px){.pr-grid{grid-template-columns:1fr}}
.post-photo-w figcaption{margin-top:8px;font-size:13.5px;line-height:1.4;color:var(--muted)}