/* ============================================================
   ÉPLUCHE - feuille de style unique (site + app + admin)
   ============================================================ */
:root{
  --bg:#F4F5F1; --surface:#FFFFFF; --soft:#FAFAF7;
  --ink:#111B33; --ink-2:#4B5566; --ink-3:#7A8394;
  --line:#DCE0D8; --line-strong:#B4BAB0;
  --marker:#FFE45C;
  --ok:#1F6A3F; --ok-bg:#E3F2E8;
  --warn:#8A5410; --warn-bg:#FFF1DC;
  --bad:#B42318; --bad-bg:#FDECEA;
  --r-xl:20px; --r-lg:14px; --r-md:10px;
  --font:"Manrope",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --max:1160px;
  --sat:env(safe-area-inset-top,0px); --sab:env(safe-area-inset-bottom,0px);
}
*{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:17px;line-height:1.5;-webkit-font-smoothing:antialiased;min-height:100%}
a{color:inherit}
img,svg{max-width:100%}
.wrap{max-width:var(--max);margin:0 auto;padding:0 24px}
h1,h2,h3{margin:0;font-variation-settings:"opsz" 96}
h2{font-size:clamp(1.8rem,3.2vw,2.5rem);line-height:1.1;letter-spacing:-.02em;font-weight:700;max-width:24ch}
.section{padding:88px 0}
.intro{font-size:1.15rem;color:var(--ink-2);max-width:40rem;margin:16px 0 40px}
mark{background:linear-gradient(100deg,transparent 0%,var(--marker) 3%,var(--marker) 96%,transparent 100%);color:inherit;padding:.02em .18em;margin:0 -.1em;border-radius:2px}
:focus-visible{outline:3px solid var(--marker);outline-offset:2px}
.muted{color:var(--ink-2)}
.small{font-size:.9rem}
.center{text-align:center}

