/* 15 octobre 2026. Un parcours continu : images, respiration, titres et mouvements liés. */
:root{--black:#080808;--pine:#101010;--ivory:#f7f5f1;--bronze:#ded9cf}
body{background:#080808}.top{background:#101010f5}.top .book{background:#242424;border-color:#777}
#possibles,#projet{display:none!important}
.serif{font-family:'DM Sans',Arial,sans-serif;font-style:normal;letter-spacing:-.055em}
h1 em,h2 em{font-style:normal}
.chooser h1{font-weight:600;letter-spacing:-.065em;line-height:.98;font-size:clamp(62px,6.7vw,106px)}
.chooser h1 em{color:#ddd5ca}.chooser .eyebrow{color:#d7d3cc}.chooser-intro{max-width:560px}
.chooser-bg .opening-camera{inset:0;transform:none;animation:none;opacity:1}.opening-camera video.opening-film{width:100%;height:100%;object-fit:cover;opacity:1!important;transform:none!important}
.chooser-bg:after{background:linear-gradient(90deg,#080808 0%,#080808c9 20%,#08080820 80%),linear-gradient(0deg,#080808,transparent 30%)}
.chooser-mosaic{display:none!important}.chooser .precision input{border-color:#b5b1a8;background:#171717;color:#fff}.chooser .precision .start{background:#eeeae2;color:#171717}
.direction{background:#101010}.direction h2{font-weight:600}.direction h2 em{color:#d9d4cc}.direction-heading p{max-width:760px}.direction-options button[aria-pressed=true]{background:#292929}.direction-options button{transition:background .25s,transform .4s}.direction-options button:hover{transform:translateX(6px)}
#recit.reel-story{height:340svh;background:#080808;overflow:visible;margin:0;--reel-progress:0%;--reel-unfold:0;--reel-camera:0;--reel-x:0px;--reel-y:0px}
#recit.reel-story .film-stage{height:100svh;min-height:700px;position:sticky;top:0;overflow:hidden;padding:0;isolation:isolate;background:#080808;display:block}
.reel-media{position:absolute;inset:0;overflow:hidden;background:#0a0a0a;transform:translate(var(--reel-x),var(--reel-y));transition:transform 1s cubic-bezier(.16,1,.3,1);z-index:0}
.reel-photo{position:absolute;max-width:none;transform-origin:78% 45%;transform:scale(calc(1.05 - var(--reel-camera)*.05));opacity:1;transition:opacity 1.2s,filter 1.4s}
.reel-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity 1.2s;transform:scale(1.02)}
.reel-shade{position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(90deg,#080808f5 2%,#080808c9 34%,#08080819 76%),linear-gradient(0deg,#080808 0%,transparent 35%,transparent 80%,#08080880);transition:background .8s}
.reel-content{position:relative;z-index:2;width:66%;max-width:850px;padding:clamp(65px,10svh,130px) 0 120px;margin-left:6%;height:100%;display:flex;flex-direction:column;align-items:flex-start;justify-content:center}
.reel-kicker{color:#ddd3c5;font-size:21px;line-height:1.4;margin:0 0 28px;max-width:680px}
#recit .reel-heading{font-size:clamp(58px,6.9vw,112px);line-height:.99;letter-spacing:-.065em;font-weight:600;max-width:none;color:#f7f5f1;margin:0 0 25px;text-wrap:balance;outline:0}
.reel-line{display:block;overflow:hidden;padding:0 .05em .12em 0;margin-bottom:-.12em;perspective:800px}.reel-line>span{display:block;transform-origin:center bottom}
.reel-line-accent{color:#d4c7b4}
.reel-copy{font-size:clamp(23px,2vw,29px);line-height:1.5;color:#e4e1db;max-width:625px;text-wrap:pretty;margin:0}
.reel-evidence{max-width:580px;margin-top:28px;padding-left:20px;border-left:1px solid #a69c8e}
.reel-evidence:empty{display:none}.reel-evidence-label{font-size:19px;color:#bbb5ac;line-height:1.4;margin-bottom:8px}.reel-mission{font-size:23px;line-height:1.35;color:#f3e5d0}
.reel-detail{margin-top:25px;font-size:22px;line-height:1.5;max-width:660px;color:#e5ded4}.reel-detail>summary{cursor:pointer;list-style:none;text-decoration:underline;text-underline-offset:7px;display:flex;align-items:center;gap:18px}.reel-detail>summary:before{content:'+';font-size:27px;line-height:1}.reel-detail[open]>summary:before{content:'−'}
.reel-detail[open]{position:absolute;inset:7% auto 13% 0;width:min(720px,88vw);max-width:none;z-index:9;overflow:auto;overscroll-behavior:contain;background:#131313f7;padding:30px;border:1px solid #77746d;margin:0;box-shadow:0 0 80px #0007;backdrop-filter:blur(20px)}
.reel-detail[open]>summary{position:sticky;top:-30px;background:#131313;padding:15px 0 25px;z-index:1}.reel-detail-copy p,.reel-detail-copy li{font-size:23px;line-height:1.5}.reel-detail-copy ul{padding-left:25px;margin:22px 0}.reel-detail-copy .reel-source{font-size:20px;color:#b9b5ae}
.reel-next{margin-top:25px;display:inline-flex;font-size:22px;line-height:1.4;color:#f0e7d9;gap:18px;border-bottom:1px solid #aea79b;padding-bottom:6px}.reel-next:after{content:'↓';font-size:24px}
.reel-nav{display:flex;flex-direction:column;gap:0;z-index:5;position:absolute;bottom:25px;left:6%;width:240px}.reel-tab{border:0;border-left:1px solid #7776;color:#bdbab4;background:transparent;display:flex;align-items:center;position:relative;padding:18px 18px;min-height:90px;text-align:center;font-size:21px;line-height:1.3;transition:background .35s,color .35s}.reel-tab-label{flex:1}.reel-tab-number{font-size:17px;position:absolute;left:0;top:50%;transform:translateY(-50%);opacity:0}.reel-tab[aria-pressed=true]{color:#fff;border-left:2px solid #ddd0bc;background:linear-gradient(90deg,#ffffff11,transparent)}
.reel-nav.reel-nav-docked{position:static;width:100%;margin-top:36px;margin-bottom:20px;flex:none}.reel-is-active .chapter-nav{display:none!important}
.reel-controls{position:absolute;z-index:4;left:6%;bottom:48px}.reel-play{border:1px solid #b4aa9a80;border-radius:30px;padding:12px 22px;color:#eee7dc;background:#151515c9;font-size:20px;cursor:pointer}.reel-play[hidden]{display:none}
.reel-progress{position:absolute;left:6%;right:6%;bottom:20px;background:#ffffff25;height:1px;z-index:4}.reel-progress i{display:block;width:var(--reel-progress);height:100%;background:#eee5d8}.reel-cue{position:absolute;bottom:43px;right:6%;z-index:3;font-size:20px;line-height:1.3;color:#bdb7ad}
#recit[data-act='1'] .reel-photo{opacity:.7;filter:brightness(.65) saturate(.75)}
#recit[data-act='2'].reel-film-ready .reel-video{opacity:1}#recit[data-act='2'].reel-film-ready .reel-photo{opacity:0}
#recit[data-act='2'] .reel-shade{background:linear-gradient(90deg,#080808e6 0%,#080808bf 35%,#08080826 90%),linear-gradient(0deg,#080808,transparent 50%)}
#recit[data-act='2'] .reel-content{width:70%;max-width:900px}
/* Une même grammaire visuelle dans les sections suivantes. */
#methode .method-intro{max-width:850px;font-size:25px;line-height:1.5}.method h2,.consultant-cinema h2,.trust.proof-cinema h2,.practical h2,.ending h2{font-weight:600;letter-spacing:-.06em}
.method h2 em,.consultant-cinema h2 em,.trust.proof-cinema h2 em,.practical h2 em,.ending h2 em{color:#d1c6b5}
.bf-scene-title em{font-family:'DM Sans',Arial,sans-serif;font-style:normal;font-weight:500;color:#d5c9b6;letter-spacing:-.045em}
.bf-stage{background:#0d0d0d;border:0}.bf-plane{border-radius:0;box-shadow:none}.bf-test-sustain{background:linear-gradient(140deg,#292724,#101010)}
.bf-tab{text-align:center;justify-content:center}.bf-tab-number{display:none}.bf-tab span:last-child{width:100%;text-align:center}
.consultant-scene{border-radius:0}.consultant-choices button{justify-content:center;text-align:center}.consultant-choices button span{flex:1;text-align:center}
.trust.proof-cinema{background:#111;--proof-bg:#111;--proof-copper:#d9cbb5}.trust.proof-cinema:before{display:none}
.trust-stage-button,.review-tabs button{text-align:center!important;justify-content:center}
.practical{background:#f0eeea;color:#171717}.practical h2 em{color:#766d61}.ending{background:#080808}
@media(min-width:851px) and (max-height:699px){#recit.reel-story{height:auto}#recit.reel-story .film-stage{min-height:850px;height:auto}.reel-content{min-height:850px;padding-bottom:250px}.reel-nav{bottom:35px;width:265px}.reel-controls,.reel-cue{display:none}.reel-heading{font-size:68px!important}}
@media(max-width:1150px) and (min-width:851px){.reel-content{width:75%}#recit .reel-heading{font-size:73px}.reel-nav.reel-nav-docked{margin-top:20px}.reel-tab{font-size:20px;min-height:80px;padding:15px 10px}.reel-copy{font-size:24px}.reel-mission{font-size:22px}}
@media(max-width:850px){
 #recit.reel-story{height:auto;scroll-margin-top:74px}#recit.reel-story .film-stage{position:relative;height:auto;min-height:1050px;padding:0 0 35px;display:flex;flex-direction:column}
 .reel-media{position:relative;height:380px;min-height:380px;width:100%;inset:auto;transform:none;order:0}.reel-photo{transform:none;opacity:1!important;filter:none!important}.reel-shade{background:linear-gradient(0deg,#080808,transparent 60%);height:380px;bottom:auto;top:0}.reel-video{object-position:center}
 .reel-content,#recit[data-act='2'] .reel-content{height:auto;width:88%;max-width:none;margin:-25px 6% 0;padding:0;order:2;display:flex;justify-content:flex-start;z-index:2}
 #recit .reel-heading{font-size:clamp(44px,10.6vw,75px);line-height:1.02;margin:0 0 24px}.reel-kicker{font-size:20px;margin-bottom:22px}.reel-copy{font-size:23px;line-height:1.5}.reel-evidence{margin-top:24px;padding-left:17px}.reel-evidence-label{font-size:19px}.reel-mission{font-size:23px}
 .reel-nav{position:relative;order:1;left:auto;bottom:auto;width:88%;margin:5px 6% 42px;z-index:3}.reel-tab{min-height:62px;font-size:21px;padding:15px 18px}.reel-tab-label{text-align:center}.reel-controls{position:relative;order:3;left:auto;bottom:auto;margin:25px 6% 0}.reel-detail{font-size:22px}.reel-detail[open]{position:relative;inset:auto;width:100%;padding:22px;margin-top:24px}.reel-detail[open]>summary{top:-22px;font-size:22px}.reel-detail-copy p,.reel-detail-copy li{font-size:22px}.reel-detail-copy .reel-source{font-size:20px}.reel-cue,.reel-progress{display:none}.reel-next{font-size:23px;margin-top:27px}
 #recit[data-act='2'] .reel-shade{background:linear-gradient(0deg,#080808,transparent 60%)}
 .chooser h1{font-size:clamp(55px,12vw,82px)}.chooser .chooser-bg{opacity:.75}.chooser .chooser-content{position:relative;z-index:2}.chooser-bg:after{background:linear-gradient(0deg,#080808 5%,#08080899 60%,#08080844)}
}
@media(prefers-reduced-motion:reduce){#recit.reel-story{height:auto}#recit.reel-story .film-stage{position:relative;min-height:900px;height:auto}.reel-content{min-height:900px;padding-bottom:330px}.reel-photo,.reel-media{transform:none!important}.reel-video{display:none}.reel-nav{bottom:30px}.reel-cue{display:none}.reel-progress{display:none}.reel-play{display:none}.reel-line>span,.reel-copy{animation:none!important;transform:none!important}.direction-options button{transition:none;transform:none!important}}

/* Le cadre s’ouvre en profondeur à l’arrivée, puis la caméra accompagne le défilement. */
.reel-photo{transform-origin:78% 16%;transform:scale(calc(1.16 - var(--reel-camera)*.16))}
.reel-arrive .reel-media{animation:reel-open 2.2s cubic-bezier(.16,1,.3,1) both}
@keyframes reel-open{from{clip-path:inset(18% 10% 18% 20% round 14px);transform:perspective(1500px) rotateY(-14deg) scale(.88);filter:brightness(.4)}to{clip-path:inset(0 round 0);transform:perspective(1500px) rotateY(0) scale(1);filter:brightness(1)}}
.reel-nav.reel-nav-docked{margin-top:12px;margin-bottom:0}.reel-nav-docked .reel-tab{min-height:76px;padding:12px 11px;font-size:20px}
.reel-is-active .rail-content{gap:18px}.reel-is-active .top .top-right{gap:18px}
@media(max-width:850px){.reel-arrive .reel-media{animation:reel-open-mobile 1.4s cubic-bezier(.16,1,.3,1) both}.reel-photo{transform:none}.reel-nav .reel-tab{font-size:22px}}
@keyframes reel-open-mobile{from{clip-path:inset(12% 10% 12% 10%);transform:scale(.94)}to{clip-path:inset(0);transform:scale(1)}}
@media(prefers-reduced-motion:reduce){.reel-arrive .reel-media{animation:none!important}.reel-photo{transform:none!important}}

#recit.reel-story{container-type:inline-size}
#recit .reel-heading{font-size:clamp(56px,6.9cqw,110px)}
.reel-content>*{flex-shrink:0}
@media(min-width:851px) and (max-height:850px){.reel-content{padding-top:45px;padding-bottom:100px}.reel-kicker{margin-bottom:20px}.reel-copy{font-size:24px;line-height:1.45}.reel-evidence{margin-top:22px}.reel-detail,.reel-next{margin-top:20px}#recit .reel-heading{font-size:clamp(52px,6.4cqw,86px)}}
@media(max-width:850px){#recit .reel-heading{font-size:clamp(44px,10.6vw,75px)}.reel-content{padding:0}.reel-copy{font-size:23px;line-height:1.5}}

.reel-nav-heading{font-size:19px;line-height:1.3;color:#a6a29b;text-align:center;padding:0 0 15px}
.reel-edit{font-size:19px;text-align:center;line-height:1.4;padding:15px 8px;background:none;border:0;color:#d2cabe;text-decoration:underline;text-underline-offset:5px}
.reel-nav-docked .reel-tab{min-height:70px;padding:10px 9px}.reel-nav.reel-nav-docked{margin-top:0}
.reel-is-active .rail-content{gap:12px}.reel-is-active .top .top-right{gap:15px}
.bf-title-line{display:block;clip-path:inset(-10% -5% -15%)}
.bf-animate .bf-scene-title{animation:none}.bf-animate .bf-title-line{animation:method-line-open 1s cubic-bezier(.16,1,.3,1) both}.bf-animate .bf-title-line:last-child{animation-delay:.13s}
.bf-animate .bf-plane{animation:method-plane-open 1.4s cubic-bezier(.16,1,.3,1) both;transform-origin:left center}
.bf-animate .bf-plane:nth-child(2){animation-delay:.15s;transform-origin:right center}.bf-animate .bf-plane:nth-child(3){animation-delay:.3s}
.bf-animate .bf-tests .bf-plane:first-child,.bf-animate .bf-values .bf-plane:first-child{animation-name:method-wing-left}
.bf-animate .bf-tests .bf-plane:last-child,.bf-animate .bf-values .bf-plane:last-child{animation-name:method-wing-right}
@keyframes method-line-open{from{clip-path:inset(0 0 100%);transform:translateY(32px)}to{clip-path:inset(-10% -5% -15%);transform:translateY(0)}}
@keyframes method-plane-open{from{opacity:0;transform:perspective(1200px) translate3d(-60px,0,-180px) rotateY(46deg);filter:brightness(.4)}to{opacity:1;transform:perspective(1200px) translate3d(0,0,0) rotateY(0);filter:brightness(1)}}
@keyframes method-wing-left{from{opacity:.2;transform:perspective(1200px) rotateY(74deg);filter:brightness(.4)}to{opacity:1;transform:perspective(1200px) rotateY(0);filter:brightness(1)}}
@keyframes method-wing-right{from{opacity:.2;transform:perspective(1200px) rotateY(-74deg);filter:brightness(.4)}to{opacity:1;transform:perspective(1200px) rotateY(0);filter:brightness(1)}}
#methode .method-deliverables{padding-top:80px;padding-bottom:90px}#methode .method-deliverables h3{font-family:'DM Sans',Arial,sans-serif;font-size:clamp(42px,4.7vw,73px);letter-spacing:-.05em;line-height:1.05;font-weight:600}#methode .method-deliverables>p{font-size:24px;line-height:1.5;max-width:850px}
@media(max-width:850px){.reel-nav-heading{font-size:20px;padding-bottom:12px}.reel-edit{font-size:21px;padding:20px 0 0}.reel-nav{margin-bottom:36px}.bf-animate .bf-plane{animation-name:method-plane-mobile}.reel-content{margin-top:0}}
@keyframes method-plane-mobile{from{opacity:0;transform:translateX(-35px);clip-path:inset(0 100% 0 0)}to{opacity:1;transform:translateX(0);clip-path:inset(0)}}
@media(prefers-reduced-motion:reduce){.bf-animate .bf-plane,.bf-animate .bf-title-line{animation:none!important;transform:none!important;filter:none!important}}

.reel-navigation-summary{display:none}.reel-navigation{border:0;padding:0;margin:0}.reel-navigation .reel-tab{width:100%}
@media(max-width:850px){.reel-nav{margin:10px 6% 28px}.reel-nav-heading{display:none}.reel-navigation-summary{display:flex;align-items:center;justify-content:space-between;padding:16px 20px;font-size:22px;color:#f3eee5;border:1px solid #77716a;background:#171717;cursor:pointer;list-style:none}.reel-navigation-summary:after{content:'+';font-size:25px}.reel-navigation[open]>.reel-navigation-summary:after{content:'−'}.reel-navigation .reel-tab{border-bottom:1px solid #ffffff22}.reel-edit{padding-top:17px;font-size:20px}.reel-media{height:320px;min-height:320px}.reel-shade{height:320px}.reel-content{margin-top:0}.reel-kicker{margin-bottom:18px}}

#chooser .precision input{background:transparent;color:#1d1d1d}
#chooser .precision input::placeholder{color:#69645e;opacity:1}
#chooser .precision .start{background:#252525;color:#f5f2ec}
#chooser .precision .start:hover{background:#444;color:#fff}
#chooser h1 em{white-space:normal;color:#ddd5ca;letter-spacing:-.055em}
#chooser .chooser-content>.eyebrow{color:#d7d3cc}
#chooser .opening-camera{background:none;inset:0;overflow:hidden}
#chooser .opening-camera video.opening-film{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:71% center;opacity:1!important;transform:none!important}
@media(max-width:850px){#recit.reel-story .film-stage{padding-top:74px}.reel-shade{top:74px}.reel-media{flex-shrink:0}}
/* Le montage est présenté entier, sans recadrer les visages de ses panneaux. */
.reel-video{object-fit:contain;background:#080808}

.reel-content{transition:opacity .8s,transform 1.2s cubic-bezier(.16,1,.3,1)}
.reel-watching .reel-content{opacity:0;transform:translateY(22px);pointer-events:none}
.reel-watching .reel-shade{opacity:0;transition:opacity 1.2s}
.reel-shade{transition:opacity 1.2s}
.reel-watching .reel-cue{display:none}
@media(max-width:850px){.reel-watching .reel-controls{position:absolute;z-index:6;left:6%;top:325px;bottom:auto;margin:0}.reel-watching .reel-shade{opacity:0}.reel-play{background:#141414e6}}
@media(prefers-reduced-motion:reduce){.reel-content,.reel-shade{transition:none!important}}
/* Fenêtres d’ordinateur peu hautes : lecture libre et commandes toujours disponibles. */
@media(min-width:851px) and (max-height:699px){
 #recit.reel-story .film-stage{display:flex;flex-direction:column;height:auto;min-height:0;padding-bottom:35px}
 .reel-media{position:absolute;inset:0;height:700px}.reel-shade{height:700px;bottom:auto}
 .reel-content,#recit[data-act='2'] .reel-content{position:relative;width:82%;height:auto;min-height:720px;padding:55px 0 45px;order:0;justify-content:center}
 #recit .reel-heading{font-size:58px!important}.reel-copy{font-size:24px}
 .reel-nav{position:relative;left:auto;bottom:auto;width:300px;margin:0 6% 30px;order:1}
 .reel-controls{display:block;position:relative;left:auto;bottom:auto;margin:0 6%;order:2}
 .reel-watching .reel-media{height:100svh}.reel-watching .reel-controls{position:absolute;top:calc(100svh - 85px);left:6%;margin:0;bottom:auto}
 .reel-cue{display:none}
}
