:root{
  --bg:#eef0e7;
  --surface:#ffffff;
  --surface-2:#e4e8dc;
  --ink:#1c2620;
  --ink-soft:#3b463d;
  --muted:#647065;
  --line:#d3d9c8;
  --accent:#2f5d44;
  --accent-ink:#1f4230;
  --accent-soft:#dbe6da;
  --state-watch:#51677a;
  --state-watch-soft:#e2e8ee;
  --state-window:#a8701b;
  --state-window-soft:#f3e6cd;
  --state-live:#a1402c;
  --state-live-soft:#f4ddd6;
  --shadow: 0 1px 2px rgba(28,38,32,0.06), 0 6px 20px rgba(28,38,32,0.05);
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --bg:#12180f; --surface:#1a2117; --surface-2:#212a1d; --ink:#e8ecdf; --ink-soft:#c4cdb9;
    --muted:#8b9683; --line:#33402c; --accent:#6ea77f; --accent-ink:#a9d4b5; --accent-soft:#213229;
    --state-watch:#8fa8bd; --state-watch-soft:#212c34; --state-window:#d9a04a; --state-window-soft:#332510;
    --state-live:#e08066; --state-live-soft:#3a2018; --shadow: 0 1px 2px rgba(0,0,0,0.3), 0 8px 24px rgba(0,0,0,0.35);
  }
}
:root[data-theme="dark"]{
  --bg:#12180f; --surface:#1a2117; --surface-2:#212a1d; --ink:#e8ecdf; --ink-soft:#c4cdb9;
  --muted:#8b9683; --line:#33402c; --accent:#6ea77f; --accent-ink:#a9d4b5; --accent-soft:#213229;
  --state-watch:#8fa8bd; --state-watch-soft:#212c34; --state-window:#d9a04a; --state-window-soft:#332510;
  --state-live:#e08066; --state-live-soft:#3a2018; --shadow: 0 1px 2px rgba(0,0,0,0.3), 0 8px 24px rgba(0,0,0,0.35);
}
*{box-sizing:border-box;}
html{color-scheme:light dark;}
body{margin:0; background:var(--bg); color:var(--ink); font-family:'IBM Plex Sans', system-ui, sans-serif; font-size:16px; line-height:1.6;}
.wrap{max-width:960px; margin:0 auto; padding:0 28px;}
a{color:var(--accent-ink);}
img{max-width:100%;}

header.top{border-bottom:1px solid var(--line); padding:16px 0; position:sticky; top:0; z-index:20; background:color-mix(in srgb, var(--bg) 92%, transparent); backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px);}
header.top .wrap{display:flex; justify-content:space-between; align-items:center; gap:14px 20px; flex-wrap:wrap; row-gap:10px;}
.logo{font-family:'Source Serif 4', serif; font-weight:600; font-size:19px; color:var(--ink); display:flex; align-items:baseline; gap:9px; text-decoration:none;}
.logo .dot{width:8px;height:8px;border-radius:50%;background:var(--accent); position:relative; top:-2px;}
.logo .sub{font-family:'IBM Plex Mono', monospace; font-size:11px; letter-spacing:.06em; color:var(--muted); font-weight:400;}
nav.mainnav{display:flex; gap:18px; flex-wrap:wrap; font-family:'IBM Plex Sans', sans-serif; font-size:14px; font-weight:500; order:3; width:100%;}
@media (min-width: 640px){ nav.mainnav{width:auto; order:0; gap:24px;} }
nav.mainnav a{color:var(--ink-soft); text-decoration:none; padding:4px 0; border-bottom:2px solid transparent;}
nav.mainnav a:hover, nav.mainnav a.active{color:var(--ink); border-bottom-color:var(--accent);}
.nav-cta{font-family:'IBM Plex Mono', monospace; font-size:12px; color:var(--muted); border:1px solid var(--line); padding:6px 13px; border-radius:20px; text-decoration:none; white-space:nowrap;}

