/* NessDocs — site public, ambiance « Menthe » (clair + menthe du logo).
   Contraste AA : texte blanc sur #047857 = 5,5:1 ; #10B981 décoratif uniquement. */
:root{
  --ink:#0F172A;--txt2:#475569;--txt3:#64748B;
  --mint:#ADECA2;--mint-soft:#E3F8DF;--menthe:#F3FBF4;--mint-line:#CDE9C8;
  --em:#047857;--em-d:#065F46;--em-b:#10B981;
  --bord:#E3EEE5;--logo:#00294D;--r:22px;
  --display:'Plus Jakarta Sans',Inter,system-ui,sans-serif;
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body.sp{margin:0;font:16px/1.6 Inter,system-ui,-apple-system,sans-serif;color:var(--ink);background:#fff;-webkit-font-smoothing:antialiased;overflow-x:hidden}
.sp h1,.sp h2,.sp h3,.sp p,.sp ul{margin:0;padding:0}
.sp h1,.sp h2,.sp h3{font-family:var(--display);letter-spacing:-.035em;color:var(--ink)}
.sp a{color:inherit;text-decoration:none}
.sp :focus-visible{outline:3px solid var(--em-b);outline-offset:3px;border-radius:8px}
.skip{position:absolute;left:-999px;top:8px;z-index:100;background:#fff;padding:10px 14px;border-radius:10px}
.skip:focus{left:8px}
.brand{display:inline-flex;align-items:center;gap:10px;font:800 19px var(--display);letter-spacing:-.03em;color:var(--logo)!important}
.brand img{width:32px;height:32px}.brand b{color:var(--em)}
.w{max-width:1200px;margin:0 auto;padding:0 24px}

/* Apparitions au défilement (actives seulement si JS présent) */
.js .rv{opacity:0;transform:translateY(24px);transition:opacity .7s cubic-bezier(.2,.7,.2,1),transform .7s cubic-bezier(.2,.7,.2,1)}
.js .rv.in{opacity:1;transform:none}

/* Boutons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border-radius:14px;font:700 15px/1.2 var(--display);padding:15px 24px;border:1px solid transparent;cursor:pointer;transition:transform .2s,box-shadow .2s,background .2s,border-color .2s}
.btn:hover{transform:translateY(-2px)}
.btn-p{background:var(--em);color:#fff!important;box-shadow:0 14px 30px -12px rgba(4,120,87,.55),inset 0 1px 0 rgba(255,255,255,.18)}
.btn-p:hover{background:var(--em-d);box-shadow:0 20px 40px -14px rgba(4,120,87,.6)}
.btn-l{background:#fff;border-color:var(--bord);color:var(--ink);box-shadow:0 1px 2px rgba(15,23,42,.05)}
.btn-l:hover{border-color:var(--mint)}
.btn-s{padding:10px 18px;font-size:14px;border-radius:12px}
.btn-wa img{width:20px;height:20px}

/* Navigation */

/* Hero */
.hero{position:relative;overflow:hidden;isolation:isolate;background:radial-gradient(760px 520px at 80% 35%,rgba(173,236,162,.55),transparent 62%),radial-gradient(600px 400px at 5% 0%,rgba(173,236,162,.28),transparent 60%),linear-gradient(180deg,#fff,var(--menthe));padding:84px 0 120px}
/* La barre flottante se pose sur le héros. */
body.sp .pn{margin-bottom:-76px}
body.sp .hero{padding-top:160px}
.hero::before{content:"";position:absolute;inset:0;z-index:-1;background-image:linear-gradient(45deg,rgba(4,120,87,.07) 1px,transparent 1px),linear-gradient(-45deg,rgba(4,120,87,.07) 1px,transparent 1px);background-size:46px 46px;-webkit-mask-image:radial-gradient(ellipse at 70% 40%,#000 20%,transparent 70%);mask-image:radial-gradient(ellipse at 70% 40%,#000 20%,transparent 70%)}
.blob{position:absolute;z-index:-1;width:520px;height:520px;right:4%;top:60px;transform:rotate(45deg);border-radius:90px;background:conic-gradient(from 120deg,#ADECA2,#D9F6D3,#7FDB8F,#ADECA2);filter:blur(60px);opacity:.55;animation:sp-spin 18s linear infinite}
@keyframes sp-spin{to{transform:rotate(405deg)}}
.hero-in{display:grid;grid-template-columns:1.05fr .95fr;gap:56px;align-items:center}
.chip{display:inline-flex;align-items:center;gap:10px;padding:7px 14px 7px 9px;border-radius:999px;background:#fff;border:1px solid var(--mint-line);color:var(--em-d);font-size:13px;font-weight:600;box-shadow:0 6px 20px -10px rgba(4,120,87,.35)}
.chip i{width:8px;height:8px;border-radius:50%;background:var(--em-b);box-shadow:0 0 0 4px rgba(16,185,129,.18);animation:sp-pulse 2s infinite}
@keyframes sp-pulse{50%{box-shadow:0 0 0 8px rgba(16,185,129,0)}}
.hero h1{isolation:isolate;font-size:72px;line-height:1;font-weight:800;margin:24px 0 22px}
.hero h1 em{font-style:normal;position:relative;background:linear-gradient(90deg,#047857,#0E9F6E 45%,#047857);-webkit-background-clip:text;background-clip:text;color:transparent;background-size:200% 100%;animation:sp-shine 6s linear infinite}
.hero h1 em::after{content:"";position:absolute;left:0;right:0;bottom:.14em;height:.3em;background:var(--mint);opacity:.7;z-index:-1;border-radius:6px;transform-origin:left;animation:sp-mark 1.1s .4s cubic-bezier(.2,.7,.2,1) both}
@keyframes sp-mark{from{transform:scaleX(0)}}
@keyframes sp-shine{to{background-position:-200% 0}}
.lead{font-size:19px;color:var(--txt2);max-width:540px}
.cta{display:flex;gap:12px;margin:34px 0 30px;flex-wrap:wrap}
.facts{display:flex;gap:28px;color:var(--txt2);font-size:14px;flex-wrap:wrap}
.facts b{display:block;color:var(--ink);font:800 20px/1.3 var(--display);letter-spacing:-.02em}
.facts a:hover b{color:var(--em)}

.stage{position:relative;height:520px}
.card{position:absolute;background:rgba(255,255,255,.92);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-radius:20px;border:1px solid rgba(255,255,255,.9);box-shadow:0 40px 80px -36px rgba(4,90,60,.45),0 0 0 1px rgba(4,120,87,.08);padding:18px}
.c-dash{left:0;top:40px;width:400px;animation:sp-float 7s ease-in-out infinite}
.c-rec{right:0;top:0;width:220px;animation:sp-float 7s ease-in-out -2s infinite}
.c-pay{right:10px;bottom:30px;width:260px;animation:sp-float 7s ease-in-out -4s infinite}
.mob2{display:contents}
@keyframes sp-float{50%{transform:translateY(-12px)}}
.k{font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--txt3)}
.big{font:800 26px/1.2 var(--display);letter-spacing:-.02em}
.row{display:flex;justify-content:space-between;align-items:center;gap:8px}
.tag{font-size:11px;font-weight:700;border-radius:999px;padding:3px 9px;background:var(--mint-soft);color:var(--em-d)}
.bars{display:flex;align-items:flex-end;gap:7px;height:110px;margin-top:14px}
.bars span{flex:1;border-radius:7px 7px 3px 3px;background:linear-gradient(180deg,#10B981,#047857);transform-origin:bottom;animation:sp-grow 1.2s cubic-bezier(.2,.7,.2,1) both}
.bars span:nth-child(odd){background:linear-gradient(180deg,#C9F3C1,#ADECA2)}
@keyframes sp-grow{from{transform:scaleY(0)}}
.line{display:flex;justify-content:space-between;gap:8px;font-size:13px;padding:8px 0;border-bottom:1px dashed var(--bord)}
.line:last-child{border:0}
.wave{display:flex;align-items:center;gap:12px}
.wave .ic{width:40px;height:40px;flex:none;border-radius:12px;background:#1DC8F1;overflow:hidden;box-shadow:0 0 0 1px rgba(15,23,42,.06)}
.wave .ic img{display:block;width:100%;height:100%;object-fit:cover}
.ok{color:var(--em);font-weight:700}
.thread{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.thread path{stroke:url(#spg);stroke-width:2;fill:none;stroke-dasharray:6 8;animation:sp-dash 3s linear infinite}
@keyframes sp-dash{to{stroke-dashoffset:-56}}

/* Bande atouts */
.strip{background:#fff;border-block:1px solid var(--bord)}
.strip-in{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;padding:28px 24px}
.pill{display:flex;gap:12px;align-items:center;font-size:14px;color:var(--txt2)}
.pill b{display:block;color:var(--ink);font-size:15px}
.dia{flex:none;width:36px;height:36px;display:grid;place-items:center}
.dia::before{content:"";width:22px;height:22px;transform:rotate(45deg);border-radius:6px;background:linear-gradient(135deg,#ADECA2,#10B981);box-shadow:0 0 0 5px var(--mint-soft)}

/* Sections */
.s{padding:110px 0}
.s-mint{background:var(--menthe)}
.eyebrow{display:block;color:var(--em);font-size:13px;font-weight:700;letter-spacing:.12em;text-transform:uppercase}
.sp h2{font-size:50px;line-height:1.06;font-weight:800;margin:12px 0 16px}
.sub{color:var(--txt2);font-size:18px;max-width:640px}

/* Suivi de demande */
.suivi{padding:40px 0;background:#fff;border-bottom:1px solid var(--bord)}
.suivi-card{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:20px;padding:26px;border-radius:var(--r);border:1px solid var(--mint-line);background:linear-gradient(180deg,var(--menthe),#fff)}
.suivi-card h2{font-size:24px;margin:8px 0 0}
.chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
.chips span{padding:6px 12px;border-radius:999px;font-size:14px;font-weight:700;background:var(--mint-soft);border:1px solid var(--mint-line)}
.meta{margin-top:10px;font-size:12px;color:var(--txt3)}

/* Solutions */
.bento{display:grid;grid-template-columns:repeat(6,1fr);gap:18px;margin-top:52px}
.tile{position:relative;display:flex;flex-direction:column;grid-column:span 2;background:#fff;border:1px solid var(--bord);border-radius:var(--r);padding:28px;overflow:hidden;transition:transform .3s,box-shadow .3s,border-color .3s}
.tile:hover{transform:translateY(-4px);box-shadow:0 30px 60px -30px rgba(4,120,87,.35);border-color:#BFE8B7}
.tile h3{font-size:22px;margin:16px 0 6px}
.tile p{color:var(--txt2);font-size:15px}
.tile ul{list-style:none;margin-top:16px;display:grid;gap:8px;font-size:14px}
.tile li::before{content:"";display:inline-block;width:7px;height:7px;margin-right:10px;transform:rotate(45deg);border-radius:2px;background:var(--em-b);vertical-align:2px}
.t-big{grid-column:span 4;grid-row:span 2;order:-1;background:radial-gradient(500px 300px at 90% 0%,rgba(173,236,162,.7),transparent 70%),linear-gradient(160deg,var(--menthe),var(--mint-soft));border-color:var(--mint-line)}
.t-big h3{font-size:30px}
.t-out{grid-column:span 4;flex-direction:row;align-items:center;justify-content:space-between;gap:24px;background:repeating-linear-gradient(-45deg,#fff 0 14px,#F6FCF6 14px 28px);border:1.5px dashed #BFE8B7}
.t-out h3{margin-top:0}
.ico{width:48px;height:48px;border-radius:14px;display:grid;place-items:center;background:var(--mint-soft);color:var(--em)}
.ico svg{width:24px;height:24px}
.t-big .ico{background:#fff}
.mini{margin-top:auto;padding-top:26px}
.mini-in{background:#fff;border:1px solid var(--mint-line);border-radius:16px;padding:16px;display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.mini-in div{font-size:12px;color:var(--txt2)}.mini-in b{display:block;color:var(--ink);font:800 20px/1.3 var(--display)}
.arrow{color:var(--em);font-weight:700;font-size:14px;margin-top:18px;display:inline-flex;gap:6px}
.tile:hover .arrow{gap:10px}
.arrow{transition:gap .2s}
.mini-bars{height:120px;margin:0 0 14px;padding:16px 16px 0;background:rgba(255,255,255,.6);border:1px solid var(--mint-line);border-radius:16px;align-items:flex-end}
.mini-bars span{animation:none}
.t-out .btn{white-space:nowrap;flex:none}

/* Méthode */
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;margin-top:56px;position:relative;list-style:none;padding:0}
.steps::before{content:"";position:absolute;top:27px;left:8%;right:8%;height:2px;background:linear-gradient(90deg,#ADECA2,#10B981)}
.step{position:relative}
.num{width:56px;height:56px;display:grid;place-items:center;position:relative;isolation:isolate;z-index:1;color:var(--em-d);font:800 18px var(--display);margin-bottom:22px}
.num::before{content:"";position:absolute;inset:6px;transform:rotate(45deg);border-radius:10px;background:var(--mint);z-index:-1;box-shadow:0 0 0 6px var(--menthe),0 10px 24px -8px rgba(4,120,87,.45)}
.step h3{font-size:21px;margin-bottom:6px}.step p{color:var(--txt2);font-size:15px}

/* Tarifs */
.plans{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:52px;align-items:stretch}
.plan{position:relative;display:flex;flex-direction:column;background:#fff;border:1px solid var(--bord);border-radius:28px;padding:40px;box-shadow:0 30px 70px -50px rgba(15,23,42,.35)}
.plan-mob{border:0;background:radial-gradient(560px 340px at 100% 0%,rgba(173,236,162,.8),transparent 65%),linear-gradient(180deg,#fff,var(--menthe));box-shadow:0 0 0 2px var(--mint),0 50px 100px -50px rgba(4,120,87,.5)}
.badge{align-self:flex-start;display:inline-flex;align-items:center;gap:8px;padding:6px 12px;border-radius:999px;font-size:12px;font-weight:700;background:var(--menthe);border:1px solid var(--mint-line);color:var(--em-d)}
.plan-mob .badge{background:var(--em);border-color:var(--em);color:#fff}
.plan h3{font-size:28px;margin:18px 0 6px}
.plan-desc{color:var(--txt2);font-size:15px}
.amounts{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:26px 0 8px}
.amounts div{border:1px solid var(--bord);border-radius:16px;padding:16px;background:#fff}
.amounts .hl{border-color:var(--mint);background:linear-gradient(160deg,var(--mint-soft),#fff)}
.amounts small{display:block;font-size:12px;color:var(--txt2);font-weight:600}
.amounts b{display:block;font:800 34px/1.1 var(--display);letter-spacing:-.03em;margin:6px 0 2px}
.amounts span{font-size:13px;color:var(--txt2)}
.commit{font-size:14px;font-weight:700;color:var(--em-d);margin:6px 0 4px}
.inc{list-style:none;display:grid;gap:10px;margin:18px 0 26px;font-size:15px}
.inc li{display:flex;gap:10px;align-items:flex-start}
.inc li::before{content:"";flex:none;width:20px;height:20px;margin-top:2px;border-radius:50%;background:var(--mint-soft) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M5.5 10.5 8.5 13.5 14.5 7' fill='none' stroke='%23047857' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/16px no-repeat}
.inc .opt{color:var(--txt2)}
.inc .opt::before{background:#F1F5F9 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M6 10h8' stroke='%2364748B' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E") center/16px no-repeat}
.plan .btn{margin-top:auto}
.fine{margin-top:28px;display:grid;gap:6px;font-size:13px;color:var(--txt3);max-width:900px}
.fine b{color:var(--txt2)}

/* FAQ */
.faq-list{max-width:820px;margin-top:40px;display:grid;gap:12px}
.faq{background:#fff;border:1px solid var(--bord);border-radius:16px;transition:border-color .2s,box-shadow .2s}
.faq[open]{border-color:var(--mint-line);box-shadow:0 20px 40px -30px rgba(4,120,87,.35)}
.faq summary{list-style:none;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px 22px;font-weight:700;cursor:pointer}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"";flex:none;width:28px;height:28px;border-radius:50%;background:var(--menthe) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 6v12M6 12h12' stroke='%23047857' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E") center/16px no-repeat;transition:transform .25s}
.faq[open] summary::after{transform:rotate(45deg)}
.faq-a{padding:0 22px 20px;color:var(--txt2);font-size:15px}
.faq-a a{color:var(--em);font-weight:700}

/* Appel final + pied */
.close{text-align:center;padding:120px 0;background:radial-gradient(700px 300px at 50% 100%,rgba(173,236,162,.55),transparent 70%),var(--menthe)}
.close h2{font-size:58px}.close .sub{margin:0 auto}.close .cta{justify-content:center}
.foot{background:#fff;border-top:1px solid var(--bord);color:var(--txt2);font-size:14px;padding:48px 0 calc(40px + env(safe-area-inset-bottom))}
.foot-in{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:32px}
.foot h3{font-size:13px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink);margin-bottom:12px}
.foot ul{list-style:none;display:grid;gap:8px}
.foot a:hover{color:var(--em)}
.foot-b{margin-top:36px;padding-top:20px;border-top:1px solid var(--bord);display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;font-size:13px}
.wa-fab{position:fixed;right:18px;bottom:calc(18px + env(safe-area-inset-bottom));z-index:40;display:inline-flex;align-items:center;gap:10px;padding:10px 16px 10px 10px;border-radius:999px;background:#fff;color:var(--ink)!important;border:1px solid var(--mint-line);box-shadow:0 18px 40px -16px rgba(4,120,87,.5);font:700 14px var(--display);transition:transform .2s}
.wa-fab:hover{transform:translateY(-2px)}
.wa-fab img{width:36px;height:36px}

/* Mobile / tablette */
@media (max-width:1024px){
  .hero-in{grid-template-columns:1fr;gap:40px}
  .stage{max-width:620px}
  .plans{grid-template-columns:1fr}
  .foot-in{grid-template-columns:1fr 1fr}
}
@media (max-width:760px){
  .hero{padding:44px 0 56px}
  body.sp .pn{margin-bottom:-68px}
  body.sp .hero{padding-top:112px}
  .blob{width:340px;height:340px;right:-80px;top:520px}
  .hero h1{font-size:44px}.lead{font-size:17px}
  .cta{flex-direction:column}.cta .btn{width:100%}
  .stage{height:auto;display:grid;gap:14px}
  .card{position:relative;inset:auto;width:auto;animation:none}
  .mob2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
  .thread{display:none}.bars{height:80px}.mini-bars{height:90px}
  .strip-in{grid-template-columns:1fr 1fr;gap:18px}
  .s{padding:72px 0}.sp h2{font-size:34px}.sub{font-size:16px}
  .bento{grid-template-columns:1fr}.tile,.t-big,.t-out{grid-column:auto;grid-row:auto}
  .t-out{flex-direction:column;align-items:flex-start}
  .steps{grid-template-columns:1fr;gap:32px}.steps::before{top:0;bottom:0;left:27px;right:auto;width:2px;height:auto}
  .step{padding-left:76px}.num{position:absolute;left:0;top:-6px}
  .plan{padding:28px 20px;border-radius:24px}.amounts b{font-size:28px}
  .close{padding:80px 0}.close h2{font-size:36px}
  .foot-in{grid-template-columns:1fr}
  .wa-fab span{display:none}.wa-fab{padding:8px}
}
@media (max-width:380px){.amounts{grid-template-columns:1fr}}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .sp *,.sp *::before,.sp *::after{animation:none!important;transition:none!important}
  .js .rv{opacity:1;transform:none}
}