:root{--ivory:#f7f4ef;--paper:#fffdfa;--ink:#17202a;--soft:#52595f;--night:#121b25;--bronze:#7d6039;--line:#ddd7ce;--serif:"Iowan Old Style",Baskerville,Georgia,serif;--sans:"Avenir Next","Segoe UI",Arial,sans-serif;--shell:min(1200px,calc(100vw - 80px));--shadow:0 24px 70px rgba(20,25,30,.13)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--ivory);color:var(--ink);font-family:var(--sans);line-height:1.65;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}img{display:block}button,input,select,textarea{font:inherit}button{color:inherit}.shell{width:var(--shell);margin:auto}.skip{position:fixed;top:-50px;left:12px;z-index:999;background:#fff;padding:8px 12px}.skip:focus{top:12px}
.header{height:82px;background:rgba(250,248,245,.97);border-bottom:1px solid rgba(30,35,40,.1);position:relative;z-index:50}.header-in{width:min(1340px,calc(100vw - 55px));height:100%;margin:auto;display:flex;align-items:center;justify-content:space-between}.brand{font:24px/1 var(--serif);letter-spacing:-.04em;white-space:nowrap}.brand span,.brand small{color:var(--bronze)}.brand small{font:8px var(--sans);margin-left:2px}.header nav{display:flex;align-items:center;gap:28px;font-size:12px;font-weight:650}.header nav i{height:24px;width:1px;background:var(--line)}.header nav>a:not(.btn){padding:26px 0}.btn{min-height:50px;padding:0 24px;display:inline-flex;align-items:center;justify-content:center;gap:12px;border:1px solid var(--ink);background:var(--ink);color:#fff;text-transform:uppercase;font-size:11px;font-weight:750;letter-spacing:.06em;cursor:pointer;transition:.2s}.btn:hover{background:#755b37;border-color:#755b37;transform:translateY(-1px)}.btn.sm{min-height:40px;padding:0 18px;font-size:11px}.btn.pale{background:var(--paper);border-color:var(--paper);color:var(--ink)}.btn.outline{background:transparent;border-color:rgba(255,255,255,.45)}.btn.full{width:100%}.burger,.mobile-nav{display:none}
.hero{height:calc(100vh - 82px);min-height:650px;max-height:920px;position:relative;color:#fff;overflow:hidden}.hero>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.hero-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(15,23,30,.78),rgba(15,23,30,.48) 42%,rgba(15,23,30,.06) 78%)}.hero-copy{height:100%;position:relative;display:flex;flex-direction:column;align-items:flex-start;justify-content:center}.eyebrow{margin:0 0 20px;color:#755b37;font-size:11px;font-weight:750;letter-spacing:.18em;text-transform:uppercase}.eyebrow:before{content:"";display:inline-block;width:32px;height:1px;background:currentColor;margin:0 13px 3px 0}.eyebrow.light{color:#ddc59f}.hero h1{max-width:760px;margin:0;font:400 clamp(55px,5.3vw,82px)/.98 var(--serif);letter-spacing:-.05em}.hero h1 em{font-weight:400;color:#dcc39c}.hero-copy>p:not(.eyebrow){max-width:580px;margin:28px 0 32px;font-size:18px;color:rgba(255,255,255,.86)}.hero-copy>div{display:flex;align-items:center;gap:32px}.under{display:inline-flex;align-items:center;gap:10px;padding-bottom:7px;border-bottom:1px solid currentColor;text-transform:uppercase;font-size:11px;font-weight:750}.under.dark{border-color:var(--bronze)}
.trust{background:var(--paper);border-bottom:1px solid var(--line)}.trust>.shell{min-height:126px;display:grid;grid-template-columns:repeat(3,1fr);align-items:center}.trust p{margin:0;padding:0 32px;display:flex;gap:18px;align-items:center;border-right:1px solid var(--line)}.trust p:first-child{padding-left:0}.trust p:last-child{border:0}.trust b{width:30px;height:30px;display:grid;place-items:center;border:1px solid #cbb797;border-radius:50%;color:var(--bronze)}.trust span{font-size:12px;color:var(--soft)}.trust strong{display:block;font:500 18px var(--serif);color:var(--ink)}
.section{padding:108px 0}.section h2,.pro-bridge h2{margin:0;font:400 clamp(42px,4.1vw,62px)/1.04 var(--serif);letter-spacing:-.045em}.method .intro{display:grid;grid-template-columns:1.1fr .9fr;gap:100px;align-items:end}.method .intro>div:last-child>p{margin:0 0 26px;color:var(--soft);font:21px/1.55 var(--serif)}.steps{margin-top:78px;border-top:1px solid var(--line);display:grid;grid-template-columns:repeat(4,1fr)}.steps article{padding:28px 27px 22px;border-right:1px solid var(--line);min-height:250px}.steps article:first-child{padding-left:0}.steps article:last-child{border:0}.steps span{color:var(--bronze);font-family:var(--serif)}.steps h3{margin:46px 0 14px;font:500 23px/1.2 var(--serif)}.steps p{color:var(--soft);font-size:13px}
.examples{background:var(--paper);overflow:hidden}.title-row{display:flex;align-items:end;justify-content:space-between}.arrows{display:flex;gap:8px}.arrows button{width:48px;height:48px;border:1px solid var(--line);background:transparent;cursor:pointer}.rail{width:max-content;max-width:100%;margin-top:48px;padding:0 max(40px,calc((100vw - 1200px)/2));display:flex;gap:22px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none}.rail::-webkit-scrollbar{display:none}.sale{width:386px;flex:0 0 386px;border:1px solid var(--line);background:#fff;scroll-snap-align:start}.sale-img{height:274px;position:relative;overflow:hidden}.sale-img img{width:100%;height:100%;object-fit:cover;transition:.5s}.sale:hover img{transform:scale(1.025)}.sale-img span{position:absolute;top:15px;left:15px;background:rgba(250,248,245,.94);padding:6px 9px;font-size:11px;font-weight:700;text-transform:uppercase}.sale-copy{padding:24px}.sale-copy>small{color:#755b37;font-size:11px;font-weight:700;text-transform:uppercase}.sale h3{margin:7px 0 22px;font:500 27px/1.15 var(--serif)}.sale-copy>div{display:grid;grid-template-columns:1fr auto;border-top:1px solid var(--line);padding-top:14px;gap:14px}.sale-copy p{margin:0;font-family:var(--serif)}.sale-copy i{display:block;font:700 11px var(--sans);color:#5f6469;text-transform:uppercase}.end-link{text-align:right;margin-top:30px}.end-link a{font-size:12px;font-weight:700}
.guide{background:#e9e0d4}.guide-grid{display:grid;grid-template-columns:1fr 1fr;gap:90px;align-items:center}.ebook-image-mockup{width:100%;min-width:0;min-height:520px;display:flex;align-items:center;justify-content:center;padding:18px 36px}.ebook-image-mockup img{display:block;width:min(100%,350px);height:auto;filter:drop-shadow(22px 30px 20px rgba(27,25,22,.16));transition:transform .35s ease}.ebook-image-mockup:hover img{transform:translateY(-4px)}.ebook-image-mockup.compact{min-height:390px;justify-content:center;padding:22px 30px 0}.ebook-image-mockup.compact img{width:min(100%,270px)}.guide-grid>div:last-child>p:not(.eyebrow){color:var(--soft);font-size:17px}.guide-grid ul{list-style:none;padding:0;margin:26px 0}.guide-grid li{padding:8px 0;border-bottom:1px solid rgba(60,50,40,.16);font-size:13px}.guide-grid li:before{content:"—";color:var(--bronze);margin-right:10px}.micro{display:block;margin-top:10px;color:#5f6469}
.decision{background:var(--paper)}.decision-grid{display:grid;grid-template-columns:1fr 1fr;background:var(--ivory);min-height:580px}.decision-grid>div:first-child{min-height:520px}.decision img{width:100%;height:100%;object-fit:cover}.decision-grid>div:last-child{padding:70px;display:flex;flex-direction:column;justify-content:center}.decision-grid>div:last-child>p:not(.eyebrow){color:var(--soft)}.decision ul{padding:0;list-style:none}.decision li{margin:9px 0;font-size:13px}.decision .btn{align-self:flex-start;margin-top:20px}
.faq{border-top:1px solid var(--line)}.faq-grid{display:grid;grid-template-columns:.7fr 1.3fr;gap:100px}.faq details{border-top:1px solid var(--line)}.faq details:last-child{border-bottom:1px solid var(--line)}.faq summary{min-height:80px;display:flex;align-items:center;justify-content:space-between;cursor:pointer;list-style:none;font:21px var(--serif)}.faq summary::-webkit-details-marker{display:none}.faq details p{margin:-5px 50px 24px 0;color:var(--soft);font-size:14px}.pro-bridge{padding:80px 0;background:var(--night);color:#fff}.pro-bridge>.shell{display:flex;align-items:center;justify-content:space-between;gap:50px}.pro-bridge h2{font-size:48px}.pro-bridge p:not(.eyebrow){color:rgba(255,255,255,.65)}
.page-hero{min-height:480px;position:relative;display:flex;align-items:center;background:#e8e0d5;overflow:hidden}.page-hero.with-img{min-height:590px;color:#fff}.page-hero>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.page-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(15,23,30,.76),rgba(15,23,30,.17));opacity:0}.with-img .page-shade{opacity:1}.page-hero>.shell{position:relative;padding:75px 0}.page-hero h1{max-width:880px;margin:0;font:400 clamp(48px,5vw,75px)/1 var(--serif);letter-spacing:-.05em}.page-hero>.shell>p:not(.eyebrow){max-width:720px;color:var(--soft);font:20px/1.55 var(--serif)}.with-img .eyebrow{color:#dbc299}.with-img>.shell>p:not(.eyebrow){color:rgba(255,255,255,.86)}.page-hero .btn{margin-top:18px}
.content{background:var(--paper)}.content-grid{display:grid;grid-template-columns:250px minmax(0,760px);gap:85px;justify-content:center}.toc{position:sticky;top:110px;align-self:start;padding-top:22px;border-top:1px solid var(--bronze)}.toc b,.toc a{display:block}.toc b{font-size:11px;text-transform:uppercase;letter-spacing:.15em;margin-bottom:12px}.toc a{color:var(--soft);font-size:12px;padding:5px 0}.prose{color:var(--soft);font-size:16px;line-height:1.85}.prose.narrow{max-width:800px}.prose h2{margin:65px 0 20px;color:var(--ink);font:400 42px/1.08 var(--serif);letter-spacing:-.035em}.prose h2:first-child{margin-top:0}.prose h3{margin:30px 0 10px;color:var(--ink);font:500 27px var(--serif)}.prose blockquote{margin:35px 0;padding:24px 30px;background:var(--ivory);border-left:2px solid var(--bronze);color:var(--ink);font:20px/1.5 var(--serif)}.inline-cta{margin:50px 0;padding:32px;background:var(--night);color:#fff}.inline-cta h3{margin:0;font:400 27px var(--serif)}.inline-cta p{color:rgba(255,255,255,.7)}
.form-page,.guide-landing{padding:78px 0 105px;background:#e9e0d5}.form-layout{display:grid;grid-template-columns:.85fr 1.15fr;gap:85px;align-items:start}.form-layout>div:first-child{min-width:0;padding-top:38px}.form-layout h1{margin:0;font:400 clamp(48px,4.5vw,70px)/1 var(--serif);letter-spacing:-.05em}.form-layout>div:first-child>p:not(.eyebrow){color:var(--soft);font:20px/1.5 var(--serif)}.form-layout>div:first-child>ul{list-style:none;padding:25px 0;border-top:1px solid rgba(40,40,40,.15)}.form-layout>div:first-child li{margin:10px 0;font-size:13px}.form{background:var(--paper);padding:50px;box-shadow:var(--shadow)}.form-head small{color:#755b37;font-size:11px;font-weight:700;text-transform:uppercase}.form-head h2{margin:7px 0 24px;font:400 37px/1.1 var(--serif)}.form-head>i{display:block;height:2px;background:var(--line);margin-bottom:30px}.form-head>i span{display:block;height:100%;background:var(--bronze);transition:.2s}.fields{display:grid;gap:18px}.fields label,.fields legend{font-size:11px;font-weight:700}.fields label>em{color:#5f6469;font-weight:400}.fields input:not([type=radio]):not([type=checkbox]),.fields select,.fields textarea{width:100%;min-height:50px;margin-top:6px;padding:11px 13px;border:1px solid #cec8bf;background:#fff}.duo{display:grid;grid-template-columns:1fr 1fr;gap:15px}.fields fieldset{padding:0;border:0}.choices{display:grid;grid-template-columns:1fr 1fr;gap:8px}.commercialization-choices{grid-template-columns:1fr}.choices input{position:absolute;opacity:0}.choices span{min-height:48px;display:grid;place-items:center;padding:8px 12px;text-align:center;border:1px solid #cec8bf;font-size:11px;font-weight:500}.choices input:focus-visible+span{outline:2px solid var(--bronze);outline-offset:2px}.choices input:checked+span{background:var(--ink);border-color:var(--ink);color:#fff}.consents{display:grid;gap:9px}.consents label{display:grid;grid-template-columns:17px 1fr;gap:10px;padding:12px;border:1px solid var(--line);font-weight:400;line-height:1.5}.consents b{color:#755b37;font-size:11px;text-transform:uppercase}.form-legal{margin:0;color:#5f6469;font-size:11px}.back{width:max-content;border:0;background:transparent;color:#755b37;font-size:11px;cursor:pointer}.hp{position:absolute!important;left:-9999px!important}.error{padding:10px;background:#fae4df;color:#8a2f25}.success{text-align:center}.success>strong{width:55px;height:55px;display:grid;place-items:center;margin:auto;border:1px solid var(--bronze);border-radius:50%;color:var(--bronze)}.card-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}.visual-card{background:#fff;border:1px solid var(--line);overflow:hidden}.visual-card>img{width:100%;height:235px;object-fit:cover}.visual-card>div{padding:24px}.visual-card small{color:#755b37;font-size:11px;font-weight:700;text-transform:uppercase}.visual-card h2{margin:7px 0 10px;font-size:28px}.visual-card p{color:var(--soft);font-size:13px}.visual-card b{font-size:11px}.platforms article{min-height:300px;padding:32px;display:flex;flex-direction:column;background:#fff;border:1px solid var(--line)}.platforms article>span{color:var(--bronze);font-family:var(--serif)}.platforms h2{margin:30px 0 12px;font-size:30px}.platforms p{color:var(--soft);font-size:13px}.platforms a{margin-top:auto;font-size:11px;font-weight:700}.platforms .belgium{grid-column:1/-1;background:var(--night);color:#fff;min-height:0;display:grid;grid-template-columns:150px 1fr auto;gap:25px;align-items:center}.belgium h2,.belgium p,.belgium a{margin:0}.belgium p{color:rgba(255,255,255,.7)}.offers{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line)}.offers article{min-height:340px;padding:38px 32px;background:var(--paper)}.offers span{color:var(--bronze);font-family:var(--serif)}.offers h2{margin:45px 0 15px;font-size:32px}.offers p{color:var(--soft);font-size:14px}.pro-guide-cta{margin-top:42px;padding:38px 42px;display:flex;align-items:center;justify-content:space-between;gap:55px;background:var(--night);color:#fff;box-shadow:var(--shadow)}.pro-guide-cta>div{max-width:690px}.pro-guide-cta .eyebrow{margin-bottom:12px}.pro-guide-cta h2{margin:0;font:400 37px/1.08 var(--serif);letter-spacing:-.035em}.pro-guide-cta p:not(.eyebrow){margin:12px 0 0;color:rgba(255,255,255,.68);font-size:13px}.pro-guide-cta .btn{flex:0 0 auto}.region-copy{display:grid;grid-template-columns:.9fr 1.1fr;gap:85px}.region-copy h2{font-size:46px}.region-copy>div:last-child{color:var(--soft)}.tags{display:flex;flex-wrap:wrap;gap:7px;margin-top:25px}.tags span{padding:7px 10px;border:1px solid var(--line);font-size:11px}.region-copy .btn{margin-top:18px}.thanks{min-height:700px;padding:90px 20px;background:#e9e0d5}.thanks>div{max-width:820px;margin:auto;padding:75px;text-align:center;background:var(--paper);box-shadow:var(--shadow)}.thanks>div>strong{width:58px;height:58px;display:grid;place-items:center;margin:0 auto 25px;border:1px solid var(--bronze);border-radius:50%;color:var(--bronze)}.thanks h1{margin:0;font:400 58px var(--serif)}.thanks>div>p:not(.eyebrow){color:var(--soft)}.thanks aside{margin-top:48px;padding-top:28px;border-top:1px solid var(--line);text-align:left}.thanks aside b{display:block;font-size:11px;text-transform:uppercase}.thanks aside a{display:flex;justify-content:space-between;padding:10px 0;border-bottom:1px solid var(--line);font:18px var(--serif)}
footer{padding:75px 0 30px;background:var(--night);color:#fff}.foot{display:grid;grid-template-columns:2fr repeat(3,1fr);gap:60px;padding-bottom:55px}.brand.light{color:#fff}.foot>div:first-child p{max-width:290px;color:rgba(255,255,255,.55);font:18px var(--serif)}.foot b{display:block;margin-bottom:15px;color:#c4a475;font-size:11px;text-transform:uppercase;letter-spacing:.14em}.foot a{display:block;margin:7px 0;color:rgba(255,255,255,.68);font-size:12px}.foot-bottom{display:flex;justify-content:space-between;padding-top:22px;border-top:1px solid rgba(255,255,255,.15);color:rgba(255,255,255,.62);font-size:11px;text-transform:uppercase}.foot-bottom a{display:inline}.disclaimer{color:rgba(255,255,255,.55);font-size:11px}
@media(max-width:1050px){:root{--shell:min(950px,calc(100vw - 48px))}.header nav{display:none}.burger{display:block;width:43px;height:43px;border:1px solid var(--line);background:transparent;font-size:22px}.mobile-nav{position:absolute;top:82px;left:0;right:0;padding:20px;background:var(--ivory);border-bottom:1px solid var(--line);display:flex;flex-direction:column}.mobile-nav>a:not(.btn){padding:10px;border-bottom:1px solid var(--line);font-family:var(--serif);font-size:23px}.mobile-nav .btn{margin-top:15px}.steps{grid-template-columns:1fr 1fr}.steps article:nth-child(2){border-right:0}.guide-grid,.decision-grid,.faq-grid,.form-layout,.region-copy{gap:50px}.card-grid{grid-template-columns:1fr 1fr}}
@media(max-width:720px){:root{--shell:calc(100vw - 36px)}.header{height:70px}.header-in{width:calc(100vw - 30px)}.brand{font-size:21px}.mobile-nav{top:70px}.hero{height:calc(100svh - 70px);min-height:640px}.hero>img{object-position:62% center}.hero-shade{background:linear-gradient(90deg,rgba(15,23,30,.82),rgba(15,23,30,.42))}.hero-copy{justify-content:flex-end;padding-bottom:65px}.hero h1{font-size:48px}.hero-copy>p:not(.eyebrow){font-size:15px}.hero-copy>div{width:100%;align-items:stretch;flex-direction:column;gap:15px}.hero-copy .under{align-self:flex-start}.trust>.shell{grid-template-columns:1fr;padding:10px 0}.trust p,.trust p:first-child{padding:14px 0;border-right:0;border-bottom:1px solid var(--line)}.section{padding:73px 0}.method .intro,.guide-grid,.decision-grid,.faq-grid,.form-layout,.region-copy{grid-template-columns:1fr}.method .intro{gap:30px}.steps{grid-template-columns:1fr;margin-top:50px}.steps article,.steps article:first-child{min-height:0;padding:24px 0;border-right:0;border-bottom:1px solid var(--line)}.steps h3{margin-top:18px}.arrows{display:none}.rail{padding:0 18px;gap:14px}.sale{width:82vw;flex-basis:82vw}.sale-img{height:225px}.guide-grid{gap:25px}.guide-grid>.ebook-image-mockup{order:2;min-height:410px;padding:24px 20px 0}.ebook-image-mockup:not(.compact) img{width:min(100%,260px)}.ebook-image-mockup.compact{min-height:350px;padding:24px 20px 0}.ebook-image-mockup.compact img{width:min(100%,225px)}.decision-grid>div:first-child{min-height:380px}.decision-grid>div:last-child{padding:42px 25px}.faq-grid{gap:30px}.pro-bridge>.shell{align-items:flex-start;flex-direction:column}.pro-bridge .btn{width:100%}.page-hero,.page-hero.with-img{min-height:500px}.page-hero h1{font-size:47px}.page-hero>.shell>p:not(.eyebrow){font-size:18px}.content-grid{grid-template-columns:1fr}.toc{display:none}.prose h2{font-size:36px}.form-page,.guide-landing{padding:50px 0 75px}.form-layout{gap:35px}.form-layout>div:first-child{padding-top:0}.form-layout h1{font-size:49px}.form{padding:28px 22px}.duo,.choices{grid-template-columns:1fr}.card-grid,.offers{grid-template-columns:1fr}.visual-card>img{height:230px}.platforms .belgium{grid-column:auto;grid-template-columns:1fr}.offers article{min-height:280px}.pro-guide-cta{padding:30px 24px;align-items:flex-start;flex-direction:column;gap:25px}.pro-guide-cta .btn{width:100%}.thanks{padding:50px 18px}.thanks>div{padding:48px 22px}.thanks h1{font-size:44px}.foot{grid-template-columns:1fr 1fr;gap:35px 20px}.foot>div:first-child{grid-column:1/-1}.foot-bottom{align-items:flex-start;flex-direction:column;gap:10px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition-duration:.01ms!important}}

[hidden]{display:none!important}

/* Tableau de prix médians des pages régions. Volontairement sobre : c'est une
   source, pas une infographie. Passe en pleine largeur sous 720px. */
.mkt{width:100%;border-collapse:collapse;margin:30px 0 22px;font-size:13px}
.mkt th,.mkt td{padding:11px 6px;border-bottom:1px solid var(--line);text-align:right;white-space:nowrap}
.mkt th:first-child,.mkt td:first-child{text-align:left;white-space:normal}
.mkt thead th{font-size:11px;font-weight:750;letter-spacing:.07em;text-transform:uppercase;color:var(--soft)}
.mkt tbody td:first-child{font-weight:650;color:var(--ink)}
.mkt tbody tr:last-child td{border-bottom:0}
.mkt .nb{color:var(--soft);font-size:11px}
.src{margin-top:14px;color:var(--soft);font-size:11px;line-height:1.5}
.src a{border-bottom:1px solid var(--line)}
@media(max-width:720px){.mkt{font-size:12px}.mkt th,.mkt td{padding:9px 4px}.mkt .nb{display:none}}

/* Pastille de contact flottante (mail + WhatsApp). Indépendante de la couche
   d'animation : jamais pré-masquée, visible même sans JavaScript. Le libellé
   est présent dans le HTML mais de largeur nulle ; il se déplie au survol ou
   au focus clavier. Sous 720px, seules les deux icônes restent : un doigt n'a
   pas de survol, et le lien agit dès le premier tap. */
.dock{position:fixed;right:20px;bottom:20px;z-index:90;max-width:calc(100vw - 28px);display:flex;align-items:center;background:var(--paper);border:1px solid var(--line);border-radius:999px;box-shadow:0 12px 34px rgba(20,25,30,.16)}
.dock a{text-decoration:none}
.dock-part{display:flex;align-items:center;padding:7px}
.dock-btn{width:40px;height:40px;flex:0 0 40px;display:grid;place-items:center;border-radius:50%;color:#fff;transition:.2s}
.dock-btn:hover{opacity:.86;transform:translateY(-1px)}
.dock-mail{background:var(--night)}
.dock-mail svg{width:17px;height:17px}
.dock-wa{background:#25d366}
.dock-wa svg{width:19px;height:19px}
.dock-sep{width:1px;height:24px;flex:0 0 1px;background:var(--line)}
.dock-slide{max-width:0;display:flex;align-items:center;gap:11px;overflow:hidden;white-space:nowrap;opacity:0;transition:max-width .3s ease,padding .3s ease,opacity .25s ease}
.dock:focus-within .dock-slide{max-width:290px;padding:0 12px;opacity:1}
.dock-slide span{font-size:13px;font-weight:650;color:var(--ink)}
.dock-copy{display:none;padding:0;border:0;background:transparent;color:#755b37;font-size:11px;font-weight:750;letter-spacing:.09em;text-transform:uppercase;cursor:pointer}
.dock-js .dock-copy{display:inline}
.dock-copy:hover{color:var(--ink)}
@media(hover:hover){.dock:hover .dock-slide{max-width:290px;padding:0 12px;opacity:1}}
@media(max-width:720px){.dock{right:14px;bottom:14px}.dock-slide{display:none}}

/* ================= DEBUT COUCHE ANIMATION ================= */
/* ==================================================================
   COUCHE D'ANIMATION — vente-interactive.com
   Ne modifie aucun contenu : uniquement des états visuels.

   Deux garde-fous indépendants :
   1. la classe .anim-on n'est posée sur <html> que si le visiteur ne
      demande pas de mouvement réduit (script inline dans le <head>) ;
   2. les états masqués vivent dans @media (prefers-reduced-motion:
      no-preference) — ils ne s'appliquent donc jamais en mouvement
      réduit, même si la préférence change après le chargement.

   Sans JavaScript, sans .anim-on ou en mouvement réduit : la page est
   strictement identique au site d'origine.
   ================================================================== */

/* Liste de référence des éléments pré-masqués. Lue par le JS via
   getPropertyValue('--vi-watch') pour son filet de sécurité : une seule
   source de vérité, impossible que les deux divergent. */
:root {
  --vi-watch: ".hero .eyebrow, .hero h1, .hero-copy > p:not(.eyebrow), .hero-copy > div, .trust p, .method .intro .eyebrow, .method .intro h2, .method .intro > div:last-child > p, .method .intro > div:last-child > a, .steps article, .examples .title-row .eyebrow, .examples .title-row h2, .examples .arrows, .examples .end-link, .sale, .ebook-image-mockup img, .guide-grid > div:last-child > *, .decision-grid > div:last-child > *, .faq-grid .eyebrow, .faq-grid h2, .faq details, .pro-bridge .shell > div > *, .pro-bridge .shell > a, .page-hero .eyebrow, .page-hero h1, .page-hero > .shell > p:not(.eyebrow), .page-hero > .shell > .btn, .toc, .prose > h2, .prose > h3, .prose > p, .prose > ul, .prose > ol, .prose > blockquote, .prose > .inline-cta, .card-grid > *, .offers article, .pro-guide-cta, .region-copy > div, .form-layout > div:first-child > *, .form, .thanks > div";
}

@media (prefers-reduced-motion: no-preference) {
  /* ---------- 1. ÉTATS INITIAUX ---------- */
  .anim-on .hero .eyebrow,
  .anim-on .hero h1,
  .anim-on .hero-copy > p:not(.eyebrow),
  .anim-on .hero-copy > div,
  .anim-on .trust p,
  .anim-on .method .intro .eyebrow,
  .anim-on .method .intro h2,
  .anim-on .method .intro > div:last-child > p,
  .anim-on .method .intro > div:last-child > a,
  .anim-on .steps article,
  .anim-on .examples .title-row .eyebrow,
  .anim-on .examples .title-row h2,
  .anim-on .examples .arrows,
  .anim-on .examples .end-link,
  .anim-on .sale,
  .anim-on .ebook-image-mockup img,
  .anim-on .guide-grid > div:last-child > *,
  .anim-on .decision-grid > div:last-child > *,
  .anim-on .faq-grid .eyebrow,
  .anim-on .faq-grid h2,
  .anim-on .faq details,
  .anim-on .pro-bridge .shell > div > *,
  .anim-on .pro-bridge .shell > a,
  .anim-on .page-hero .eyebrow,
  .anim-on .page-hero h1,
  .anim-on .page-hero > .shell > p:not(.eyebrow),
  .anim-on .page-hero > .shell > .btn,
  .anim-on .toc,
  .anim-on .prose > h2,
  .anim-on .prose > h3,
  .anim-on .prose > p,
  .anim-on .prose > ul,
  .anim-on .prose > ol,
  .anim-on .prose > blockquote,
  .anim-on .prose > .inline-cta,
  .anim-on .card-grid > *,
  .anim-on .offers article,
  .anim-on .pro-guide-cta,
  .anim-on .region-copy > div,
  .anim-on .form-layout > div:first-child > *,
  .anim-on .form,
  .anim-on .thanks > div {
    opacity: 0;
    will-change: transform, opacity;
  }

  /* Volet de révélation de l'image « votre projet » */
  .anim-on .decision-grid > div:first-child {
    clip-path: inset(0 100% 0 0);
  }

  /* Ken Burns : point de départ posé en CSS pour éviter tout saut
     quand anime.js prend la main. */
  .anim-on .hero > img {
    transform: scale(1.14);
    transform-origin: 58% 45%;
  }
  .anim-on .page-hero.with-img > img {
    transform: scale(1.1);
    transform-origin: 55% 45%;
  }

  /* Le trait des chapeaux se trace */
  .anim-on .eyebrow:before { width: 0; }
  .anim-on .eyebrow.is-in:before {
    animation: vi-line 0.85s cubic-bezier(0.16, 1, 0.3, 1) both;
  }

  /* Filet vertical des étapes : apparaît une fois le bloc atteint */
  .anim-on .steps article {
    border-right-color: transparent;
    transition: border-right-color 0.6s 0.35s ease;
  }
  .anim-on .steps.is-in article { border-right-color: var(--line); }
  .anim-on .steps article:last-child { border-right-color: transparent; }
}

@keyframes vi-line {
  from { width: 0; opacity: 0; }
  to   { width: 32px; opacity: 1; }
}

/* ==================================================================
   2. ÉLÉMENTS CRÉÉS À L'EXÉCUTION PAR LE JS
   ================================================================== */

/* Masques de lignes pour les titres.
   La marge de sécurité laisse passer les jambages (p, q, y) et les
   italiques ; la marge négative annule son effet sur la mise en page. */
.vi-ln {
  display: block;
  overflow: hidden;
  padding: 0.02em 0.14em 0.2em 0;
  margin: 0 -0.14em -0.2em 0;
}
.vi-ln > i {
  display: block;
  font-style: inherit;
  will-change: transform;
}

/* Barre de progression de lecture */
.vi-progress {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  height: 2px;
  z-index: 200;
  pointer-events: none;
}
.vi-progress > i {
  display: block;
  height: 100%;
  width: 100%;
  transform: scaleX(0);
  transform-origin: 0 50%;
  background: linear-gradient(90deg, #c2a878, var(--bronze));
}

/* Indicateur de défilement du hero.
   Centré par le layout et non par un transform : le translateY animé
   écraserait un translateX(-50%). */
.vi-cue {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 34px;
  z-index: 3;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  opacity: 0;
  color: rgba(255, 255, 255, 0.62);
  font: 750 9px var(--sans);
  letter-spacing: 0.19em;
  text-transform: uppercase;
  pointer-events: none;
}
.vi-cue span {
  display: block;
  width: 1px;
  height: 42px;
  background: linear-gradient(rgba(255, 255, 255, 0.55), rgba(255, 255, 255, 0));
}
@media (max-width: 900px) { .vi-cue { display: none; } }

/* Ligne de progression du bloc « étapes » */
.steps { position: relative; }
.vi-steps-line {
  position: absolute;
  top: -1px;
  left: 0;
  height: 1px;
  width: 100%;
  background: var(--bronze);
  transform: scaleX(0);
  transform-origin: 0 50%;
}

/* Barre de progression du carrousel */
.vi-rail-prog {
  position: relative;
  height: 1px;
  margin: 34px auto 0;
  width: var(--shell);
  background: var(--line);
}
.vi-rail-prog > i {
  position: absolute;
  inset: 0 auto 0 0;
  display: block;
  height: 100%;
  width: 22%;
  background: var(--bronze);
  will-change: transform;
}

/* ==================================================================
   3. MICRO-INTERACTIONS
   ================================================================== */

/* Flèches « → » qui glissent au survol */
.btn span[aria-hidden],
.under span[aria-hidden],
.end-link a span[aria-hidden] {
  display: inline-block;
  transition: transform 0.35s cubic-bezier(0.16, 1, 0.3, 1);
}
.btn:hover span[aria-hidden],
.under:hover span[aria-hidden],
.end-link a:hover span[aria-hidden] { transform: translateX(5px); }

/* Balayage bronze sur les boutons pleins */
.anim-on .btn {
  position: relative;
  overflow: hidden;
  isolation: isolate;
}
.anim-on .btn:before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: #755b37;
  transform: scaleX(0);
  transform-origin: 0 50%;
  transition: transform 0.45s cubic-bezier(0.16, 1, 0.3, 1);
}
.anim-on .btn:hover:before { transform: scaleX(1); }
.anim-on .btn.pale:before { background: #efe6d8; }
.anim-on .btn.outline:before { background: rgba(255, 255, 255, 0.12); }

/* Soulignement animé de la navigation */
.anim-on .header nav > a:not(.btn) { position: relative; }
.anim-on .header nav > a:not(.btn):after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 20px;
  height: 1px;
  background: var(--bronze);
  transform: scaleX(0);
  transform-origin: 100% 50%;
  transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1);
}
.anim-on .header nav > a:not(.btn):hover:after {
  transform: scaleX(1);
  transform-origin: 0 50%;
}

/* Cartes : élévation au survol */
.anim-on .sale,
.anim-on .visual-card,
.anim-on .platforms article:not(.belgium) {
  transition: transform 0.5s cubic-bezier(0.16, 1, 0.3, 1),
              box-shadow 0.5s cubic-bezier(0.16, 1, 0.3, 1);
}
.anim-on .sale:hover,
.anim-on .visual-card:hover,
.anim-on .platforms article:not(.belgium):hover {
  transform: translateY(-6px);
  box-shadow: 0 26px 50px rgba(20, 25, 30, 0.13);
}
.anim-on .sale-img img,
.anim-on .visual-card > img {
  transition: transform 0.9s cubic-bezier(0.16, 1, 0.3, 1);
}
.anim-on .sale:hover .sale-img img,
.anim-on .visual-card:hover > img { transform: scale(1.07); }

/* Carrousel */
.anim-on .rail { cursor: grab; }
.anim-on .rail.is-dragging { cursor: grabbing; scroll-snap-type: none; }
.anim-on .rail.is-dragging * { pointer-events: none; }
.anim-on .arrows button {
  transition: background 0.3s ease, color 0.3s ease,
              border-color 0.3s ease, opacity 0.3s ease;
}
.anim-on .arrows button:hover {
  background: var(--ink);
  border-color: var(--ink);
  color: #fff;
}
.anim-on .arrows button[disabled] { opacity: 0.3; cursor: default; }
.anim-on .arrows button[disabled]:hover {
  background: transparent;
  border-color: var(--line);
  color: inherit;
}

/* Couverture d'ebook : le JS pilote le transform, on neutralise le
   survol CSS d'origine pour éviter que les deux se disputent. */
.anim-on .ebook-image-mockup { perspective: 1100px; }
.anim-on .ebook-image-mockup:hover img { transform: none; }
.anim-on .ebook-image-mockup img { transition: none; }

/* FAQ : chevron et ouverture pilotée par le JS */
.anim-on .faq summary span {
  display: inline-block;
  transition: transform 0.45s cubic-bezier(0.16, 1, 0.3, 1), color 0.3s ease;
}
.anim-on .faq details[open] summary span {
  transform: rotate(180deg);
  color: var(--bronze);
}
.anim-on .faq summary:hover { color: var(--bronze); }
.anim-on .faq details p { overflow: hidden; }

/* Sommaire : section courante mise en évidence */
.anim-on .toc a {
  position: relative;
  padding-left: 0;
  transition: color 0.3s ease, padding-left 0.35s cubic-bezier(0.16, 1, 0.3, 1);
}
.anim-on .toc a:before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  width: 0;
  height: 1px;
  background: var(--bronze);
  transition: width 0.35s cubic-bezier(0.16, 1, 0.3, 1);
}
.anim-on .toc a.is-current {
  color: var(--ink);
  padding-left: 20px;
  font-weight: 650;
}
.anim-on .toc a.is-current:before { width: 13px; }

/* Étiquettes des pages région */
.anim-on .tags span {
  transition: background 0.3s ease, border-color 0.3s ease, color 0.3s ease;
}
.anim-on .tags span:hover {
  background: var(--ink);
  border-color: var(--ink);
  color: #fff;
}

/* Formulaires : champ actif mis en avant, erreur signalée par un
   mouvement bref plutôt que par un simple message. */
.anim-on .fields input:not([type="checkbox"]):not([type="radio"]),
.anim-on .fields select,
.anim-on .fields textarea {
  transition: border-color 0.25s ease, box-shadow 0.25s ease;
}
.anim-on .fields input:focus,
.anim-on .fields select:focus,
.anim-on .fields textarea:focus {
  outline: 0;
  border-color: var(--bronze);
  box-shadow: 0 0 0 3px rgba(155, 122, 77, 0.14);
}
.anim-on .choices span {
  transition: background 0.25s ease, border-color 0.25s ease, color 0.25s ease;
}
.anim-on .form.is-invalid { animation: vi-shake 0.45s ease; }
@keyframes vi-shake {
  0%, 100% { transform: translateX(0); }
  20% { transform: translateX(-7px); }
  40% { transform: translateX(6px); }
  60% { transform: translateX(-4px); }
  80% { transform: translateX(2px); }
}

/* Bandeau professionnel : halo lent */
.anim-on .pro-bridge { position: relative; overflow: hidden; }
.anim-on .pro-bridge:before {
  content: "";
  position: absolute;
  top: -60%;
  left: -20%;
  width: 70%;
  height: 220%;
  background: radial-gradient(
    ellipse at center,
    rgba(155, 122, 77, 0.22),
    rgba(155, 122, 77, 0) 62%
  );
  animation: vi-halo 16s ease-in-out infinite alternate;
  pointer-events: none;
}
@keyframes vi-halo {
  from { transform: translateX(0) scale(1); }
  to   { transform: translateX(90%) scale(1.25); }
}

/* ==================================================================
   4. MOUVEMENT RÉDUIT
   Les états masqués n'existent pas ici (cf. bloc no-preference).
   Il ne reste qu'à couper les animations purement décoratives.
   ================================================================== */
@media (prefers-reduced-motion: reduce) {
  .anim-on .pro-bridge:before,
  .anim-on .eyebrow.is-in:before { animation: none; }
  .anim-on .form.is-invalid { animation: none; }
  .vi-cue, .vi-progress, .vi-steps-line { display: none; }
}

/* ================= FIN COUCHE ANIMATION ================= */