/* ---------- Boutons ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;font:600 1rem/1 var(--font);padding:14px 20px;border-radius:var(--r-md);border:1.5px solid var(--ink);background:var(--ink);color:#fff;text-decoration:none;cursor:pointer;transition:background .15s,transform .1s;-webkit-tap-highlight-color:transparent}
.btn:hover{background:#1E2B4C;border-color:#1E2B4C}
.btn:active{transform:translateY(1px)}
.btn[disabled],.btn.is-loading{opacity:.6;pointer-events:none}
.btn--ghost{background:transparent;color:var(--ink)}
.btn--ghost:hover{background:rgba(17,27,51,.06)}
.btn--danger{background:transparent;color:var(--bad);border-color:var(--bad)}
.btn--danger:hover{background:var(--bad-bg);border-color:var(--bad)}
.btn--sm{padding:10px 14px;font-size:.92rem}
.btn--xs{padding:8px 12px;font-size:.85rem;border-radius:8px}
.btn--block{width:100%}
.btn--social{background:#fff;color:var(--ink);border-color:var(--line-strong);justify-content:flex-start;padding-left:16px}
.btn--social:hover{background:#fff;border-color:var(--ink)}
.btn--social svg{width:20px;height:20px;flex:none}
.btn--social span{flex:1;text-align:center;margin-right:20px}
.link{background:none;border:0;padding:0;font:inherit;color:var(--ink);font-weight:600;cursor:pointer;border-bottom:2px solid var(--marker);text-decoration:none}

/* ---------- Formulaires ---------- */
.field{display:block;margin-bottom:16px}
.field > span{display:block;font-weight:600;font-size:.95rem;margin-bottom:6px}
.field small{display:block;color:var(--ink-3);font-size:.85rem;margin-top:5px}
.input,select.input,textarea.input{width:100%;font:inherit;font-size:1rem;padding:13px 14px;border:1.5px solid var(--line-strong);border-radius:var(--r-md);background:#fff;color:var(--ink);-webkit-appearance:none;appearance:none}
.input:focus{border-color:var(--ink);outline:none;box-shadow:0 0 0 3px rgba(255,228,92,.6)}
textarea.input{min-height:140px;resize:vertical}
select.input{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23111B33' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center;padding-right:38px}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.check{display:flex;gap:10px;align-items:flex-start;font-size:.95rem;color:var(--ink-2)}
.check input{margin-top:4px;width:18px;height:18px;flex:none}
.hp{position:absolute;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden}

/* ---------- Messages ---------- */
.flash{padding:12px 0;font-weight:500;font-size:.97rem}
.flash--ok{background:var(--ok-bg);color:var(--ok)}
.flash--bad{background:var(--bad-bg);color:var(--bad)}
.flash--info{background:#EEF1FA;color:#2A3A6B}
.l-app .flash .wrap{max-width:820px}
.alert{padding:12px 14px;border-radius:var(--r-md);font-size:.95rem;margin:0 0 16px}
.alert--bad{background:var(--bad-bg);color:var(--bad)}
.alert--ok{background:var(--ok-bg);color:var(--ok)}
.alert--info{background:#EEF1FA;color:#2A3A6B}
.alert ul{margin:6px 0 0;padding-left:18px}

/* ---------- Header site ---------- */
.nav{position:sticky;top:0;z-index:20;background:rgba(244,245,241,.92);backdrop-filter:blur(8px);border-bottom:1px solid var(--line);padding-top:var(--sat)}
.nav .wrap{display:flex;align-items:center;justify-content:space-between;height:68px;gap:12px}
.logo{display:inline-flex;align-items:center;gap:10px;font-weight:800;font-size:1.35rem;letter-spacing:-.02em;text-decoration:none;white-space:nowrap}
.logo i{width:26px;height:26px;border-radius:7px;background:var(--marker);display:inline-block;position:relative;flex:none}
.logo i::after{content:"";position:absolute;left:6px;right:6px;top:11px;height:4px;background:var(--ink);border-radius:2px}
.logo--sm{font-size:1.1rem}
.logo--sm i{width:20px;height:20px}
.logo--sm i::after{left:5px;right:5px;top:8px;height:3px}
.nav ul{display:flex;gap:28px;list-style:none;margin:0;padding:0}
.nav ul a{text-decoration:none;font-weight:500;color:var(--ink-2)}
.nav ul a:hover{color:var(--ink)}
.nav__auth{display:inline-flex;align-items:center;gap:16px}
.nav__login{text-decoration:none;font-weight:600;color:var(--ink-2)}
@media (max-width:900px){.nav ul{display:none}.nav__login{display:none}}

/* ---------- Footer ---------- */
.footer{border-top:1px solid var(--line);padding:32px 0 calc(44px + var(--sab));font-size:.9rem;color:var(--ink-2)}
.footer .wrap{display:flex;justify-content:space-between;gap:24px;flex-wrap:wrap;align-items:center}
.footer ul{display:flex;gap:20px;list-style:none;margin:0;padding:0;flex-wrap:wrap}
.footer a{text-decoration:none}
.footer a:hover{text-decoration:underline}
.footer .legal{width:100%;font-size:.85rem;color:var(--ink-3);margin-top:8px}

/* ============================================================
   LANDING
   ============================================================ */
.hero{padding:64px 0 72px}
.hero__top{display:grid;grid-template-columns:1.25fr .9fr;gap:48px;align-items:center;margin-bottom:44px}
.hero h1{font-size:clamp(2.5rem,5vw,4rem);line-height:1;letter-spacing:-.03em;font-weight:800;margin-bottom:20px}
.stat{font-size:clamp(1.2rem,2vw,1.45rem);font-weight:600;letter-spacing:-.01em;margin:0 0 16px}
.stat b{color:var(--ok);font-weight:800}
.stat sup{font-size:.6em;color:var(--ink-3);font-weight:500}
.lead{font-size:1.15rem;color:var(--ink-2);max-width:34rem;margin:0}
.foot{font-size:.82rem;color:var(--ink-3);margin:14px 0 0;max-width:34rem}
.caption{font-size:.95rem;color:var(--ink-2);margin:0 0 12px}

/* Bloc "Commencer" (hero) et cartes auth */
.start{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-xl);padding:26px;box-shadow:0 30px 60px -30px rgba(17,27,51,.3)}
.start h3,.auth h1{font-size:1.35rem;font-weight:700;letter-spacing:-.015em;margin-bottom:6px}
.start > p{margin:0 0 18px;color:var(--ink-2);font-size:.97rem}
.social{display:grid;gap:10px}
.or{display:flex;align-items:center;gap:12px;color:var(--ink-3);font-size:.85rem;margin:16px 0}
.or::before,.or::after{content:"";flex:1;height:1px;background:var(--line)}
.start .then{margin:16px 0 0;font-size:.92rem;color:var(--ink-2)}
.start .then b{color:var(--ink);font-weight:600}
.trust{margin:12px 0 0;font-size:.9rem;color:var(--ink-2)}
.trust b{font-weight:600;color:var(--ink)}

/* Dashboard (aperçu landing) */
.dash{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-xl);overflow:hidden;box-shadow:0 30px 60px -30px rgba(17,27,51,.3)}
.dash__top{display:grid;grid-template-columns:1.1fr 1fr 1fr auto;gap:28px;align-items:end;padding:28px 30px 24px;border-bottom:1px solid var(--line)}
.dash__total small{display:block;color:var(--ink-2);font-size:.95rem;margin-bottom:6px}
.dash__total strong{display:block;font-size:3.1rem;font-weight:800;letter-spacing:-.035em;line-height:1;font-variation-settings:"opsz" 96;white-space:nowrap}
.dash__total strong em{font-style:normal;font-size:.42em;font-weight:600;color:var(--ink-2);letter-spacing:0;margin-left:4px}
.dash__total span{display:block;color:var(--ink-2);margin-top:8px;font-size:.95rem}
.split{padding:12px 16px;border-radius:var(--r-md);border:1px solid var(--line)}
.split b{display:block;font-size:1.5rem;font-weight:800;letter-spacing:-.02em;line-height:1.1;font-variant-numeric:tabular-nums}
.split b small{font-size:.6em;font-weight:600;color:var(--ink-2)}
.split span{display:block;font-size:.88rem;color:var(--ink-2);margin-top:4px}
.split.now{background:var(--ok-bg);border-color:transparent}
.split.now b{color:var(--ok)}
.split.later{background:var(--warn-bg);border-color:transparent}
.split.later b{color:var(--warn)}
.paying{text-align:right;color:var(--ink-2);font-size:.92rem;line-height:1.35}
.paying b{display:block;font-size:1.35rem;color:var(--ink);font-weight:700;letter-spacing:-.01em}
.table-wrap{overflow-x:auto;padding:4px 30px 0}
.tbl{width:100%;border-collapse:collapse;min-width:800px;font-size:.97rem}
.tbl th{text-align:left;font-weight:500;color:var(--ink-3);font-size:.85rem;padding:14px 12px 10px 0;border-bottom:1px solid var(--line)}
.tbl td{padding:14px 12px 14px 0;border-bottom:1px solid var(--line);vertical-align:middle}
.tbl tr > *:last-child{padding-right:0}
.tbl td b{display:block;font-weight:700}
.tbl td .sub{display:block;color:var(--ink-2);font-size:.9rem}
.tbl .num{text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums}
.tbl .num small{color:var(--ink-3);font-size:.8em}
.tbl .save{font-weight:700;color:var(--ok);font-size:1.05rem}
.tbl .save.zero{color:var(--ink-3);font-weight:400;font-size:.97rem}
.tbl .date{white-space:nowrap;color:var(--ink-2)}
.when{display:inline-flex;align-items:center;font-size:.85rem;font-weight:600;white-space:nowrap;padding:4px 10px;border-radius:999px;background:var(--bg);color:var(--ink-2)}
.when.now{background:var(--ok-bg);color:var(--ok)}
.when.later{background:var(--warn-bg);color:var(--warn)}
.tbl .act{text-align:right;white-space:nowrap}
.watch{font-size:.85rem;color:var(--ink-3);display:inline-flex;align-items:center;gap:6px}
.watch::before{content:"";width:12px;height:12px;border-radius:50%;background:var(--ok-bg);box-shadow:inset 0 0 0 1.5px var(--ok)}
.tbl tfoot td{border-bottom:0;border-top:2px solid var(--ink);font-weight:700;padding:16px 12px 20px 0}
.tbl tfoot td .sub{font-weight:400}
.dash__note{padding:0 30px 20px;font-size:.85rem;color:var(--ink-3)}
.timeline{padding:22px 30px 30px;border-top:1px solid var(--line);background:var(--soft)}
.timeline__title{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;font-size:.92rem;color:var(--ink-2);margin-bottom:22px}
.legend{display:inline-flex;gap:16px;font-size:.85rem}
.legend i{display:inline-block;width:10px;height:10px;border-radius:50%;background:var(--ink);vertical-align:-1px;margin-right:6px}
.legend i.hollow{background:var(--soft);box-shadow:inset 0 0 0 2px var(--ink)}
.tl{position:relative;height:78px}
.tl__bar{position:absolute;left:0;right:0;top:36px;height:2px;background:var(--line-strong)}
.tl__months{position:absolute;left:0;right:0;top:48px;display:grid;grid-template-columns:repeat(12,1fr);font-size:.78rem;color:var(--ink-3)}
.tl__dot{position:absolute;top:30px;transform:translateX(-50%);width:14px;height:14px;border-radius:50%;background:var(--ink);border:3px solid var(--soft);box-shadow:0 0 0 1px var(--line-strong)}
.tl__dot.hollow{background:var(--soft);box-shadow:inset 0 0 0 2px var(--ink),0 0 0 1px var(--line-strong)}
.tl__lbl{position:absolute;top:2px;transform:translateX(-50%);font-size:.8rem;font-weight:600;white-space:nowrap}
.tl__lbl.dim{font-weight:500;color:var(--ink-3)}

.gain{display:grid;grid-template-columns:1fr 1fr;gap:22px;margin-top:28px}
.gain > div{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);padding:26px 28px}
.gain > div.up{border-color:var(--ok);background:var(--ok-bg)}
.gain small{display:block;color:var(--ink-2);font-size:.95rem;margin-bottom:8px}
.gain strong{display:block;font-size:1.65rem;font-weight:800;letter-spacing:-.02em;line-height:1.15;margin-bottom:10px}
.gain .up strong{color:var(--ok)}
.gain p{margin:0;color:var(--ink-2)}

.two{display:grid;grid-template-columns:.9fr 1.1fr;gap:56px;align-items:start}
.two .intro{margin-bottom:22px}
.two ul.plain{margin:0 0 26px;padding:0;list-style:none;display:grid;gap:10px;color:var(--ink-2)}
.two ul.plain li{padding-left:22px;position:relative}
.two ul.plain li::before{content:"";position:absolute;left:0;top:.62em;width:10px;height:3px;background:var(--marker)}
.sample{font-size:.95rem}

/* Carte d'analyse (landing + app) */
.analysis{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-xl);box-shadow:0 30px 60px -30px rgba(17,27,51,.3);overflow:hidden}
.analysis__head{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:14px 18px;border-bottom:1px solid var(--line);font-size:.88rem;color:var(--ink-2);flex-wrap:wrap}
.files{display:flex;gap:6px;flex-wrap:wrap}
.file{display:inline-flex;align-items:center;gap:6px;background:var(--bg);border:1px solid var(--line);border-radius:999px;padding:4px 10px 4px 8px;color:var(--ink);font-weight:500;font-size:.82rem;max-width:100%}
.file span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.state{display:inline-flex;align-items:center;gap:7px;font-weight:600;color:var(--ok);white-space:nowrap}
.state i{width:8px;height:8px;border-radius:50%;background:currentColor}
.analysis.is-working .state{color:var(--warn)}
.tabs{display:flex;gap:4px;padding:14px 18px 0;border-bottom:1px solid var(--line);overflow-x:auto}
.tab{background:none;border:0;border-bottom:2px solid transparent;margin-bottom:-1px;padding:8px 6px 12px;font:600 .95rem var(--font);color:var(--ink-3);cursor:pointer;white-space:nowrap}
.tab.is-on{color:var(--ink);border-bottom-color:var(--ink)}
.tab:hover{color:var(--ink)}
.pane{padding:8px 22px 22px}
.pane[hidden]{display:none}
.ess{list-style:none;margin:0;padding:0;counter-reset:f}
.ess li{counter-increment:f;display:grid;grid-template-columns:24px 1fr;gap:12px;padding:12px 0;border-bottom:1px solid var(--line);opacity:0;transform:translateY(6px)}
.ess li.on{opacity:1;transform:none;transition:opacity .4s ease,transform .4s ease}
.ess li::before{content:counter(f);width:24px;height:24px;border-radius:50%;background:var(--ink);color:#fff;font-size:.78rem;font-weight:700;display:grid;place-items:center;margin-top:1px}
.ess li.is-save::before{background:var(--ok)}
.ess li.is-date::before{background:var(--warn)}
.ess li.is-warn::before{background:var(--bad)}
.ess b{display:block;font-weight:600;line-height:1.3}
.ess p{margin:3px 0 0;color:var(--ink-2);font-size:.92rem;line-height:1.45}
.analysis__actions{display:flex;gap:10px;flex-wrap:wrap;padding-top:16px}
.det{margin:0;display:grid;gap:0}
.det > div{display:grid;grid-template-columns:130px 1fr;gap:14px;padding:12px 0;border-bottom:1px solid var(--line);font-size:.93rem}
.det dt{font-weight:600;color:var(--ink-2)}
.det dd{margin:0;line-height:1.5;white-space:pre-line}
.det dd s{color:var(--ink-3)}
.progress{display:none;padding:30px 22px 34px}
.progress ul{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.progress li{display:flex;align-items:center;gap:12px;color:var(--ink-3)}
.progress li i{width:22px;height:22px;border-radius:50%;border:2px solid var(--line-strong);display:grid;place-items:center;flex:none;transition:background .2s,border-color .2s}
.progress li.done{color:var(--ink)}
.progress li.done i{background:var(--ink);border-color:var(--ink)}
.progress li.done i::after{content:"";width:6px;height:10px;border:solid #fff;border-width:0 2px 2px 0;transform:rotate(45deg) translate(-1px,-1px)}
.progress li.now{color:var(--ink)}
.progress li.now i{border-color:var(--ink);border-top-color:transparent;animation:spin 1s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.analysis.is-working .tabs,.analysis.is-working .pane{display:none}
.analysis.is-working .progress{display:block}

.ways{display:grid;grid-template-columns:repeat(3,1fr);gap:28px}
.way{padding-top:20px;border-top:2px solid var(--ink)}
.way h3{font-size:1.3rem;font-weight:700;letter-spacing:-.01em;margin-bottom:10px}
.way > p{margin:0 0 18px;color:var(--ink-2)}
.way ul{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.way li{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-md);padding:12px 14px;font-size:.93rem;display:flex;justify-content:space-between;gap:12px;align-items:baseline}
.way li span{color:var(--ink-2)}
.way li b{white-space:nowrap;color:var(--ok);font-weight:700}

.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:32px;counter-reset:s}
.step{counter-increment:s;padding-top:18px;border-top:2px solid var(--ink)}
.step::before{content:counter(s);display:block;font-size:2.4rem;font-weight:800;letter-spacing:-.03em;line-height:1;margin-bottom:14px;font-variation-settings:"opsz" 96}
.step h3{font-size:1.25rem;font-weight:700;margin-bottom:8px;letter-spacing:-.01em}
.step p{margin:0;color:var(--ink-2)}

.free{background:var(--ink);color:#F4F5F1}
.free h2{color:#fff}
.free__grid{display:grid;grid-template-columns:1fr 1.25fr;gap:56px;align-items:start}
.free p{color:#C9CEDA;font-size:1.1rem;margin:0 0 18px;max-width:36rem}
.free p strong{color:#fff;font-weight:600}
.partners{margin-top:30px;padding-top:22px;border-top:1px solid rgba(255,255,255,.14)}
.partners small{display:block;color:#8F97AA;font-size:.85rem;margin-bottom:12px}
.partners div{display:flex;gap:10px;flex-wrap:wrap}
.partners span{border:1px dashed rgba(255,255,255,.35);border-radius:8px;padding:10px 14px;font-size:.88rem;color:#C9CEDA}

.secu{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
.secu > div{padding-top:20px;border-top:2px solid var(--ink)}
.secu h3{font-size:1.12rem;font-weight:700;margin-bottom:8px;letter-spacing:-.01em}
.secu p{margin:0;color:var(--ink-2);font-size:.96rem}

.faq{max-width:760px;margin-top:32px}
.faq details{border-top:1px solid var(--line)}
.faq details:last-child{border-bottom:1px solid var(--line)}
.faq summary{list-style:none;cursor:pointer;padding:20px 40px 20px 0;font-size:1.1rem;font-weight:600;position:relative;letter-spacing:-.01em}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"";position:absolute;right:6px;top:26px;width:10px;height:10px;border-right:2px solid var(--ink);border-bottom:2px solid var(--ink);transform:rotate(45deg);transition:transform .2s}
.faq details[open] summary::after{transform:rotate(225deg);top:30px}
.faq details p{margin:0 0 22px;color:var(--ink-2);max-width:62ch}

.final{padding:96px 0 104px;text-align:center}
.final h2{max-width:none;margin:0 auto 12px;font-size:clamp(2rem,4vw,3rem)}
.final p{color:var(--ink-2);font-size:1.15rem;margin:0 0 30px}

/* ============================================================
   PAGES SIMPLES (auth, légal, contact, comparateur)
   ============================================================ */
.auth{max-width:440px;margin:48px auto;padding:0 20px}
.auth .card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-xl);padding:28px;box-shadow:0 30px 60px -30px rgba(17,27,51,.25)}
.auth .card > p.muted{margin:0 0 20px}
.auth .under{margin:18px 0 0;font-size:.95rem;color:var(--ink-2);text-align:center}
.auth .under a{font-weight:600}
.page{max-width:760px;margin:0 auto;padding:56px 24px 80px}
.page h1{font-size:clamp(2rem,4vw,2.8rem);letter-spacing:-.025em;line-height:1.05;font-weight:800;margin-bottom:14px}
.page h2{font-size:1.35rem;margin:36px 0 10px}
.page p,.page li{color:var(--ink-2)}
.page .lead{margin-bottom:24px}
.comparer{max-width:980px;margin:0 auto;padding:40px 24px 80px}
.comparer__frame{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-xl);padding:12px;min-height:420px}
.comparer__frame iframe{width:100%;border:0}

/* ============================================================
   APP
   ============================================================ */
.l-app{background:var(--bg)}
.l-app .main{max-width:820px;margin:0 auto;padding:24px 20px calc(96px + var(--sab))}
.topbar{position:sticky;top:0;z-index:20;background:rgba(244,245,241,.94);backdrop-filter:blur(8px);border-bottom:1px solid var(--line);padding-top:var(--sat)}
.topbar__in{max-width:820px;margin:0 auto;padding:0 20px;height:62px;display:flex;align-items:center;justify-content:space-between;gap:12px}
.topnav{display:flex;align-items:center;gap:22px}
.topnav a{text-decoration:none;font-weight:500;color:var(--ink-2);white-space:nowrap}
.topnav a.on{color:var(--ink);font-weight:700}
.topnav a.btn{color:#fff}
.tabbar{position:fixed;left:0;right:0;bottom:0;z-index:30;display:none;background:rgba(255,255,255,.96);backdrop-filter:blur(10px);border-top:1px solid var(--line);padding:6px 8px calc(6px + var(--sab));justify-content:space-around;align-items:center}
.tabbar a{flex:1;display:flex;flex-direction:column;align-items:center;gap:3px;text-decoration:none;color:var(--ink-3);font-size:.72rem;font-weight:600;padding:6px 0}
.tabbar a svg{width:24px;height:24px}
.tabbar a.on{color:var(--ink)}
.tabbar__add{flex:0 0 auto !important;width:54px;height:54px;border-radius:50%;background:var(--ink);color:#fff !important;justify-content:center;margin-top:-26px;box-shadow:0 8px 20px -6px rgba(17,27,51,.5);border:4px solid var(--bg)}
.tabbar__add svg{width:26px;height:26px}
@media (max-width:760px){
  .topnav{display:none}
  .tabbar{display:flex}
}

.page-head{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;margin:8px 0 20px;flex-wrap:wrap}
.page-head h1{font-size:clamp(1.6rem,4vw,2.1rem);letter-spacing:-.02em;line-height:1.1;font-weight:800}
.page-head p{margin:6px 0 0;color:var(--ink-2)}
.back{display:inline-flex;align-items:center;gap:6px;text-decoration:none;color:var(--ink-2);font-weight:500;font-size:.95rem;margin-bottom:10px}
.back:hover{color:var(--ink)}

/* Totaux */
.totals{display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:12px;margin-bottom:22px}
.total{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);padding:16px 18px}
.total small{display:block;color:var(--ink-2);font-size:.85rem;margin-bottom:4px}
.total strong{display:block;font-size:1.7rem;font-weight:800;letter-spacing:-.025em;line-height:1.1;white-space:nowrap}
.total strong em{font-style:normal;font-size:.55em;font-weight:600;color:var(--ink-2);margin-left:3px}
.total.now{background:var(--ok-bg);border-color:transparent}
.total.now strong{color:var(--ok)}
.total.later{background:var(--warn-bg);border-color:transparent}
.total.later strong{color:var(--warn)}
.total span{display:block;font-size:.82rem;color:var(--ink-2);margin-top:2px}

/* Liste de contrats */
.clist{display:grid;gap:10px}
.ccard{display:grid;grid-template-columns:44px 1fr auto;gap:14px;align-items:center;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);padding:14px 16px;text-decoration:none;transition:border-color .15s}
.ccard:hover{border-color:var(--ink)}
.ccard .ico{width:44px;height:44px;border-radius:12px;background:var(--bg);display:grid;place-items:center;color:var(--ink)}
.ccard b{display:block;font-weight:700;line-height:1.25}
.ccard .sub{display:block;color:var(--ink-2);font-size:.9rem;margin-top:2px}
.ccard .right{text-align:right;white-space:nowrap}
.ccard .right b{font-size:1.05rem}
.ccard .right small{display:block;font-size:.8rem;color:var(--ink-2)}
.ccard .right .save{color:var(--ok)}
.badge{display:inline-flex;align-items:center;gap:6px;font-size:.78rem;font-weight:600;padding:3px 9px;border-radius:999px;background:var(--bg);color:var(--ink-2);white-space:nowrap}
.badge.now{background:var(--ok-bg);color:var(--ok)}
.badge.later{background:var(--warn-bg);color:var(--warn)}
.badge.err{background:var(--bad-bg);color:var(--bad)}
.badge.wait{background:#EEF1FA;color:#2A3A6B}
.empty{background:var(--surface);border:1px dashed var(--line-strong);border-radius:var(--r-xl);padding:40px 24px;text-align:center}
.empty h2{font-size:1.4rem;margin:0 auto 8px}
.empty p{color:var(--ink-2);margin:0 auto 20px;max-width:34rem}

/* Choix du type */
.types{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin-bottom:20px}
.types label{position:relative;display:flex;align-items:center;gap:12px;background:var(--surface);border:1.5px solid var(--line);border-radius:var(--r-lg);padding:14px;cursor:pointer;font-weight:600;font-size:.97rem}
.types label:hover{border-color:var(--ink)}
.types input{position:absolute;opacity:0;pointer-events:none}
.types input:checked + span{color:var(--ink)}
.types label:has(input:checked){border-color:var(--ink);background:#FFFBE0;box-shadow:inset 0 0 0 1px var(--ink)}
.types .ti{flex:none;color:var(--ink)}
@media (min-width:600px){.types{grid-template-columns:repeat(3,1fr)}}

/* Zone de dépôt */
.drop{display:block;padding:22px;background:var(--surface);border:2px dashed var(--line-strong);border-radius:var(--r-lg);cursor:pointer;transition:border-color .15s;text-align:center}
.drop:hover,.drop.is-over{border-color:var(--ink)}
.drop__icon{width:50px;height:50px;border-radius:12px;background:var(--marker);display:grid;place-items:center;margin:0 auto 12px}
.drop strong{display:block;font-size:1.05rem}
.drop p{margin:4px 0 0;color:var(--ink-2);font-size:.9rem}
.drop input{display:none}
.filelist{list-style:none;margin:14px 0 0;padding:0;display:grid;gap:8px}
.filelist li{display:flex;align-items:center;gap:10px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-md);padding:10px 12px;font-size:.92rem}
.filelist li .n{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:500}
.filelist li .s{color:var(--ink-3);font-size:.82rem;white-space:nowrap}
.filelist li button{background:none;border:0;color:var(--ink-3);font-size:1.2rem;line-height:1;cursor:pointer;padding:2px 4px}
.filelist li.bad{border-color:var(--bad);color:var(--bad)}
.upbar{height:8px;background:var(--line);border-radius:4px;overflow:hidden;margin-top:14px;display:none}
.upbar i{display:block;height:100%;width:0;background:var(--ink);transition:width .2s}
.sticky-actions{position:sticky;bottom:calc(72px + var(--sab));background:linear-gradient(to top,var(--bg) 70%,transparent);padding:16px 0 8px;margin-top:20px}
@media (min-width:761px){.sticky-actions{position:static;padding:20px 0 0;background:none}}

/* Fiche contrat */
.chead{display:flex;gap:14px;align-items:center;margin-bottom:16px}
.chead .ico{width:52px;height:52px;border-radius:14px;background:var(--surface);border:1px solid var(--line);display:grid;place-items:center;flex:none}
.chead h1{font-size:1.5rem;letter-spacing:-.02em;line-height:1.15;font-weight:800}
.chead p{margin:4px 0 0;color:var(--ink-2);font-size:.95rem}
.kv{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:16px}
.kv div{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-md);padding:12px 14px}
.kv small{display:block;color:var(--ink-2);font-size:.8rem}
.kv b{display:block;font-size:1.15rem;font-weight:700;letter-spacing:-.01em;margin-top:2px;white-space:nowrap}
.kv b.save{color:var(--ok)}
.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);padding:20px;margin-bottom:16px}
.card h2{font-size:1.15rem;margin-bottom:12px}
.doclist{list-style:none;margin:0;padding:0}
.doclist li{display:flex;align-items:center;gap:12px;padding:10px 0;border-top:1px solid var(--line);font-size:.93rem}
.doclist li:first-child{border-top:0}
.doclist .n{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.doclist .n a{text-decoration:none;font-weight:500}
.doclist .n a:hover{text-decoration:underline}
.doclist .s{color:var(--ink-3);font-size:.82rem;white-space:nowrap}
.doclist form{display:inline}
.doclist select{font:inherit;font-size:.85rem;padding:5px 26px 5px 8px;border-radius:8px;border:1px solid var(--line-strong);background:#fff}
.icon-btn{background:none;border:0;color:var(--ink-3);cursor:pointer;padding:4px;display:inline-grid;place-items:center;border-radius:6px}
.icon-btn:hover{color:var(--bad);background:var(--bad-bg)}
.icon-btn svg{width:18px;height:18px}
.group-title{font-size:.85rem;font-weight:600;color:var(--ink-2);margin:22px 0 8px;text-transform:none}
.inline-form{display:flex;gap:10px;align-items:flex-end;flex-wrap:wrap}
.inline-form .field{margin:0;flex:1;min-width:180px}
.danger-zone{border-color:var(--bad-bg)}
.danger-zone h2{color:var(--bad)}
.notice{font-size:.85rem;color:var(--ink-3);margin:12px 0 0}

/* Admin */
.admin .main{max-width:1160px}
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px;margin-bottom:24px}
.stats div{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-md);padding:12px 14px}
.stats small{display:block;color:var(--ink-2);font-size:.8rem}
.stats b{display:block;font-size:1.5rem;font-weight:800;letter-spacing:-.02em}
.funnel{display:grid;gap:6px;margin-bottom:24px}
.funnel div{display:grid;grid-template-columns:220px 1fr 70px;gap:12px;align-items:center;font-size:.92rem}
.funnel i{display:block;height:14px;background:var(--ink);border-radius:4px;min-width:2px}
.funnel span:last-child{text-align:right;font-weight:600;font-variant-numeric:tabular-nums}
.adm{width:100%;border-collapse:collapse;font-size:.9rem;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-md);overflow:hidden}
.adm th{text-align:left;font-weight:600;color:var(--ink-2);font-size:.8rem;padding:10px 12px;background:var(--soft);border-bottom:1px solid var(--line)}
.adm td{padding:10px 12px;border-bottom:1px solid var(--line);vertical-align:top}
.adm tr:last-child td{border-bottom:0}
.adm .num{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
.adm a{font-weight:500}
.scroll{overflow-x:auto;margin-bottom:24px}
.admin-nav{display:flex;gap:18px;margin-bottom:24px;flex-wrap:wrap}
.admin-nav a{text-decoration:none;font-weight:600;color:var(--ink-2)}
.admin-nav a.on{color:var(--ink);border-bottom:2px solid var(--marker)}

/* ---------- Responsive ---------- */
@media (max-width:1000px){
  .hero__top,.two,.free__grid,.gain{grid-template-columns:1fr;gap:36px}
  .gain{gap:16px}
  .dash__top{grid-template-columns:1fr 1fr;gap:18px}
  .paying{text-align:left}
  .ways,.steps{grid-template-columns:1fr;gap:26px}
  .secu{grid-template-columns:1fr 1fr}
}
@media (max-width:640px){
  body{font-size:16px}
  .section{padding:64px 0}
  .hero{padding:32px 0 48px}
  .hero h1{font-size:2.35rem}
  .dash__top{grid-template-columns:1fr;padding:22px 20px}
  .table-wrap,.dash__note{padding-left:20px;padding-right:20px}
  .timeline{padding-left:20px;padding-right:20px}
  .secu{grid-template-columns:1fr}
  .tl__months span:nth-child(even){visibility:hidden}
  .det > div{grid-template-columns:1fr;gap:4px}
  .totals{grid-template-columns:1fr 1fr}
  .totals .total:first-child{grid-column:1 / -1}
  .kv{grid-template-columns:1fr 1fr}
  .kv div:last-child:nth-child(odd){grid-column:1 / -1}
  .form-row{grid-template-columns:1fr}
  .ccard{grid-template-columns:40px 1fr}
  .ccard .right{grid-column:2;text-align:left;display:flex;gap:10px;align-items:baseline}
  .ccard .right small{display:inline}
  .auth{margin:24px auto}
  .auth .card{padding:22px}
  .funnel div{grid-template-columns:130px 1fr 60px}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .ess li{opacity:1;transform:none}
  .ess li.on{transition:none}
  .progress li.now i{animation:none}
}

/* ============================================================
   V1.1 - récap des contrats, corrections, comparateur
   ============================================================ */
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.badge.warn{background:var(--warn-bg);color:var(--warn)}
.alert--warn{background:var(--warn-bg);color:var(--warn)}
.alert--warn a,.alert--info a{color:inherit;font-weight:600}
.alert .link{color:inherit}
.warn-text{color:var(--warn) !important;font-weight:600}
.total__date{font-size:1.35rem !important}
.kv .per{font-style:normal;font-size:.7em;color:var(--ink-2);font-weight:600}
.kv small + small{margin-top:2px}

/* Tableau récapitulatif */
.recap-wrap{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden}
.recap{width:100%;border-collapse:collapse;font-size:.93rem}
.recap th{text-align:left;font-weight:500;color:var(--ink-3);font-size:.8rem;padding:12px 10px;border-bottom:1px solid var(--line);background:var(--soft);white-space:nowrap}
.recap td{padding:12px 10px;border-bottom:1px solid var(--line);vertical-align:middle}
.recap th:first-child,.recap td:first-child{padding-left:16px}
.recap th:last-child,.recap td:last-child{padding-right:16px}
.recap .num{text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums}
.recap b{font-weight:700}
.recap .sub{display:block;color:var(--ink-2);font-size:.82rem;font-weight:400}
.recap .save{color:var(--ok)}
.recap .save small{font-size:.8em;font-weight:600}
.recap .c-link{display:flex;gap:12px;align-items:center;text-decoration:none;min-width:220px}
.recap .c-link:hover b{text-decoration:underline}
.recap .c-link .ico{width:38px;height:38px;border-radius:10px;background:var(--bg);display:grid;place-items:center;flex:none}
.recap .c-link .badge{margin-top:4px}
.recap .c-date{white-space:nowrap}
.recap .act{text-align:right;white-space:nowrap}
.recap .act > *{vertical-align:middle}
.recap .act form{display:inline}
.recap .act .btn + .btn{margin-left:4px}
.recap tfoot td{border-bottom:0;border-top:2px solid var(--ink);font-weight:700;background:var(--soft)}
.recap tbody tr:hover{background:#FCFCFA}

@media (max-width:760px){
  .hide-mobile{display:none !important}
  .recap-wrap{background:none;border:0;border-radius:0;overflow:visible}
  .recap thead{display:none}
  .recap,.recap tbody,.recap tfoot{display:block}
  .recap tbody tr{display:grid;grid-template-columns:1fr 1fr;gap:10px 14px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);padding:14px 16px;margin-bottom:10px}
  .recap tbody tr:hover{background:var(--surface)}
  .recap td{display:block;padding:0 !important;border:0;text-align:left !important}
  .recap td[data-label]::before{content:attr(data-label);display:block;font-size:.75rem;color:var(--ink-3);font-weight:500;margin-bottom:2px}
  .recap .c-contract,.recap .c-act{grid-column:1 / -1}
  .recap .c-link{min-width:0}
  .recap .c-act{display:flex;gap:8px;align-items:center;justify-content:flex-start;border-top:1px solid var(--line) !important;padding-top:10px !important}
  .recap .c-act form{margin-left:auto}
  .recap .act .btn + .btn{margin-left:0}
  .recap tfoot tr{display:grid;grid-template-columns:1fr 1fr;gap:6px 14px;padding:14px 16px;border-top:2px solid var(--ink);background:var(--soft);border-radius:0 0 var(--r-lg) var(--r-lg)}
  .recap tfoot td{border:0;background:none;padding:0 !important;text-align:left !important}
  .recap tfoot td:first-child{grid-column:1 / -1}
  .kv div:last-child:nth-child(odd){grid-column:1 / -1}
}

/* Bandeau « Comparez et économisez » */
.cta-compare{display:flex;align-items:center;justify-content:space-between;gap:14px;background:var(--ok-bg);border:1px solid transparent;border-radius:var(--r-lg);padding:14px 16px;margin-bottom:16px;text-decoration:none;transition:border-color .15s}
.cta-compare:hover{border-color:var(--ok)}
.cta-compare b{display:block;color:var(--ok);font-size:1.02rem}
.cta-compare small{display:block;color:var(--ink-2);font-size:.85rem;margin-top:2px}
.cta-compare .btn{flex:none}

/* Formulaire de correction */
.fix summary{cursor:pointer;font-weight:700;font-size:1.02rem;list-style:none}
.fix summary::-webkit-details-marker{display:none}
.fix summary::before{content:"✎";display:inline-block;margin-right:8px;color:var(--ink-2)}
.fix[open] summary{margin-bottom:6px}
.price-input{display:flex;gap:8px}
.price-input input{flex:1;min-width:0}
.price-input select{width:auto;flex:none}

/* Tableau de bord élargi pour le récapitulatif */
.l-app.l-wide .main,.l-app.l-wide .topbar__in{max-width:1120px}
.l-app.l-wide .flash .wrap{max-width:1120px}
@media (max-width:640px){
  .totals > *{min-width:0}
  .total strong{font-size:1.4rem}
  .total__date{font-size:1.1rem !important;white-space:normal !important}
}
.analysis__head .files{flex:1 1 auto;min-width:0}
.file{min-width:0}
.file span{min-width:0}

/* ============================================================
   V1.2 - frise des échéances, rappels, regroupement de crédits
   ============================================================ */
.app-timeline{border-top:1px solid var(--line);padding:20px 16px 26px}
.app-timeline .timeline__title{margin-bottom:26px}
.tl__today{position:absolute;top:22px;height:30px;width:2px;background:var(--ok);border-radius:1px;transform:translateX(-50%)}
.tl__today::after{content:"Aujourd’hui";position:absolute;top:-16px;left:50%;transform:translateX(-50%);font-size:.7rem;font-weight:600;color:var(--ok);white-space:nowrap}
.app-timeline .tl__dot{cursor:help}
.recap .sub.remind,.kv small.remind{color:var(--ok);font-weight:500}
.recap .sub.remind::before,.kv small.remind::before{content:"";display:inline-block;width:8px;height:8px;border-radius:50%;box-shadow:inset 0 0 0 1.5px var(--ok);margin-right:5px;vertical-align:0}
.promo{display:flex;gap:18px;align-items:center;justify-content:space-between;background:#FFFBE0;border:1px solid #F1E3A0;border-radius:var(--r-lg);padding:16px 18px;margin-bottom:16px}
.promo b{display:block;font-size:1.02rem}
.promo p{margin:4px 0 6px;color:var(--ink-2);font-size:.93rem}
.promo .btn{flex:none}
.legal-mention{display:block;font-size:.8rem;color:var(--ink-3);margin-top:8px}
.comparer .legal-mention{text-align:center}
@media (max-width:760px){
  .app-timeline{background:var(--soft);border:1px solid var(--line);border-radius:var(--r-lg);margin-top:6px;padding:16px 14px 22px}
  .app-timeline .tl__lbl.dim{display:none}
  .app-timeline .tl__lbl{font-size:.72rem}
  .app-timeline .tl__months span:nth-child(even){visibility:hidden}
  .promo{flex-direction:column;align-items:flex-start}
}

.recap-wrap{overflow-x:auto}
.recap .act{width:1%}
.recap .act .icon-btn{vertical-align:middle}
.icon-btn--edit:hover{color:var(--ink);background:var(--bg)}
.recap tfoot .sub{white-space:normal}
@media (max-width:760px){.recap-wrap{overflow:visible}}

.recap .when-badge{display:block;margin-top:4px}
.recap .when-badge:empty{display:none}
.recap .c-date .sub.remind{white-space:normal}
.recap .c-link{min-width:200px}
@media (max-width:760px){
  .recap .c-save{grid-column:1 / -1}
  .recap .when-badge{display:inline-block;margin:4px 0 0}
}
@media (min-width:761px){
  .recap th,.recap td{padding-left:8px;padding-right:8px}
  .recap .c-link{min-width:170px}
}

.recap .acts{display:flex;gap:6px;align-items:center;justify-content:flex-end}
.recap .acts form{display:block;margin:0}
.recap .act .btn + .btn{margin-left:0}
@media (max-width:760px){
  .recap .c-act{display:block}
  .recap .acts{justify-content:flex-start;gap:8px}
  .recap .acts form{margin-left:auto}
}
.icon-btn svg{max-width:none;flex:none}
.recap .acts > *{flex:none}
.recap .c-date .sub.remind{white-space:nowrap}
.recap .when-badge:empty{display:none !important}
.legend{flex-wrap:wrap;gap:4px 16px}
.legend > span{white-space:nowrap}
@media (max-width:760px){
  .tl__today::after{display:none}
  .app-timeline .timeline__title{flex-direction:column;gap:6px}
}

/* ============================================================
   V1.2 - relevés de compte / dépenses
   ============================================================ */
.teaser{display:flex;align-items:center;gap:14px;background:var(--surface);border:1px dashed var(--line-strong);border-radius:var(--r-lg);padding:14px 16px;margin-bottom:16px;text-decoration:none;transition:border-color .15s}
.teaser:hover{border-color:var(--ink)}
.teaser > span:nth-child(2){flex:1;min-width:0}
.teaser b{display:block;font-size:.98rem}
.teaser small{display:block;color:var(--ink-2);font-size:.86rem;margin-top:2px}
.teaser__ico{width:42px;height:42px;border-radius:12px;background:var(--marker);display:grid;place-items:center;flex:none}
.teaser .btn{flex:none}

.spend-intro .promise{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:18px}
.spend-intro .promise > div{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);padding:14px 16px}
.spend-intro .promise b{display:block;margin-bottom:4px}
.spend-intro .promise p{margin:0;color:var(--ink-2);font-size:.92rem}
.privacy-note{margin:16px 0 0;padding:12px 14px;background:var(--ok-bg);color:var(--ok);border-radius:var(--r-md);font-size:.9rem}
.privacy-note b{color:var(--ok)}
.privacy-note .link{color:var(--ok);border-bottom-color:var(--ok)}

.spend-section{margin-top:26px}
.spend-section h2{font-size:1.2rem;margin:0 0 8px;display:flex;align-items:center;gap:8px;max-width:none}
.spend-section .count{font-size:.8rem;font-weight:700;background:var(--ink);color:#fff;border-radius:999px;padding:2px 8px}
.spend{list-style:none;margin:0;padding:0;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg)}
.spend__item{display:grid;grid-template-columns:40px 1fr auto auto;gap:12px 14px;align-items:center;padding:14px 16px;border-top:1px solid var(--line)}
.spend__item:first-child{border-top:0}
.spend__item .ico{width:40px;height:40px;border-radius:10px;background:var(--bg);display:grid;place-items:center}
.spend__item .ico--letter{font-weight:800;font-size:1.05rem}
.spend__main b{display:block;font-weight:700}
.spend__main .sub{display:block;color:var(--ink-2);font-size:.85rem}
.spend__main .badge{margin-top:4px}
.spend__tip{margin:4px 0 0;color:var(--ink-2);font-size:.88rem;line-height:1.4}
.spend__amount{text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums}
.spend__amount b{font-size:1.02rem}
.spend__amount small{color:var(--ink-2);font-size:.8rem;margin-left:1px}
.spend__amount .saved{display:flex;align-items:center;justify-content:flex-end;gap:4px;color:var(--ok);font-weight:700;font-size:.82rem;margin-top:2px}
.spend__acts{display:flex;gap:6px;align-items:center;justify-content:flex-end}
.spend__acts form{margin:0}
.chip{font:600 .82rem var(--font);padding:7px 11px;border-radius:999px;border:1px solid var(--line-strong);background:#fff;color:var(--ink-2);cursor:pointer;white-space:nowrap}
.chip:hover{border-color:var(--ink);color:var(--ink)}
.chip.is-on{color:#fff;border-color:transparent}
.chip--keep.is-on{background:var(--ink-2)}
.chip--act.is-on{background:var(--ok)}
.spend__item.is-act .spend__main b{text-decoration:line-through;text-decoration-color:var(--ok);text-decoration-thickness:2px}
.spend__item.is-keep{opacity:.7}
.tips{margin:0;padding:0;list-style:none;display:grid;gap:8px}
.tips li{background:#FFFBE0;border:1px solid #F1E3A0;border-radius:var(--r-md);padding:12px 14px 12px 38px;position:relative;font-size:.95rem}
.tips li::before{content:"";position:absolute;left:14px;top:17px;width:12px;height:4px;background:var(--ink);border-radius:2px}

@media (max-width:760px){
  .spend-intro .promise{grid-template-columns:1fr}
  .spend__item{grid-template-columns:40px 1fr auto}
  .spend__acts{grid-column:1 / -1;justify-content:flex-start;padding-left:54px}
  .teaser{flex-wrap:wrap}
  .teaser .btn{width:100%}
  .tabbar a span{font-size:.66rem}
}
.spend__item{grid-template-columns:40px minmax(0,1fr) auto auto}
.spend__main .badge{white-space:normal}
@media (max-width:760px){
  .spend__item{grid-template-columns:40px minmax(0,1fr) auto}
}
.spend__main .potential{display:block;color:var(--ok);font-weight:600;font-size:.86rem;margin-top:2px}
@media (max-width:760px){
  .spend__item{grid-template-columns:40px minmax(0,1fr);gap:6px 14px;align-items:start}
  .spend__item .ico{grid-row:span 2}
  .spend__amount{grid-column:2;text-align:left;display:flex;align-items:baseline;gap:8px;flex-wrap:wrap}
  .spend__amount .saved{margin-top:0}
  .spend__acts{grid-column:1 / -1;padding-left:54px;margin-top:4px}
}
.spend__acts .btn{white-space:nowrap}

/* ============================================================
   V1.3 - dépenses : dates, étiquettes, aide à la résiliation, offres
   ============================================================ */
.totals--4{grid-template-columns:repeat(4,1fr)}
@media (max-width:900px){.totals--4{grid-template-columns:1fr 1fr}.totals--4 .total:first-child{grid-column:auto}}
.subnav{display:flex;gap:8px;overflow-x:auto;margin:4px 0 6px;padding:4px 0 8px;scrollbar-width:none;position:sticky;top:calc(62px + var(--sat));z-index:10;background:var(--bg)}
.subnav::-webkit-scrollbar{display:none}
.subnav a{flex:none;text-decoration:none;font-weight:600;font-size:.88rem;color:var(--ink-2);background:var(--surface);border:1px solid var(--line);border-radius:999px;padding:7px 12px;white-space:nowrap}
.subnav a:hover{border-color:var(--ink);color:var(--ink)}
.subnav a span{display:inline-block;margin-left:4px;font-size:.75rem;background:var(--bg);border-radius:999px;padding:0 6px}
.subnav a.subnav--alert{color:var(--bad);border-color:var(--bad-bg);background:var(--bad-bg)}
.spend-section{scroll-margin-top:120px}
.spend-section--alert .spend{border-color:#F4C7C3}
.spend__item .ico--alert{background:var(--bad-bg);color:var(--bad);font-weight:800;font-size:1.1rem}
.tags{display:flex;flex-wrap:wrap;gap:4px;margin-top:5px}
.tag{display:inline-block;font-size:.74rem;font-weight:700;padding:2px 8px;border-radius:999px;background:var(--bg);color:var(--ink-2)}
.tag--warn{background:var(--warn-bg);color:var(--warn)}
.tag--bad{background:var(--bad-bg);color:var(--bad)}
.tag--ok{background:var(--ok-bg);color:var(--ok)}
.tag--info{background:#EEF1FA;color:#2A3A6B}
.dates{display:block;font-size:.82rem;color:var(--ink-2);margin-top:5px}
.dates--none{color:var(--ink-3);font-style:italic}
.dates--bad{color:var(--bad);font-weight:600}
.cheaper{margin:5px 0 0;font-size:.88rem;color:var(--ok)}
.cheaper small{color:var(--ink-3);font-weight:400}
.spend__amount .saved--todo{color:var(--warn)}
.spend__item.is-done{background:var(--ok-bg)}
.spend__item.is-done .spend__main b{text-decoration:line-through;text-decoration-color:var(--ok);text-decoration-thickness:2px}
.chip--done.is-on{background:var(--ok)}
.chip--act.is-on{background:var(--warn)}
.spend__item.is-act{background:#FFFCF4}

.howto{grid-column:1 / -1;border:1px solid var(--line);border-radius:var(--r-md);background:var(--surface);margin-top:4px}
.howto > summary{cursor:pointer;list-style:none;font-weight:700;padding:11px 14px;font-size:.95rem}
.howto > summary::-webkit-details-marker{display:none}
.howto > summary::before{content:"→";margin-right:8px;color:var(--ok)}
.howto[open] > summary{border-bottom:1px solid var(--line)}
.howto__body{padding:12px 14px 14px;font-size:.92rem;color:var(--ink-2)}
.howto__body p{margin:0 0 8px}
.howto__body b{color:var(--ink)}
.howto__channel{display:inline-block;font-size:.78rem;font-weight:700;background:var(--ink);color:#fff;border-radius:999px;padding:3px 10px;margin-bottom:8px}
.howto__law{font-size:.84rem;background:var(--bg);border-radius:8px;padding:8px 10px}
.howto__steps{margin:0 0 10px;padding-left:20px;display:grid;gap:6px}
.howto__done{margin-top:12px}
.letter{margin-top:8px;border-top:1px dashed var(--line);padding-top:8px}
.letter > summary{cursor:pointer;font-weight:600;color:var(--ink);font-size:.9rem}
.letter textarea{margin-top:8px;font-family:ui-monospace,Menlo,Consolas,monospace;font-size:.8rem;line-height:1.45;min-height:260px;background:var(--soft)}
.letter__acts{display:flex;gap:8px;margin-top:8px;flex-wrap:wrap}

.offer{background:linear-gradient(135deg,#EEF1FA,#F8F9FF);border:1px solid #CBD3F0;border-radius:var(--r-lg);padding:16px 18px;margin:0 0 12px}
.offer--compact{margin:10px 0 4px;padding:12px 14px}
.offer__top{display:flex;align-items:center;gap:12px}
.offer__top > div{flex:1;min-width:0}
.offer__top b{display:block;color:var(--ink);font-size:1rem}
.offer__top small{display:block;color:var(--ink-2);font-size:.84rem}
.offer__logo{width:40px;height:40px;border-radius:12px;background:#111B33;color:#fff;display:grid;place-items:center;font-weight:800;font-size:1.1rem;flex:none}
.offer__bonus{flex:none;text-align:center;background:var(--ok);color:#fff;border-radius:12px;padding:6px 10px;font-weight:800;font-size:1.05rem;line-height:1.1}
.offer__bonus small{display:block;font-size:.66rem;font-weight:600;opacity:.9}
.offer__gain{margin:10px 0 12px;color:var(--ink);font-size:.95rem}
.offer .legal-mention{margin-top:8px}
@media (max-width:760px){
  .howto{margin-left:-54px}
  .spend__item .howto{grid-column:1 / -1;margin-left:0}
  .offer__top{flex-wrap:wrap}
}
@media (max-width:760px){ .spend__acts{flex-wrap:wrap} }
/* barré uniquement quand c'est vraiment fait, et seulement le nom */
.spend__item.is-act .spend__main b{text-decoration:none}
.spend__item.is-done .spend__main b{text-decoration:none}
.spend__item.is-done .spend__main > b:first-child{text-decoration:line-through;text-decoration-color:var(--ok);text-decoration-thickness:2px}
.offer__top .offer__bonus small{color:#fff;opacity:.95}

/* ============================================================
   V1.4 - logo, plan d'économies, parcours « relevé d'abord »
   ============================================================ */
.logo i{display:none}
.logo .logo__sym{flex:none;display:block}
.badge-count{display:inline-grid;place-items:center;min-width:18px;height:18px;padding:0 5px;margin-left:6px;border-radius:999px;background:var(--bad);color:#fff;font-size:.7rem;font-weight:700;vertical-align:1px}
.tabbar a{position:relative}
.tab-dot{position:absolute;top:0;left:calc(50% + 6px);min-width:16px;height:16px;padding:0 4px;border-radius:999px;background:var(--bad);color:#fff;font-size:.62rem;font-style:normal;font-weight:700;display:grid;place-items:center}
.eyebrow{margin:0 0 6px;font-weight:600;color:var(--ink-2)}
.link-sm{background:none;border:0;padding:0;font:600 .8rem var(--font);color:var(--ink-3);cursor:pointer}
.link-sm:hover{color:var(--ink);text-decoration:underline}

/* Accueil : premiers pas */
.onboard h1{font-size:clamp(1.8rem,5vw,2.4rem);letter-spacing:-.025em;line-height:1.08;font-weight:800;margin-bottom:10px}
.onboard__lead{color:var(--ink-2);font-size:1.05rem;margin:0 0 20px}
.stepper{list-style:none;margin:0 0 20px;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.stepper li{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-md);padding:10px 12px}
.stepper li b{display:block;font-size:.92rem}
.stepper li span{font-size:.8rem;color:var(--ink-3)}
.stepper li.is-on{border-color:var(--ink);box-shadow:inset 0 0 0 1px var(--ink);background:#FFFBE0}
.howget{margin:14px 0 0;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-md);padding:10px 14px}
.howget summary{cursor:pointer;font-weight:600}
.howget ul{margin:10px 0 2px;padding-left:18px;color:var(--ink-2);font-size:.93rem;display:grid;gap:6px}

/* Accueil : plan d'économies */
.plan-head{margin:6px 0 16px;scroll-margin-top:90px}
.plan-head h1{font-size:clamp(1.7rem,4.6vw,2.2rem);letter-spacing:-.025em;line-height:1.1;font-weight:800}
.plan-sum{font-size:1.15rem;margin:8px 0 0;color:var(--ink)}
.plan-done{margin:6px 0 0;color:var(--ok)}
.plan{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.task{display:grid;grid-template-columns:44px minmax(0,1fr) auto;gap:14px;align-items:center;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);padding:16px}
.task .ico{width:44px;height:44px;border-radius:12px;background:var(--bg);display:grid;place-items:center}
.task .ico--letter{font-weight:800;font-size:1.1rem}
.task .ico--alert{background:var(--bad-bg);color:var(--bad);font-weight:800;font-size:1.2rem}
.ico--releve{background:var(--marker) !important;color:var(--ink)}
.task--top{border-color:var(--ink);box-shadow:0 14px 30px -18px rgba(17,27,51,.45)}
.task--security{border-color:#F4C7C3}
.task__flag{display:inline-block;font-size:.72rem;font-weight:800;text-transform:uppercase;letter-spacing:.04em;background:var(--marker);color:var(--ink);border-radius:6px;padding:2px 7px;margin-bottom:6px}
.task__main b{display:block;font-size:1.02rem;line-height:1.3}
.task__main p{margin:3px 0 0;color:var(--ink-2);font-size:.9rem;line-height:1.4}
.task__meta{display:flex;gap:6px;flex-wrap:wrap;margin-top:7px}
.task__time,.task__tag{font-size:.74rem;font-weight:700;border-radius:999px;padding:2px 8px;background:var(--bg);color:var(--ink-2)}
.task__tag--security{background:var(--bad-bg);color:var(--bad)}
.task__tag--save{background:var(--ok-bg);color:var(--ok)}
.task__tag--start{background:#FFFBE0;color:var(--warn)}
.task__side{display:flex;flex-direction:column;align-items:flex-end;gap:6px;text-align:right}
.task__gain{font-weight:800;color:var(--ok);font-size:1.02rem;white-space:nowrap}
.task__bonus{font-size:.78rem;font-weight:700;color:#fff;background:var(--ok);border-radius:999px;padding:2px 8px}
.task__links{display:flex;gap:12px}
.task__links form{margin:0}
.overview{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:26px 0 16px}
.ov{display:block;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);padding:14px 16px;text-decoration:none}
.ov:hover{border-color:var(--ink)}
.ov small{display:block;color:var(--ink-3);font-size:.8rem;font-weight:600;text-transform:uppercase;letter-spacing:.04em}
.ov b{display:block;margin-top:4px}
.ov span{display:block;color:var(--ink-2);font-size:.88rem;margin-top:2px}
.timeline--card{background:var(--soft);border:1px solid var(--line);border-radius:var(--r-lg)}
.choices{display:grid;gap:12px}
.choice{display:flex;gap:14px;align-items:flex-start;background:var(--surface);border:1.5px solid var(--line);border-radius:var(--r-lg);padding:18px;text-decoration:none}
.choice:hover{border-color:var(--ink)}
.choice .ico{width:48px;height:48px;border-radius:12px;background:var(--bg);display:grid;place-items:center;flex:none}
.choice b{display:block;font-size:1.05rem}
.choice small{display:block;color:var(--ink-2);font-size:.92rem;margin-top:3px}
.choice--main{border-color:var(--ink);background:#FFFDF2}

/* Landing */
.hero__proofs{list-style:none;margin:16px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:8px 18px;font-weight:600;font-size:.95rem}
.hero__proofs li{display:flex;align-items:center;gap:6px}
.hero__proofs li::before{content:"";width:16px;height:16px;border-radius:50%;background:var(--ok-bg) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231F6A3F' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 12l4 4 8-8'/%3E%3C/svg%3E") center/11px no-repeat}
.plan-demo{background:var(--bg);border:1px solid var(--line);border-radius:var(--r-xl);padding:22px;box-shadow:0 30px 60px -30px rgba(17,27,51,.3)}
.plan-demo__head{display:flex;justify-content:space-between;align-items:flex-end;gap:12px;margin-bottom:14px}
.plan-demo__head small{display:block;color:var(--ink-2)}
.plan-demo__head strong{display:block;font-size:clamp(1.25rem,2.6vw,1.7rem);letter-spacing:-.02em;line-height:1.2}
.plan-demo__count{font-size:.85rem;font-weight:700;background:var(--ink);color:#fff;border-radius:999px;padding:4px 10px;white-space:nowrap}
.plan--demo .task{pointer-events:none}
.gain--3{grid-template-columns:repeat(3,1fr)}
@media (max-width:1000px){.gain--3{grid-template-columns:1fr}}
@media (max-width:640px){
  .stepper{grid-template-columns:1fr}
  .task{grid-template-columns:40px minmax(0,1fr);align-items:start}
  .task .ico{width:40px;height:40px}
  .task__side{grid-column:1 / -1;flex-direction:row;flex-wrap:wrap;align-items:center;justify-content:flex-start;text-align:left;padding-left:54px}
  .task__links{width:100%}
  .overview{grid-template-columns:1fr}
  .plan-demo{padding:14px}
  .plan-demo__head{flex-direction:column;align-items:flex-start}
}

/* ============================================================
   V1.5 - contrat actuel, plan numéroté
   ============================================================ */
.current{background:var(--surface);border:1.5px solid var(--ink);border-radius:var(--r-lg);padding:14px 16px;margin:0 0 14px}
.current__head small{display:block;font-size:.75rem;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--ink-3)}
.current__head b{display:block;font-size:1.1rem}
.current__kv{display:flex;flex-wrap:wrap;gap:6px 16px;align-items:center;margin-top:6px;font-size:.95rem;color:var(--ink-2)}
.current__kv b{color:var(--ink)}
.current__save{color:var(--ok);font-weight:700}
.current__points{margin:8px 0 0;font-size:.9rem;color:var(--ink-2)}
.current__points b{color:var(--ink)}
.current__tip{margin:8px 0 0;font-size:.85rem;color:var(--ink-3)}
.plan-order{margin:6px 0 0;color:var(--ink-2);font-size:.95rem}
.task__icon{position:relative;display:block;width:44px;height:44px}
.task__icon .ico{width:44px;height:44px}
.task__num{position:absolute;top:-7px;left:-7px;min-width:20px;height:20px;padding:0 5px;border-radius:999px;background:var(--ink);color:#fff;font-size:.72rem;font-style:normal;font-weight:800;display:grid;place-items:center;border:2px solid var(--bg)}
@media (max-width:640px){.task__icon,.task__icon .ico{width:40px;height:40px}}

/* ---------- Dépenses : résumé visuel, onglets, lignes repliables ---------- */
.so{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);gap:12px;margin-bottom:18px}
.so__main,.so__stat{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);padding:16px 18px}
.so__main small,.so__stat small{display:block;color:var(--ink-2);font-size:.85rem}
.so__main strong{display:block;font-size:2rem;font-weight:800;letter-spacing:-.03em;line-height:1.15;margin:2px 0 12px}
.so__main strong em,.so__stat strong em{font-style:normal;font-size:.5em;font-weight:600;color:var(--ink-2);margin-left:3px}
.stackbar{display:flex;height:14px;border-radius:999px;overflow:hidden;background:var(--bg);gap:2px}
.sb{display:block;height:100%}
.sb--c,.sw--c{background:var(--ink)}
.sb--a,.sw--a{background:#E3B505}
.sb--f,.sw--f{background:#C2412D}
.sb-legend{list-style:none;margin:10px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:6px 18px;font-size:.88rem;color:var(--ink-2)}
.sb-legend li{display:flex;align-items:center;gap:6px}
.sb-legend b{color:var(--ink)}
.sw{display:inline-block;width:10px;height:10px;border-radius:3px}
.so__side{display:grid;gap:12px}
.so__stat strong{display:block;font-size:1.5rem;font-weight:800;letter-spacing:-.02em;line-height:1.2}
.so__stat span{display:block;font-size:.82rem;color:var(--ink-2);margin-top:2px}
.so__stat--ok{background:var(--ok-bg);border-color:transparent}
.so__stat--ok strong{color:var(--ok)}
.progress-line{display:block;height:6px;border-radius:999px;background:var(--bg);overflow:hidden;margin:6px 0 4px}
.progress-line i{display:block;height:100%;background:var(--ok);border-radius:999px}
.seg{display:flex;gap:4px;padding:4px;background:var(--surface);border:1px solid var(--line);border-radius:999px;overflow-x:auto;scrollbar-width:none;margin-bottom:14px;position:sticky;top:calc(62px + var(--sat));z-index:10}
.seg::-webkit-scrollbar{display:none}
.seg a{flex:1 0 auto;text-align:center;text-decoration:none;font-weight:600;font-size:.9rem;color:var(--ink-2);padding:8px 14px;border-radius:999px;white-space:nowrap}
.seg a span{display:inline-block;margin-left:6px;font-size:.75rem;background:var(--bg);color:var(--ink-2);border-radius:999px;padding:0 7px}
.seg a.is-on{background:var(--ink);color:#fff}
.seg a.is-on span{background:rgba(255,255,255,.18);color:#fff}
.seg a.seg--alert:not(.is-on){color:var(--bad)}
.seg a.seg--alert span{background:var(--bad);color:#fff}
.pane-tab{scroll-margin-top:130px}
.pane-intro{margin:0 0 10px;color:var(--ink-2);font-size:.93rem}
.rows{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden}
.row{border-top:1px solid var(--line);scroll-margin-top:130px}
.row:first-child{border-top:0}
.row__sum{display:grid;grid-template-columns:40px minmax(0,1fr) auto auto 18px;gap:12px;align-items:center;padding:12px 16px;cursor:pointer;list-style:none}
.row__sum::-webkit-details-marker{display:none}
.row__sum:hover{background:var(--soft)}
.row .ico{width:40px;height:40px;border-radius:10px;background:var(--bg);display:grid;place-items:center}
.row .ico--letter{font-weight:800}
.row .ico--alert{background:var(--bad-bg);color:var(--bad);font-weight:800}
.row__name b{display:block;font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.row__name small{display:block;color:var(--ink-3);font-size:.82rem}
.row__tags{display:flex;gap:4px;flex-wrap:wrap;justify-content:flex-end}
.row__amount{font-weight:700;white-space:nowrap;text-align:right;font-variant-numeric:tabular-nums}
.row__amount small{font-weight:500;color:var(--ink-3);font-size:.78rem}
.row__chev{width:10px;height:10px;border-right:2px solid var(--ink-3);border-bottom:2px solid var(--ink-3);transform:rotate(45deg);margin-top:-4px;transition:transform .15s}
.row[open] > .row__sum .row__chev{transform:rotate(225deg);margin-top:4px}
.row[open] > .row__sum{background:var(--soft)}
.row__body{padding:4px 16px 16px 68px;font-size:.92rem}
.row__tip{margin:6px 0 0;color:var(--ink-2)}
.row__acts{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin-top:12px}
.row__acts form{margin:0}
.row__acts .saved{display:flex;align-items:center;gap:6px;color:var(--ok);font-weight:700;margin-right:8px}
.row--done .row__name b{text-decoration:line-through;text-decoration-color:var(--ok);text-decoration-thickness:2px}
.row--keep{opacity:.72}
.row .howto{margin-top:12px}
.quiet{margin-top:12px}
.quiet > summary{cursor:pointer;font-weight:600;color:var(--ink-2);padding:8px 2px;list-style:none}
.quiet > summary::-webkit-details-marker{display:none}
.quiet > summary::before{content:"+";display:inline-block;width:18px;font-weight:800}
.quiet[open] > summary::before{content:"–"}
.releves > summary{cursor:pointer;font-weight:700}
@media (max-width:760px){
  .so{grid-template-columns:1fr}
  .so__side{grid-template-columns:1fr 1fr}
  .row__sum{grid-template-columns:40px minmax(0,1fr) auto 14px;gap:10px;padding:12px}
  .row__tags{grid-column:2 / 4;grid-row:2;justify-content:flex-start}
  .row__chev{grid-column:4;grid-row:1}
  .row__body{padding:4px 12px 14px 12px}
  .seg{border-radius:14px}
}


/* ============================================================
   Typographie Manrope (sept. 2026) : titres plus fins et plus petits
   ============================================================ */
body{font-size:16px}
h1,h2,h3,.hero h1,.page h1,.page-head h1,.chead h1,.onboard h1,.plan-head h1{font-weight:700;letter-spacing:-.02em;font-variation-settings:normal}
.hero h1{font-size:clamp(1.95rem,3.9vw,3.12rem);line-height:1.14}
.page h1{font-size:clamp(1.56rem,3.12vw,2.18rem)}
.page-head h1{font-size:clamp(1.25rem,3.12vw,1.64rem)}
.onboard h1{font-size:clamp(1.4rem,3.9vw,1.87rem);line-height:1.15}
.plan-head h1{font-size:clamp(1.33rem,3.59vw,1.72rem)}
.chead h1{font-size:1.17rem}
h2{font-size:clamp(1.4rem,2.5vw,1.95rem)}
.dash__total strong,.split b,.gain strong,.total strong,.stats b,.so__main strong,.so__stat strong,.step::before,.task__gain{font-weight:700;letter-spacing:-.01em}
/* le logo garde sa police (Bricolage, chargée uniquement pour les lettres « Épluche ») */
.logo{font-family:"Bricolage Grotesque",var(--font);font-weight:800;letter-spacing:-.02em}

/* ============================================================
   V1.8 - Pages d'accueil (A/B test) : versions 1 à 5
   ============================================================ */
.hcta{display:grid;gap:10px;max-width:420px}
.hcta .btn--social{width:100%}
.hcta .or{margin:6px 0}
.hcta--compact{display:flex;flex-wrap:wrap;gap:10px;max-width:none}
.hcta--compact .btn{padding:15px 22px}
.hcta__g svg{width:18px;height:18px}
.preview-bar{position:fixed;left:12px;bottom:calc(12px + env(safe-area-inset-bottom,0px));z-index:200;display:flex;flex-wrap:wrap;align-items:center;gap:4px;max-width:calc(100vw - 24px);background:#111B33;color:#fff;border-radius:14px;padding:6px 8px;box-shadow:0 10px 30px rgba(17,27,51,.35);font:600 12px/1.2 system-ui,sans-serif}
.preview-bar b{padding:0 6px 0 4px;color:#FFE45C}
.preview-bar a{color:#C9CEDA;text-decoration:none;padding:5px 8px;border-radius:8px;white-space:nowrap}
.preview-bar a:hover{color:#fff;background:rgba(255,255,255,.1)}
.preview-bar a.on{background:#FFE45C;color:#111B33}
.preview-bar__x{font-size:15px;line-height:1}


/* ============================================================
   V1.9 - Admin : landings et A/B test
   ============================================================ */
.ab-settings{margin-bottom:16px}
.ab-switch{display:flex;gap:12px;align-items:flex-start;cursor:pointer}
.ab-switch input{width:20px;height:20px;margin-top:2px;accent-color:var(--ok)}
.ab-switch b{display:block}
.ab-switch small{display:block;color:var(--ink-2)}
.ab-help{background:var(--soft);border:1px solid var(--line);border-radius:var(--r-md);padding:12px 14px;font-size:.9rem;color:var(--ink-2);margin-bottom:16px}
.ab-help code{background:#fff;border:1px solid var(--line);border-radius:6px;padding:1px 6px;font-size:.85rem;word-break:break-all}
.ab-filters{display:flex;flex-wrap:wrap;gap:10px;align-items:flex-end;margin-bottom:16px}
.ab-filters label{display:grid;gap:4px;font-size:.8rem;font-weight:600;color:var(--ink-2)}
.ab-filters .input{padding:8px 10px;width:auto;min-width:170px}
.ab-verdicts{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:16px}
.ab-verdict{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);padding:14px 16px}
.ab-verdict small{display:block;color:var(--ink-2);font-weight:600}
.ab-verdict b{display:block;font-size:1.15rem;margin-top:2px}
.ab-verdict span{display:block;color:var(--ink-2);font-size:.9rem}
.ab-verdict p{margin:8px 0 0;font-size:.85rem;color:var(--ink-3)}
.ab-verdict--win{border-color:var(--ok);background:var(--ok-bg)}
.ab-verdict--win p{color:var(--ok);font-weight:600}
.ab-verdict--trend{border-color:#F1E3A0;background:#FFFBE0}
.ab-table .num,.adm .num{text-align:right;font-variant-numeric:tabular-nums}
.ab-table tr.is-lead td{background:var(--ok-bg)}
.ab-table tr.is-off td{opacity:.55}
.abbar{display:inline-block;width:90px;height:8px;border-radius:999px;background:var(--bg);overflow:hidden;vertical-align:middle;margin-right:8px}
.abbar i{display:block;height:100%;background:var(--ok);border-radius:999px}
@media (max-width:760px){.ab-verdicts{grid-template-columns:1fr}}

/* ============================================================
   V2.0 - rappels clairs, « comment économiser », envoi multi-photos
   ============================================================ */
.recap .sub.remind::before,.kv small.remind::before{display:none}
.recap .sub.remind svg{vertical-align:-1px;margin-right:4px}
.remind-row{display:flex;gap:12px;align-items:flex-start;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);padding:12px 14px;margin:0 0 14px;scroll-margin-top:90px}
.remind-row__ico{width:36px;height:36px;border-radius:10px;background:var(--ok-bg);color:var(--ok);display:grid;place-items:center;flex:none}
.remind-row p{margin:6px 0 0;font-size:.93rem;color:var(--ink-2)}
.remind-row p b{color:var(--ink)}
.remind-row__form{flex:1;margin:0}
.switch{display:flex;gap:12px;align-items:center;cursor:pointer;min-height:40px}
.switch input{position:absolute;opacity:0;width:1px;height:1px}
.switch__ui{flex:none;width:46px;height:28px;border-radius:999px;background:var(--line-strong);position:relative;transition:background .2s}
.switch__ui::after{content:"";position:absolute;top:3px;left:3px;width:22px;height:22px;border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.25);transition:transform .2s}
.switch input:checked + .switch__ui{background:var(--ok)}
.switch input:checked + .switch__ui::after{transform:translateX(18px)}
.switch input:focus-visible + .switch__ui{outline:3px solid var(--marker);outline-offset:2px}
.switch__txt b{display:block;font-size:.95rem}
.switch__txt small{display:block;color:var(--ink-2);font-size:.85rem}
.how-link{display:inline-block;margin-top:4px;font-size:.85rem;font-weight:700;color:var(--ok)}
.howsave{background:var(--ok-bg);border:1px solid #BFE0CB;border-radius:var(--r-lg);padding:16px 18px;margin:0 0 16px;scroll-margin-top:90px}
.howsave h2{font-size:1.1rem;margin:0 0 10px;max-width:none;color:var(--ink)}
.howsave ol{margin:0 0 14px;padding-left:22px;display:grid;gap:8px;color:var(--ink-2)}
.howsave ol b{color:var(--ink)}
.howsave__note{margin:10px 0 0;font-size:.8rem;color:var(--ink-3)}
.picker{cursor:default}
.picker__btns{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin-top:14px}
.picker__btn{position:relative;gap:8px}
.picker .picker__btn input{display:block;position:absolute;width:1px;height:1px;opacity:0;overflow:hidden;clip:rect(0 0 0 0);pointer-events:none}
.picker__tip{margin:12px 0 0 !important;font-size:.82rem !important;color:var(--ink-3) !important}
@media (min-width:900px) and (hover:hover) and (pointer:fine){.picker__btn--camera{display:none}}
@media (max-width:560px){.picker__btns{flex-direction:column}.picker__btn{width:100%}}
.so__insight{margin:12px 0 0;padding:9px 12px;background:#FFFBE0;border-radius:var(--r-md);font-size:.88rem;color:var(--ink-2)}
.so__insight b{color:var(--ink)}
.rate{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);padding:14px 16px;margin:18px 0 0;display:grid;gap:10px;scroll-margin-top:90px}
.rate__stars{display:inline-flex;flex-direction:row-reverse;justify-content:flex-end;gap:4px}
.rate__stars input{position:absolute;opacity:0;width:1px;height:1px}
.rate__stars label{font-size:2rem;line-height:1;color:var(--line-strong);cursor:pointer;padding:2px}
.rate__stars label:hover,.rate__stars label:hover ~ label,.rate__stars input:checked ~ label{color:#E3B505}
.rate__stars input:focus-visible + label{outline:3px solid var(--marker);border-radius:6px}
.rate .btn{justify-self:start}

/* v6 - Reprenez la main */
.hv6{padding:40px 0 72px}
.hv6__hero{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:40px;align-items:center}
.hv6__pill{display:inline-block;margin:0 0 14px;font-size:.82rem;font-weight:700;color:var(--ok);background:var(--ok-bg);border-radius:999px;padding:5px 12px}
.hv6 h1{font-size:clamp(2.1rem,5.2vw,3.5rem);line-height:1.06;letter-spacing:-.03em;font-weight:700;margin:0 0 16px}
.hv6__lead{font-size:clamp(1.02rem,2vw,1.18rem);color:var(--ink-2);margin:0 0 24px;max-width:40ch}
.hv6__lead b{color:var(--ink)}
.hv6__trust{margin:16px 0 0;font-size:.9rem;color:var(--ink-3)}
.hv6__proofs{list-style:none;margin:20px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:10px}
.hv6__proofs li{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-md);padding:8px 12px}
.hv6__proofs b{display:block;font-size:.98rem}
.hv6__proofs span{display:block;font-size:.8rem;color:var(--ink-3)}
.hv6__phone{display:flex;justify-content:center}
.phone{width:280px;border-radius:38px;background:#111B33;padding:12px;box-shadow:0 40px 80px -30px rgba(17,27,51,.55);position:relative;transform:rotate(2deg)}
.phone__notch{position:absolute;top:12px;left:50%;transform:translateX(-50%);width:90px;height:20px;border-radius:0 0 14px 14px;background:#111B33;z-index:2}
.phone__screen{background:var(--bg);border-radius:28px;padding:34px 14px 18px;min-height:470px}
.phone__screen small{display:block;font-size:.72rem;color:var(--ink-3);font-weight:600}
.phone__screen strong{display:block;font-size:1.3rem;line-height:1.2;letter-spacing:-.02em;margin:2px 0 14px}
.phone__screen mark{background:var(--marker);padding:0 4px;border-radius:4px}
.phone__screen ol{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.phone__screen li{display:flex;gap:10px;align-items:center;background:#fff;border:1px solid var(--line);border-radius:14px;padding:10px}
.phone__screen li i{flex:none;width:32px;height:32px;border-radius:9px;background:var(--bg);display:grid;place-items:center;font-style:normal;font-weight:800;font-size:.9rem}
.phone__screen li i svg{width:18px;height:18px}
.phone__screen li.is-alert i{background:var(--bad-bg);color:var(--bad)}
.phone__screen li span{min-width:0}
.phone__screen li b{display:block;font-size:.82rem;line-height:1.25}
.phone__screen li em{display:block;font-style:normal;font-size:.78rem;font-weight:700;color:var(--ok)}
.phone__screen li.is-alert em{color:var(--bad)}
.hv6__three{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:64px}
.hv6__three > div{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);padding:20px}
.hv6__three h2{font-size:1.15rem;margin:12px 0 6px;max-width:none;letter-spacing:-.01em}
.hv6__three p{margin:0;color:var(--ink-2);font-size:.95rem}
.hv6__ico{width:46px;height:46px;border-radius:13px;background:var(--ok-bg);color:var(--ok);display:grid;place-items:center}
.hv6__ico--alert{background:var(--bad-bg);color:var(--bad)}
.hv6__ico--ink{background:var(--marker);color:var(--ink)}
.hv6__steps{list-style:none;counter-reset:s6;display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:14px;padding:0 20px}
.hv6__steps li{counter-increment:s6;display:flex;gap:12px;align-items:center;padding:12px 4px}
.hv6__steps li::before{content:counter(s6);flex:none;width:34px;height:34px;border-radius:50%;background:var(--ink);color:#fff;font-weight:800;display:grid;place-items:center}
.hv6__steps b{display:block}
.hv6__steps span{display:block;font-size:.85rem;color:var(--ink-3)}
.hv6__band{margin-top:28px;background:#111B33;color:#C9CEDA;border-radius:var(--r-xl);padding:22px 24px;display:grid;gap:8px}
.hv6__band p{margin:0;font-size:.95rem}
.hv6__band b{color:#fff}
.hv6__final{margin-top:56px;text-align:center;display:flex;flex-direction:column;align-items:center;gap:16px}
.hv6__final h2{margin:0;max-width:22ch}
.hv6__final .hcta--compact{justify-content:center}
@media (max-width:900px){
  .hv6{padding-top:28px}
  .hv6__hero{grid-template-columns:1fr;gap:28px}
  .hv6__three,.hv6__steps{grid-template-columns:1fr}
  .hv6__three{margin-top:40px}
  .phone{transform:none;width:260px}
  .phone__screen{min-height:0}
}
@media (max-width:560px){.hv6 .hcta--compact .btn{width:100%}}
.hv6__steps li{display:grid;grid-template-columns:34px 1fr;column-gap:12px;align-items:center}
.hv6__steps li::before{grid-row:span 2}

/* ============================================================
   V2.1 - Illustration « araignée » : tout part du relevé
   ============================================================ */
.spider{margin-top:64px;text-align:center}
.spider__title{margin:0 auto 6px;max-width:none;font-size:clamp(1.5rem,3.4vw,2.1rem);letter-spacing:-.02em}
.spider__sub{margin:0 0 28px;color:var(--ink-2)}
.spider__map{position:relative;display:grid;grid-template-columns:1fr minmax(210px,.72fr) 1fr;grid-template-rows:repeat(3,auto);column-gap:72px;row-gap:22px;align-items:center;text-align:left}
.spider__lines{position:absolute;inset:0;width:100%;height:100%;z-index:0;overflow:visible}
.spider__lines path{fill:none;stroke:#9AA3B8;stroke-width:2;stroke-dasharray:5 7;animation:spiderFlow 1.1s linear infinite}
@keyframes spiderFlow{from{stroke-dashoffset:12}to{stroke-dashoffset:0}}
.spider__center{grid-column:2;grid-row:1 / 4;position:relative;z-index:1;background:#111B33;color:#fff;border-radius:22px;padding:22px 18px;text-align:center;box-shadow:0 24px 50px -24px rgba(17,27,51,.6)}
.spider__center b{display:block;font-size:1.1rem;line-height:1.25}
.spider__center small{display:block;color:#C9CEDA;font-size:.8rem;margin-top:4px}
.spider__doc{width:56px;height:56px;border-radius:16px;background:var(--marker);color:#111B33;display:grid;place-items:center;margin:0 auto 12px}
.spider__doc svg{width:28px;height:28px}
.spider__node{position:relative;z-index:1;display:flex;gap:12px;align-items:flex-start;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);padding:14px;transition:opacity .5s ease,transform .5s ease;transition-delay:var(--d,0ms)}
.spider__node b{display:block;font-size:.98rem;line-height:1.25}
.spider__node small{display:block;color:var(--ink-2);font-size:.84rem;line-height:1.35;margin-top:3px}
.spider__node--1{grid-column:1;grid-row:1}.spider__node--2{grid-column:1;grid-row:2}.spider__node--3{grid-column:1;grid-row:3}
.spider__node--4{grid-column:3;grid-row:1}.spider__node--5{grid-column:3;grid-row:2}.spider__node--6{grid-column:3;grid-row:3}
.spider__ico{flex:none;width:40px;height:40px;border-radius:12px;display:grid;place-items:center;background:var(--ok-bg);color:var(--ok)}
.spider__ico--bad{background:var(--bad-bg);color:var(--bad)}
.spider__ico--ink{background:var(--marker);color:var(--ink)}
.spider__end{margin:26px 0 0;font-size:1rem;color:var(--ink-2)}
.spider__end b{color:var(--ink)}
.spider__end span{color:var(--ok);font-weight:800;margin-right:4px}
/* apparition : les bulles sortent du relevé l'une après l'autre (seulement si le script tourne) */
.spider--anim .spider__node{opacity:0;transform:scale(.94)}
.spider--anim .spider__node--1,.spider--anim .spider__node--2,.spider--anim .spider__node--3{transform:translateX(24px) scale(.94)}
.spider--anim .spider__node--4,.spider--anim .spider__node--5,.spider--anim .spider__node--6{transform:translateX(-24px) scale(.94)}
.spider--anim.is-in .spider__node{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.spider__lines path{animation:none}}
/* mobile : arbre vertical, le relevé en haut */
@media (max-width:820px){
  .spider{margin-top:44px}
  .spider__map{grid-template-columns:1fr;grid-template-rows:none;row-gap:12px;padding-left:18px}
  .spider__lines{display:none}
  .spider__center{grid-column:1;grid-row:auto;margin-left:-18px;margin-bottom:6px}
  .spider__node{grid-column:1 !important;grid-row:auto !important}
  .spider__map::before{content:"";position:absolute;left:6px;top:60px;bottom:30px;width:2px;background:repeating-linear-gradient(to bottom,#9AA3B8 0 5px,transparent 5px 12px)}
  .spider__node::before{content:"";position:absolute;left:-12px;top:30px;width:12px;height:2px;background:#9AA3B8}
  .spider--anim .spider__node{transform:translateY(14px)}
}

/* ============================================================
   V2.3 - paiements groupés par destinataire
   ============================================================ */
.ops{list-style:none;margin:6px 0 0;padding:0;border:1px solid var(--line);border-radius:var(--r-md);overflow:hidden}
.ops li{display:grid;grid-template-columns:70px minmax(0,1fr) auto;gap:10px;padding:8px 12px;border-top:1px solid var(--line);font-size:.86rem;align-items:center}
.ops li:first-child{border-top:0}
.ops li span:first-child{color:var(--ink-3)}
.ops li span:nth-child(2){overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-family:ui-monospace,Menlo,Consolas,monospace;font-size:.8rem}
.ops li b{font-variant-numeric:tabular-nums}
.spider--anim .spider__node--l{transform:translateX(24px) scale(.94)}
.spider--anim .spider__node--r{transform:translateX(-24px) scale(.94)}
.spider--anim.is-in .spider__node--l,.spider--anim.is-in .spider__node--r{transform:none}
@media (max-width:820px){.spider--anim .spider__node--l,.spider--anim .spider__node--r{transform:translateY(14px)}.spider--anim.is-in .spider__node--l,.spider--anim.is-in .spider__node--r{transform:none}}
.intro-card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-xl);padding:4px 22px 22px;margin:0 0 20px}
.intro-card .spider{margin-top:18px}
.intro-card .spider__title{font-size:1.3rem}
.intro-card .spider__sub{margin-bottom:18px}
.intro-card .spider__map{column-gap:48px}
.intro-card__ok{display:flex;justify-content:center;margin:18px 0 0}

/* ---------- Meilleures offres ---------- */
.topbar__me{display:none;margin-left:auto;width:40px;height:40px;border-radius:50%;background:var(--surface);border:1px solid var(--line);color:var(--ink);place-items:center}
@media (max-width:760px){.topbar__me{display:grid}}
.offers-sec{margin-top:22px}
.offers-sec__head{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:6px 16px;margin-bottom:10px}
.offers-sec__head h2{font-size:1.15rem;margin:0;max-width:none}
.offers-total{color:var(--ok);font-size:.95rem}
.offers-total b{font-size:1.05rem}
.offers{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.offer-card{display:grid;grid-template-columns:42px minmax(0,1fr);gap:6px 12px;align-items:start;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);padding:14px}
.offer-card .ico{width:42px;height:42px;border-radius:12px;background:var(--bg);display:grid;place-items:center;grid-row:span 2}
.offer-card__main b{display:block;font-size:1rem}
.offer-card__main small{display:block;color:var(--ink-2);font-size:.86rem;line-height:1.4;margin-top:2px}
.offer-card__save{display:inline-block;margin-top:6px;font-weight:800;color:var(--ok)}
.offer-card .btn{grid-column:2;justify-self:start;margin-top:4px}
.offer-card--mine{border-color:#BFE0CB}
.empty-offers{background:var(--surface);border:1px dashed var(--line-strong);border-radius:var(--r-lg);padding:18px;display:grid;gap:12px;justify-items:start}
.empty-offers p{margin:0;color:var(--ink-2)}
@media (max-width:760px){.offers{grid-template-columns:1fr}}

/* ---------- Sécurité mise en avant + versions de la page de démarrage ---------- */
.secure--card{display:flex;gap:14px;align-items:flex-start;background:var(--ok-bg);border:1.5px solid #9FD2B3;border-radius:var(--r-lg);padding:14px 16px;margin:0 0 14px}
.secure__ico{flex:none;width:44px;height:44px;border-radius:12px;background:var(--ok);color:#fff;display:grid;place-items:center}
.secure--card b{display:block;color:var(--ok);font-size:1rem}
.secure--card ul{list-style:none;margin:6px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:4px 16px;font-size:.88rem;color:var(--ink-2)}
.secure--card li::before{content:"✓ ";color:var(--ok);font-weight:800}
.secure--line{display:flex;gap:8px;align-items:center;margin:14px 0 0;padding:10px 12px;background:var(--ok-bg);border-radius:var(--r-md);color:var(--ink-2);font-size:.9rem}
.secure--line svg{flex:none;color:var(--ok)}
.secure--line b{color:var(--ok)}
.onboard--min{max-width:620px;margin:0 auto;text-align:center}
.onboard--min .onboard__lead{margin-bottom:22px}
.onboard--min .secure--line{justify-content:center;text-align:left}
.onboard--split{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr);gap:28px;align-items:start}
.onboard__preview{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-xl);padding:18px;position:sticky;top:90px}
.onboard__preview small{display:block;font-size:.78rem;color:var(--ink-3);font-weight:600}
.onboard__preview strong{display:block;font-size:1.25rem;letter-spacing:-.02em;margin:2px 0 12px}
.onboard__preview mark{background:var(--marker);padding:0 4px;border-radius:4px}
.onboard__preview ol{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.onboard__preview li{display:flex;gap:10px;align-items:center;background:var(--bg);border-radius:12px;padding:9px}
.onboard__preview li i{flex:none;width:30px;height:30px;border-radius:9px;background:#fff;display:grid;place-items:center;font-style:normal;font-weight:800;font-size:.85rem}
.onboard__preview li i svg{width:17px;height:17px}
.onboard__preview li.is-alert i{background:var(--bad-bg);color:var(--bad)}
.onboard__preview li b{display:block;font-size:.84rem;line-height:1.25}
.onboard__preview li em{display:block;font-style:normal;font-size:.78rem;font-weight:700;color:var(--ok)}
.onboard__preview li.is-alert em{color:var(--bad)}
@media (max-width:860px){.onboard--split{grid-template-columns:1fr}.onboard__preview{position:static}}

/* ---------- v9 : le schéma est le premier écran ---------- */
.hv6__hero--center{grid-template-columns:1fr;text-align:center;justify-items:center}
.hv6__hero--center .hv6__lead{margin-left:auto;margin-right:auto}
.spider--hero{margin-top:8px}
.hv6__cta-center{display:flex;flex-direction:column;align-items:center;gap:6px;margin-top:22px}
.hv6__cta-center .hcta--compact{justify-content:center}
.hv6__cta-center .secure--line{justify-content:center}
.hv6__text .secure--line{max-width:460px}

/* ============================================================
   V2.4 - aide des pages, tableau de bord de l'accueil
   ============================================================ */
.help-card{position:relative;background:#F2F5FB;border:1px solid #D5DDEE;border-radius:var(--r-xl);padding:4px 22px 20px;margin:0 0 20px;scroll-margin-top:90px}
.help-card .spider{margin-top:14px}
.help-card .spider__title{font-size:1.25rem}
.help-card .spider__sub{margin-bottom:16px}
.help-card .spider__map{column-gap:48px}
.help-card .spider__node{background:#fff}
.help-card__x{position:absolute;top:10px;right:10px;margin:0;z-index:2}
.help-card__x button{width:36px;height:36px;border-radius:50%;border:1px solid #D5DDEE;background:#fff;color:var(--ink-2);font-size:1.35rem;line-height:1;cursor:pointer;display:grid;place-items:center}
.help-card__x button:hover{color:var(--ink);border-color:var(--ink)}
.help-card__ok{display:flex;justify-content:center;margin:16px 0 0}
.help-btn{display:inline-flex;align-items:center;gap:6px;padding:6px 12px 6px 6px;border-radius:999px;background:#F2F5FB;border:1px solid #D5DDEE;color:var(--ink);font-weight:600;font-size:.88rem;text-decoration:none;white-space:nowrap}
.help-btn span{width:22px;height:22px;border-radius:50%;background:var(--ink);color:#fff;display:grid;place-items:center;font-size:.8rem;font-weight:800}
.help-btn:hover{border-color:var(--ink)}
.page-head__acts{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.dash-progress{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);padding:16px 18px;margin:0 0 14px}
.dash-progress__head{display:flex;justify-content:space-between;align-items:baseline;gap:10px;margin-bottom:8px}
.dash-progress__head b{font-size:1.05rem}
.dash-progress__head span{color:var(--ink-3);font-size:.88rem}
.progress-line--lg{height:10px;margin:0 0 12px}
.dash-steps{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.dash-steps li{display:flex;align-items:center;gap:8px;padding:6px 10px 6px 6px;border-radius:999px;background:var(--bg);font-size:.86rem;color:var(--ink-2)}
.dash-steps__dot{width:22px;height:22px;border-radius:50%;background:#fff;border:1px solid var(--line-strong);display:grid;place-items:center;font-size:.75rem;font-weight:800;color:var(--ink-3)}
.dash-steps li.is-done{color:var(--ok)}
.dash-steps li.is-done .dash-steps__dot{background:var(--ok);border-color:var(--ok);color:#fff}
.dash-steps li.is-next{background:#FFFBE0;color:var(--ink);font-weight:600;box-shadow:inset 0 0 0 1.5px var(--ink)}
.dash-steps li.is-next .dash-steps__dot{background:var(--ink);border-color:var(--ink);color:#fff}
.dash-steps .btn{margin-left:4px}
.kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:0 0 14px}
.kpi{display:block;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);padding:14px 16px;text-decoration:none;color:inherit}
a.kpi:hover{border-color:var(--ink)}
.kpi small{display:block;color:var(--ink-2);font-size:.82rem;font-weight:600}
.kpi strong{display:block;font-size:1.45rem;font-weight:700;letter-spacing:-.02em;line-height:1.2;margin:3px 0 2px;font-variant-numeric:tabular-nums}
.kpi strong em{font-style:normal;font-size:.55em;font-weight:600;color:var(--ink-2);margin-left:2px}
.kpi span{display:block;font-size:.8rem;color:var(--ink-3)}
.kpi--ok{background:var(--ok-bg);border-color:transparent}
.kpi--ok strong{color:var(--ok)}
.kpi--bad{background:var(--bad-bg);border-color:transparent}
.kpi--bad strong{color:var(--bad)}
.kpi--empty strong{color:var(--line-strong)}
.dash-chart{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);padding:14px 16px;margin:0 0 22px}
.dash-chart > b{display:block;margin-bottom:10px}
.plan-head h2{font-size:1.25rem;margin:0;max-width:none}
.plan-more{margin-top:10px}
.plan-more > summary{cursor:pointer;font-weight:700;padding:10px 4px;list-style:none;color:var(--ink)}
.plan-more > summary::-webkit-details-marker{display:none}
.plan-more > summary::before{content:"+";display:inline-block;width:20px;font-weight:800}
.plan-more[open] > summary::before{content:"–"}
.onboard__step{font-size:1.1rem;margin:18px 0 10px;max-width:none}
@media (max-width:760px){.kpis{grid-template-columns:1fr 1fr}.kpi strong{font-size:1.25rem}.dash-steps li{font-size:.82rem}}
.kpi__pre{display:block;font-size:.72rem;font-weight:700;color:var(--ok);letter-spacing:0;margin-bottom:-2px}
.kpi strong{white-space:nowrap}

/* ---------- Bulle d'aide : bien visible, clairement « à part » et fermable ---------- */
.help-card{background:#E9F0FF;border:1.5px solid #B7CBF6;box-shadow:0 22px 44px -26px rgba(40,80,180,.55);padding:18px 22px 20px;margin-top:6px}
.help-card::before{content:"";position:absolute;top:-9px;right:30px;width:16px;height:16px;background:#E9F0FF;border-left:1.5px solid #B7CBF6;border-top:1.5px solid #B7CBF6;transform:rotate(45deg)}
.help-card__tag{display:inline-flex;align-items:center;gap:6px;background:#2F5BD3;color:#fff;font-size:.78rem;font-weight:700;border-radius:999px;padding:3px 10px 3px 4px}
.help-card__tag i{width:18px;height:18px;border-radius:50%;background:#fff;color:#2F5BD3;font-style:normal;font-weight:800;font-family:Georgia,serif;display:grid;place-items:center;font-size:.8rem}
.help-card .spider{margin-top:6px}
.help-card .spider__lines path{stroke:#8CA6E0}
.help-card .spider__node{border-color:#CFDBF7}
.help-card__x button{background:#2F5BD3;border-color:#2F5BD3;color:#fff}
.help-card__x button:hover{background:#1E45B4;border-color:#1E45B4;color:#fff}
.help-btn{background:#E9F0FF;border-color:#B7CBF6;color:#2F5BD3}
.help-btn span{background:#2F5BD3}
.help-btn:hover{border-color:#2F5BD3}
.offer-card__bonus{display:inline-block;margin:6px 0 0 8px;font-size:.78rem;font-weight:700;color:#fff;background:var(--ok);border-radius:999px;padding:2px 8px;vertical-align:1px}

/* ---------- Page de démarrage : versions o5 à o7 ---------- */
.onboard--spider .spider{margin-top:10px}
.onboard--spider .spider__map{column-gap:52px}
.stepbar{display:grid;gap:6px;margin:0 0 16px;max-width:360px}
.stepbar__n{font-size:.8rem;font-weight:800;text-transform:uppercase;letter-spacing:.05em;color:var(--ok)}
.stepbar .progress-line{margin:0}
.nextsteps{list-style:none;margin:14px 0 0;padding:0;display:grid;gap:8px}
.nextsteps li{display:flex;gap:12px;align-items:center;padding:10px 14px;border:1px dashed var(--line-strong);border-radius:var(--r-md);color:var(--ink-3)}
.nextsteps b{flex:none;font-size:.82rem;text-transform:uppercase;letter-spacing:.04em;color:var(--ink-3)}
.checks{list-style:none;margin:0 0 14px;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.checks li{display:flex;flex-direction:column;align-items:center;gap:6px;text-align:center;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-md);padding:12px 8px;font-size:.88rem;font-weight:600}
.checks li svg{color:var(--ok)}
.checks li.checks--bad svg{color:var(--bad)}
@media (max-width:640px){.checks{grid-template-columns:1fr 1fr}}

/* ---------- Bandeau de consentement (mesure publicitaire) ---------- */
.consent{position:fixed;left:12px;right:12px;bottom:calc(12px + env(safe-area-inset-bottom,0px));z-index:250;max-width:560px;margin:0 auto;background:#fff;border:1px solid var(--line-strong);border-radius:var(--r-lg);box-shadow:0 20px 50px -20px rgba(17,27,51,.45);padding:14px 16px;display:grid;gap:10px}
.consent p{margin:0;font-size:.88rem;color:var(--ink-2)}
.consent__btns{display:flex;gap:8px;justify-content:flex-end}
.consent__btns .btn{min-width:110px}
@media (max-width:760px){.l-app .consent{bottom:calc(84px + env(safe-area-inset-bottom,0px))}}

/* ============================================================
   V2.8 - essai sans compte, inscription 1 clic, bandeau cookies CNIL
   ============================================================ */
.btn--fb{background:#1877F2;color:#fff;border-color:#1877F2}
.btn--fb:hover{background:#1466D2;color:#fff}
.btn--fb svg circle{fill:#fff;stroke:#fff}
.btn--fb svg text{fill:#1877F2}
.nav__login--solo{font-size:.9rem;color:var(--ink-2)}
.verify-bar{background:#FFFBE0;border-bottom:1px solid #F1E3A0;font-size:.88rem;color:var(--ink-2);padding:8px 0}
.verify-bar .inline-form{display:inline}
.verify-bar .link{font-size:.88rem}
.email-signup .field{margin-bottom:10px}
.email-signup .input{font-size:16px}
/* bandeau cookies : deux boutons identiques (CNIL), compact */
.consent{position:fixed;left:10px;right:10px;bottom:calc(10px + env(safe-area-inset-bottom,0px));z-index:250;max-width:560px;margin:0 auto;background:#fff;border:1px solid var(--line-strong);border-radius:var(--r-lg);box-shadow:0 20px 50px -20px rgba(17,27,51,.45);padding:12px 14px;display:grid;gap:8px}
.consent p{margin:0;font-size:.82rem;color:var(--ink-2);line-height:1.35}
.consent__btns{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.consent__btn{font:700 .92rem var(--font);padding:10px 12px;border-radius:12px;border:1.5px solid var(--ink);background:#fff;color:var(--ink);cursor:pointer}
.consent__btn:hover{background:var(--ink);color:#fff}
.pwd-login{margin-top:14px;border-top:1px solid var(--line);padding-top:10px}
.pwd-login > summary{cursor:pointer;font-size:.9rem;color:var(--ink-2);font-weight:600}
.pwd-login form{margin-top:10px}
/* ---------- Inscription 1 clic ---------- */
.signup1{max-width:520px;margin:0 auto;padding:22px 16px 60px}
.signup1__card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-xl);padding:22px 18px;box-shadow:0 24px 50px -30px rgba(17,27,51,.35)}
.signup1__pill,.essai__pill{display:inline-block;margin:0 0 10px;font-size:.8rem;font-weight:700;color:var(--ok);background:var(--ok-bg);border-radius:999px;padding:4px 11px}
.signup1 h1{font-size:clamp(1.55rem,6vw,2rem);line-height:1.12;letter-spacing:-.02em;margin:0 0 8px}
.signup1__lead{color:var(--ink-2);margin:0 0 18px}
.signup1 .social{display:grid;gap:10px}
.signup1 .btn--social{min-height:52px;font-size:1rem}
.signup1__legal,.unlock__legal{margin:14px 0 0;font-size:.78rem;color:var(--ink-3);line-height:1.4}
.signup1__steps{list-style:none;counter-reset:s1;margin:18px 0 12px;padding:0;display:grid;gap:8px}
.signup1__steps li{counter-increment:s1;display:grid;grid-template-columns:30px 1fr;column-gap:10px;align-items:center}
.signup1__steps li::before{content:counter(s1);grid-row:span 2;width:30px;height:30px;border-radius:50%;background:var(--ink);color:#fff;font-weight:800;display:grid;place-items:center;font-size:.85rem}
.signup1__steps b{font-size:.95rem}
.signup1__steps span{font-size:.82rem;color:var(--ink-3)}
/* ---------- Pages d'essai ---------- */
.essai{max-width:640px;margin:0 auto;padding:20px 16px 110px}
.essai h1{font-size:clamp(1.6rem,6.2vw,2.3rem);line-height:1.1;letter-spacing:-.025em;margin:0 0 10px}
.essai__lead{color:var(--ink-2);margin:0 0 16px;font-size:1.02rem}
.essai__back{margin:0 0 8px;font-size:.9rem}
.essai__form .drop{margin-top:4px}
.btn--lg{min-height:56px;font-size:1.05rem}
.essai .howget{margin-top:12px}
.essai .howget ol{margin:8px 0 6px;padding-left:20px;display:grid;gap:4px;color:var(--ink-2);font-size:.92rem}
.essai .howget p{margin:0;font-size:.85rem;color:var(--ink-3)}
.essai__finds{list-style:none;margin:20px 0 0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:8px}
.essai__finds li{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-md);padding:10px 12px}
.essai__finds b{display:block;font-size:.92rem}
.essai__finds span{display:block;font-size:.8rem;color:var(--ink-3);margin-top:2px}
.essai__why{margin:14px 0 0;font-size:.82rem;color:var(--ink-3)}
.essai__switch{color:var(--ok) !important}
.essai--wait .analysis{margin-top:4px}
.leave{margin-top:14px;background:#FFFBE0;border:1px solid #F1E3A0;border-radius:var(--r-lg);padding:14px}
.leave p{margin:4px 0 10px;color:var(--ink-2);font-size:.92rem}
/* résultat */
.essai__pill--ok{background:var(--ok-bg)}
.essai__total{font-size:1.1rem;margin:0 0 12px}
.essai__total mark{background:var(--marker);padding:0 5px;border-radius:5px;font-weight:800}
.essai__chips{list-style:none;margin:0 0 16px;padding:0;display:flex;flex-wrap:wrap;gap:6px}
.essai__chips li{background:var(--surface);border:1px solid var(--line);border-radius:999px;padding:5px 10px;font-size:.82rem;color:var(--ink-2)}
.teaser{list-style:none;margin:0 0 18px;padding:0;display:grid;gap:8px}
.teaser__title{font-size:1.1rem;margin:18px 0 10px;max-width:none}
.teaser__item{display:grid;grid-template-columns:28px minmax(0,1fr) auto;gap:10px;align-items:start;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);padding:12px}
.teaser__item b{display:block;font-size:.97rem;line-height:1.3}
.teaser__item p{margin:3px 0 0;font-size:.86rem;color:var(--ink-2);line-height:1.4}
.teaser__num{width:26px;height:26px;border-radius:50%;background:var(--ink);color:#fff;font-weight:800;font-size:.8rem;display:grid;place-items:center}
.teaser__item--security .teaser__num,.teaser__item--warn .teaser__num{background:var(--bad)}
.teaser__item--save .teaser__num{background:var(--ok)}
.teaser__gain{font-weight:800;color:var(--ok);font-size:.9rem;white-space:nowrap;text-align:right}
.teaser__item--locked{background:#F7F8F4}
.teaser__item--locked .teaser__num{background:var(--line-strong)}
.teaser__lock{display:inline-grid;place-items:center;width:24px;height:24px;border-radius:50%;background:var(--ink);color:#fff;vertical-align:middle}
.blur{color:#C9CEC4;letter-spacing:-1px;filter:blur(1.5px);user-select:none}
.kv--essai{margin:0 0 6px}
.kv__locked b{display:flex;gap:8px;align-items:center}
.unlock{background:var(--surface);border:2px solid var(--ink);border-radius:var(--r-xl);padding:18px 16px;scroll-margin-top:80px}
.unlock h2{font-size:1.3rem;margin:0 0 6px;max-width:none}
.unlock__arg{margin:0 0 14px;color:var(--ink-2);font-size:.95rem}
.unlock .social{display:grid;gap:10px}
.unlock .btn--social{min-height:52px;font-size:1rem}
.unlock-bar{position:fixed;left:12px;right:12px;bottom:calc(12px + env(safe-area-inset-bottom,0px));z-index:40;display:block;text-align:center;background:var(--ink);color:#fff;font-weight:800;border-radius:14px;padding:15px;text-decoration:none;box-shadow:0 12px 30px -10px rgba(17,27,51,.55)}
@media (min-width:900px){.unlock-bar{display:none}.essai{padding-top:34px}}
@media (max-width:420px){.essai__finds{grid-template-columns:1fr}}
/* admin : tests d'acquisition */
.tests-table th{white-space:nowrap}
.tests-table td:first-child{min-width:190px}
.tests-table td small{display:block;font-size:.72rem}
/* essai : le bouton d'envoi n'apparaît qu'une fois les fichiers choisis (il ne cache plus « Choisir des photos ») */
.essai__form .sticky-actions:has(button:disabled){display:none}
@media (max-width:760px){
  .consent{padding:10px 12px;gap:8px}
  .consent p{font-size:.76rem;line-height:1.3}
  .consent__btn{padding:8px 10px;font-size:.86rem}
  .essai{padding-top:14px}
  .essai h1{margin-bottom:8px}
  .essai__lead{font-size:.97rem;margin-bottom:12px}
}