.hero{padding:56px 0 36px;}
.hero .wrap{display:grid; grid-template-columns:1.15fr 0.85fr; gap:48px; align-items:start;}
@media (max-width:900px){ .hero .wrap{grid-template-columns:1fr;} }

.hero-preview{background:var(--surface); border:1px solid var(--line); border-radius:14px; padding:22px 22px 20px; box-shadow:0 4px 14px rgba(28,38,32,0.07), 0 20px 44px rgba(28,38,32,0.08);}
.hero-preview .hp-head{display:flex; align-items:center; justify-content:space-between; margin-bottom:16px; padding-bottom:14px; border-bottom:1px solid var(--line);}
.hero-preview .hp-title{font-family:'IBM Plex Mono', monospace; font-size:11px; text-transform:uppercase; letter-spacing:.08em; color:var(--muted);}
.hero-preview .hp-dot{display:inline-flex; align-items:center; gap:6px; font-family:'IBM Plex Mono', monospace; font-size:11px; color:var(--state-live);}
.hero-preview .hp-dot i{width:6px; height:6px; border-radius:50%; background:var(--state-live); box-shadow:0 0 0 3px var(--state-live-soft);}
.hero-preview .hp-grid{display:grid; grid-template-columns:1fr 1fr; gap:12px;}
.hero-preview .hp-kpi{background:var(--surface-2); border-radius:9px; padding:13px 14px;}
.hero-preview .hp-kpi .hp-num{font-family:'Source Serif 4', serif; font-size:24px; font-weight:600; color:var(--ink); font-variant-numeric:tabular-nums; display:block;}
.hero-preview .hp-kpi .hp-label{font-size:10.5px; text-transform:uppercase; letter-spacing:.06em; color:var(--muted); margin-top:4px; display:block;}
.hero-preview .hp-foot{margin-top:14px; font-size:11.5px; color:var(--muted); font-family:'IBM Plex Mono', monospace;}

.trust-bar{display:flex; align-items:center; gap:22px; flex-wrap:wrap; padding:18px 0 6px; margin-top:8px; border-top:1px solid var(--line);}
.trust-bar .tb-label{font-family:'IBM Plex Mono', monospace; font-size:10.5px; text-transform:uppercase; letter-spacing:.08em; color:var(--muted);}
.trust-bar .tb-items{display:flex; gap:20px; flex-wrap:wrap;}
.trust-bar .tb-item{display:flex; align-items:center; gap:7px; font-family:'IBM Plex Mono', monospace; font-size:12.5px; color:var(--ink-soft);}
.trust-bar .tb-item svg{flex:none; color:var(--muted);}

.icon-wrap{width:34px; height:34px; border-radius:8px; background:var(--accent-soft); color:var(--accent-ink); display:flex; align-items:center; justify-content:center; margin-bottom:12px;}
.icon-wrap svg{width:18px; height:18px;}
.eyebrow{font-family:'IBM Plex Mono', monospace; font-size:12px; letter-spacing:.12em; text-transform:uppercase; color:var(--state-window); background:var(--state-window-soft); display:inline-block; padding:5px 11px; border-radius:4px; margin-bottom:18px;}
h1.title{font-family:'Source Serif 4', serif; font-size:42px; font-weight:600; line-height:1.14; margin:0 0 18px; text-wrap:balance; max-width:680px;}
.hero .lede{font-size:17.5px; color:var(--ink-soft); max-width:600px; margin:0 0 28px; line-height:1.55;}
.hero-stats{display:flex; gap:26px; flex-wrap:wrap; margin-top:6px;}
.hero-stats .stat b{font-family:'Source Serif 4', serif; font-size:25px; display:block; color:var(--ink); font-variant-numeric:tabular-nums;}
.hero-stats .stat span{font-size:12.5px; color:var(--muted);}
.proof-line{font-family:'IBM Plex Mono', monospace; font-size:12.5px; color:var(--muted); margin:0 0 30px; display:flex; gap:10px; flex-wrap:wrap; align-items:center;}
.proof-line b{color:var(--ink-soft); font-weight:600;}
.proof-line .sep{color:var(--line);}
.hero-cta{display:flex; gap:12px; margin-top:26px; flex-wrap:wrap;}
.btn{font-family:'IBM Plex Mono', monospace; font-size:13px; padding:11px 20px; border-radius:6px; text-decoration:none; display:inline-block;}
.btn.primary{background:var(--accent); color:#fff;}
.btn.secondary{border:1px solid var(--line); color:var(--ink-soft);}

section{padding:40px 0; border-top:1px solid var(--line);}
section.tight{padding:28px 0;}
h2.h{font-family:'Source Serif 4', serif; font-size:26px; font-weight:600; margin:0 0 8px; text-wrap:balance;}
h1.page-title{font-family:'Source Serif 4', serif; font-size:34px; font-weight:600; margin:0 0 12px; text-wrap:balance;}
.section-lede{color:var(--muted); font-size:15px; max-width:620px; margin:0 0 26px;}
p{color:var(--ink-soft);}

.steps{display:grid; grid-template-columns:repeat(4,1fr); gap:14px;}
.step{background:var(--surface); border:1px solid var(--line); border-radius:10px; padding:18px; box-shadow:var(--shadow);}
.step .n{font-family:'IBM Plex Mono', monospace; font-size:11px; color:var(--muted); text-transform:uppercase; letter-spacing:.08em;}
.step h3{font-family:'Source Serif 4', serif; font-size:16px; margin:8px 0 8px; font-weight:600;}
.step p{font-size:13px; color:var(--ink-soft); margin:0;}
.step.live{border-top:3px solid var(--state-live);}

.proof{background:var(--surface); border:1px solid var(--line); border-radius:10px; padding:20px 22px; box-shadow:var(--shadow); margin-top:20px;}
.proof .tag{font-family:'IBM Plex Mono', monospace; font-size:11px; text-transform:uppercase; letter-spacing:.08em; color:var(--state-live); margin-bottom:8px; display:block;}
.proof p{margin:0; font-size:14.5px; color:var(--ink-soft);}
.proof p b{color:var(--ink);}

table.compare{width:100%; border-collapse:collapse; margin-top:10px;}
table.compare th, table.compare td{text-align:left; padding:12px 14px; border-bottom:1px solid var(--line); font-size:13.5px; vertical-align:top;}
table.compare th{font-family:'IBM Plex Mono', monospace; font-size:11px; text-transform:uppercase; letter-spacing:.06em; color:var(--muted); font-weight:600;}
table.compare td.us{background:var(--accent-soft);}
.table-wrap{overflow-x:auto;}

.pricing{display:grid; grid-template-columns:repeat(3,1fr); gap:16px;}
.plan{background:var(--surface); border:1px solid var(--line); border-radius:10px; padding:22px 20px; box-shadow:var(--shadow); display:flex; flex-direction:column;}
.plan.reco{border-color:var(--accent); box-shadow:0 0 0 1px var(--accent), var(--shadow);}
.plan .tag{font-family:'IBM Plex Mono', monospace; font-size:10.5px; text-transform:uppercase; letter-spacing:.07em; color:var(--muted); margin-bottom:10px;}
.plan h3{font-family:'Source Serif 4', serif; font-size:18px; margin:0 0 6px; font-weight:600;}
.plan .price{font-family:'Source Serif 4', serif; font-size:30px; font-weight:600; margin:6px 0 14px; font-variant-numeric:tabular-nums;}
.plan .price span{font-size:13px; color:var(--muted); font-family:'IBM Plex Sans', sans-serif; font-weight:400;}
.plan ul{margin:0 0 18px; padding:0; list-style:none; font-size:13.5px; color:var(--ink-soft); flex:1;}
.plan li{padding:6px 0 6px 18px; position:relative;}
.plan li::before{content:"—"; position:absolute; left:0; color:var(--muted);}
.plan .cta{font-family:'IBM Plex Mono', monospace; font-size:12.5px; text-align:center; padding:10px; border-radius:6px; background:var(--surface-2); color:var(--ink-soft); border:1px solid var(--line); display:block; text-decoration:none; cursor:pointer; transition:opacity .15s ease;}
.plan.reco .cta{background:var(--accent); color:#fff; border-color:var(--accent);}
.plan.reco .cta:hover{opacity:.88;}

.method-grid{display:grid; grid-template-columns:1fr 1fr; gap:20px;}
.method-grid .col span.tag{font-family:'IBM Plex Mono', monospace; font-size:10.5px; text-transform:uppercase; letter-spacing:.08em; color:var(--muted); display:block; margin-bottom:6px;}
.method-grid .col p{font-size:13.5px; color:var(--ink-soft); margin:0 0 18px; line-height:1.55;}

.cards{display:flex; flex-direction:column; gap:10px;}
.card{background:var(--surface); border:1px solid var(--line); border-radius:9px; padding:16px 18px; box-shadow:var(--shadow); display:grid; grid-template-columns:1fr auto; gap:14px; align-items:start;}
.card .primary .acheteur{font-weight:600; font-size:15px; color:var(--ink);}
.card .primary .lieu{color:var(--muted); font-size:13px; margin-top:2px;}
.card .why{margin-top:9px; font-size:13px; color:var(--ink-soft); background:var(--surface-2); border-radius:6px; padding:8px 11px; display:flex; gap:7px;}
.card .why .ico{flex:none; color:var(--muted);}
.card .facts{display:flex; flex-direction:column; align-items:flex-end; gap:6px; min-width:190px;}
.badge{font-family:'IBM Plex Mono', monospace; font-size:11px; letter-spacing:.04em; padding:3px 9px; border-radius:20px; font-weight:500; white-space:nowrap;}
.badge.watch{background:var(--state-watch-soft); color:var(--state-watch);}
.badge.window{background:var(--state-window-soft); color:var(--state-window);}
.badge.live{background:var(--state-live-soft); color:var(--state-live);}
.facts .montant-label{font-size:9.5px; text-transform:uppercase; letter-spacing:.06em; color:var(--muted); margin-bottom:1px;}
.facts .montant{font-family:'IBM Plex Mono', monospace; font-size:15px; font-weight:600; color:var(--ink); font-variant-numeric:tabular-nums;}
.facts .dates{font-family:'IBM Plex Mono', monospace; font-size:12px; color:var(--muted); text-align:right; font-variant-numeric:tabular-nums;}
.facts .titulaire{font-size:11.5px; color:var(--muted); text-align:right;}

.more-row{text-align:center; padding:12px; color:var(--muted); font-size:13px; border:1px dashed var(--line); border-radius:9px; font-family:'IBM Plex Mono', monospace;}

.method{margin-top:36px; padding:20px 22px; background:var(--surface-2); border-radius:10px; border:1px solid var(--line);}
.method h3{font-family:'Source Serif 4', serif; font-size:15px; margin:0 0 10px; font-weight:600;}

.kpi-row{display:grid; grid-template-columns:repeat(4,1fr); gap:14px; margin-bottom:28px;}
.kpi{background:var(--surface); border:1px solid var(--line); border-radius:10px; padding:18px 18px 16px; box-shadow:var(--shadow); border-top:3px solid var(--state-watch);}
.kpi.confidence{border-top-color:var(--accent);}
.kpi.window{border-top-color:var(--state-window);}
.kpi.live{border-top-color:var(--state-live);}
.kpi .label{font-size:11px; text-transform:uppercase; letter-spacing:.08em; color:var(--muted); font-weight:600; margin-bottom:10px;}
.kpi .num{font-family:'Source Serif 4', serif; font-size:32px; font-weight:600; line-height:1; font-variant-numeric:tabular-nums; color:var(--ink);}
.kpi .sub{font-size:12.5px; color:var(--muted); margin-top:8px;}
.kpi .sub b{color:var(--ink-soft);}

.locked{position:relative; filter:blur(5px); user-select:none; pointer-events:none;}
.lock-overlay{position:relative; margin-top:-1px;}
.lock-banner{position:absolute; inset:0; display:flex; align-items:center; justify-content:center; z-index:2;}
.lock-banner-inner{background:var(--surface); border:1px solid var(--line); border-radius:10px; padding:16px 24px; box-shadow:var(--shadow); text-align:center; font-family:'IBM Plex Mono', monospace; font-size:13px; color:var(--ink-soft);}

.unit-list{font-size:9.5px; text-transform:uppercase; letter-spacing:.06em; color:var(--muted);}

footer.site{padding:30px 0 50px; color:var(--muted); font-size:12.5px;}
footer.site .wrap{display:flex; justify-content:space-between; flex-wrap:wrap; gap:14px;}
footer.site nav{display:flex; gap:16px; flex-wrap:wrap;}
footer.site nav a{color:var(--muted); text-decoration:none;}

@media (max-width: 780px){
  .steps{grid-template-columns:1fr 1fr;}
  .pricing{grid-template-columns:1fr;}
  .method-grid{grid-template-columns:1fr;}
  .kpi-row{grid-template-columns:1fr 1fr;}
  h1.title{font-size:30px;}
  .card{grid-template-columns:1fr;}
  .card .facts{align-items:flex-start; min-width:0;}
  .facts .dates, .facts .titulaire{text-align:left;}
}

/* --- Finition premium : micro-interactions, hierarchie, funnel --- */
.step, .card, .kpi, .plan{transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;}
.step:hover, .card:hover{transform: translateY(-2px); box-shadow: 0 4px 10px rgba(28,38,32,0.08), 0 14px 28px rgba(28,38,32,0.07); border-color: var(--accent);}
.kpi:hover{transform: translateY(-2px); box-shadow: 0 4px 10px rgba(28,38,32,0.08), 0 14px 28px rgba(28,38,32,0.07);}
.btn{transition: transform .15s ease, box-shadow .15s ease, opacity .15s ease;}
.btn.primary:hover{transform: translateY(-1px); box-shadow: 0 6px 16px rgba(47,93,68,0.28);}
.btn.secondary:hover{border-color: var(--accent); color: var(--ink);}
nav.mainnav a{transition: color .15s ease, border-color .15s ease;}

/* Funnel A -> B -> C -> D : barres proportionnelles */
.funnel{display:flex; flex-direction:column; gap:10px; margin:22px 0;}
.funnel-row{display:grid; grid-template-columns:190px 1fr 70px; align-items:center; gap:12px;}
.funnel-row .flabel{font-family:'IBM Plex Mono', monospace; font-size:11.5px; color:var(--ink-soft); white-space:nowrap;}
.funnel-row .ftrack{background:var(--surface-2); border-radius:5px; height:14px; overflow:hidden; border:1px solid var(--line);}
.funnel-row .fbar{height:100%; border-radius:5px 0 0 5px; transition: width .6s cubic-bezier(.2,.8,.2,1);}
.funnel-row.fa .fbar{background:var(--muted);}
.funnel-row.fb .fbar{background:var(--state-watch);}
.funnel-row.fc .fbar{background:var(--accent);}
.funnel-row.fd .fbar{background:var(--state-live);}
.funnel-row .fval{font-family:'IBM Plex Mono', monospace; font-size:13px; font-weight:600; color:var(--ink); text-align:right; font-variant-numeric:tabular-nums;}
@media (max-width: 640px){ .funnel-row{grid-template-columns:1fr; gap:4px;} .funnel-row .fval{text-align:left;} }

/* Reveal au scroll : jamais invisible au repos -- juste un leger tassement,
   pleinement lisible meme si le JS ne s'execute jamais (pas d'opacity:0). */
.reveal{transform: translateY(10px); transition: transform .45s ease;}
.reveal.is-visible{transform: translateY(0);}
@media (prefers-reduced-motion: reduce){
  .reveal{transform:none;}
  .step, .card, .kpi, .btn{transition:none;}
}