/* 15 octobre 2026. Typographie et tracés : aucune photo, aucune vidéo, aucun carnet. */
#methode.method{background:#0f0f0f;color:#f3f1e9;padding:110px 0 0;overflow:hidden}
#methode>.shell{width:min(92%,1600px)}
#methode>.shell>.eyebrow{color:#d8b899;font-size:20px;letter-spacing:.065em}
#methode h2{font-size:clamp(56px,5.9vw,90px);line-height:1.02;max-width:1100px;font-weight:500;color:#f5f2ea}
#methode h2 em{color:#d7b797}
#methode .method-intro{color:#c7c5c2;max-width:800px;font-size:24px;line-height:1.55;margin:30px 0 0}
#methode .xp-kinetic{--mk-ivory:#f3f0e6;--mk-copper:#dcaa80;--mk-muted:#c7c5c2;--mk-line:#464646;display:grid;grid-template-columns:minmax(180px,22%) minmax(0,1fr);gap:0 35px;max-width:none;margin-top:55px;padding:0;color:var(--mk-ivory);font-size:22px;line-height:1.55;overflow-wrap:normal}
#methode .mk-rail{grid-column:1;grid-row:1 / 3;align-self:start;position:sticky;top:calc(var(--header,80px) + 24px);min-width:0;padding-top:6px}
#methode .xp-tabs{display:flex;flex-direction:column;gap:0;padding:0;margin:0;border:0;position:relative;background:none}
#methode .xp-tabs:after{display:none}
#methode .xp-tab{display:flex;flex-direction:column;align-items:start;gap:12px;padding:26px 10px 26px 23px;margin:0;border:0;border-left:2px solid #474747;background:transparent;color:#b9b7b4;text-align:left;min-width:0;position:relative;transition:color .25s,border-color .25s;cursor:pointer}
#methode .xp-tab:before{content:'';position:absolute;left:-2px;top:0;bottom:0;width:2px;background:var(--mk-copper);transform:scaleY(0);transform-origin:center;transition:transform .35s cubic-bezier(.2,.7,.2,1)}
#methode .xp-tab[aria-selected=true]{color:var(--mk-ivory)}
#methode .xp-tab[aria-selected=true]:before{transform:scaleY(1)}
#methode .xp-tab:hover{color:#e8c7aa}
#methode .xp-tab-number{font-size:20px;line-height:1.3;font-weight:400;color:var(--mk-copper);letter-spacing:.05em}
#methode .xp-tab-name{font-size:clamp(23px,2.1vw,31px);line-height:1.15;font-weight:500;letter-spacing:-.025em;overflow-wrap:normal;hyphens:none}
.mk-tab-short{display:none}
#methode .mk-playback{display:block;border:1px solid #676562;border-radius:40px;background:transparent;color:#d8c3ac;padding:10px 18px;margin:28px 0 0 21px;min-height:48px;font:inherit;font-size:20px;line-height:1.3;cursor:pointer;transition:background .2s,color .2s}
#methode .mk-playback:hover{background:#363636;color:#fff5e8}
#methode .xp-kinetic button:focus-visible,#methode .mk-panel:focus-visible,#methode .mk-detail>summary:focus-visible{outline:2px solid #e5ba8e;outline-offset:6px}
.mk-stage{grid-column:2;grid-row:1;position:relative;isolation:isolate;min-width:0;overflow:hidden;background:linear-gradient(145deg,#2a2a2a 0%,#141414 53%,#181818 100%);border:1px solid #4a4a4a;border-radius:3px;--mk-pointer-x:64%;--mk-pointer-y:38%}
.mk-ambient{position:absolute;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(ellipse 440px 480px at var(--mk-pointer-x) var(--mk-pointer-y),#b3895a1b 0%,#7a78750d 37%,transparent 75%)}
.mk-stage:after{content:'';position:absolute;inset:0;pointer-events:none;z-index:2;box-shadow:inset 0 0 70px #0e0e0e30}
#methode .mk-panel{display:flex;flex-direction:column;gap:0;padding:35px clamp(28px,4vw,64px) 38px;min-height:710px;height:auto;max-width:none;position:relative;align-items:stretch;color:var(--mk-ivory);scroll-margin-top:calc(var(--header,80px) + 20px)}
.mk-scene-top{display:flex;align-items:start;justify-content:space-between;gap:25px;position:relative;z-index:1}
.mk-phase-label{font-size:20px;line-height:1.4;color:#e1bf9f;font-weight:400;letter-spacing:.025em;margin:0}
.mk-scene-count{font-size:20px;line-height:1.4;color:#c5c3c0;white-space:nowrap;font-variant-numeric:tabular-nums}
.mk-composition{position:relative;isolation:isolate;flex:1;display:flex;flex-direction:column;justify-content:center;padding:36px 0 40px;min-height:410px}
.mk-trace{position:absolute;width:calc(100% + 85px);height:100%;left:-42px;top:0;pointer-events:none;z-index:-1;overflow:visible;fill:none;stroke-width:1.2;vector-effect:non-scaling-stroke}
.mk-trace-base{stroke:#a4a29f2c}
.mk-trace-draw{stroke:#cbb08b52;stroke-dasharray:100;stroke-dashoffset:0;stroke-width:1.4}
.mk-light-streak{stroke:#f7d6a7;stroke-dasharray:5 95;stroke-dashoffset:-100;stroke-width:2;opacity:0;filter:drop-shadow(0 0 4px #e7b779)}
#methode .mk-type{display:flex;flex-direction:column;align-items:start;gap:0;font-family:'DM Sans',Arial,sans-serif;font-weight:500;font-size:clamp(64px,7.8vw,127px);line-height:.99;letter-spacing:-.07em;color:var(--mk-ivory);margin:0;text-wrap:balance}
.mk-type-row{position:relative;display:block;max-width:100%;transform-origin:left center;--mk-index:0}
.mk-word{display:inline-block;position:relative;text-shadow:0 2px 24px #0e0e0e70}
[data-phase='0'] .mk-type-row:last-child .mk-word{font-family:'Instrument Serif',Georgia,serif;font-style:italic;font-weight:400;letter-spacing:-.035em;color:#e4bc97}
.mk-inputs{display:flex;flex-wrap:wrap;gap:12px 25px;color:#cfcdca;font-size:20px;line-height:1.45;margin:30px 0 0;position:relative;z-index:1}
.mk-inputs span{border-top:1px solid #757370;padding-top:9px}
#methode [data-phase='1'] .mk-type{font-size:clamp(55px,5.5vw,88px);line-height:1.02;gap:25px}
#methode [data-phase='2'] .mk-type{font-size:clamp(53px,5.5vw,88px);line-height:1.02;gap:25px}
.mk-type-caption{display:block;max-width:650px;font-size:20px;line-height:1.45;letter-spacing:0;font-weight:400;color:#cfcdca;margin-top:9px}
[data-phase='1'] .mk-type-row:nth-child(2){margin-left:10%}
[data-phase='1'] .mk-type-row:nth-child(3){margin-left:20%}
[data-phase='1'] .mk-type-row:nth-child(2) .mk-word{color:#d7b594}
[data-phase='1'] .mk-type-row:nth-child(3) .mk-word{color:#d1cfcc}
.mk-action-number{position:absolute;left:0;top:8px;font-size:20px;line-height:1.4;letter-spacing:.03em;color:var(--mk-copper)}
[data-phase='2'] .mk-type-row{padding-left:43px}
[data-phase='2'] .mk-type-row:nth-child(2) .mk-word{color:#e1b590}
[data-phase='2'] .mk-type-row:nth-child(3) .mk-word{color:#ceccc9}
.mk-summary{position:relative;z-index:1;padding-top:25px;border-top:1px solid #5f5d5a;margin-top:0;max-width:900px}
.mk-summary-copy{font-size:24px;line-height:1.55;color:#e8e6e3;margin:0;max-width:810px}
.mk-result{font-size:22px;line-height:1.5;color:#e8c4a1;font-weight:500;margin:20px 0 0}
#methode .mk-detail{grid-column:2;grid-row:2;border:0;border-bottom:1px solid #4e4e4e;margin:0;padding:0;min-width:0}
#methode .mk-detail>summary{display:flex;align-items:center;justify-content:space-between;gap:20px;list-style:none;padding:25px 0;font-size:22px;line-height:1.4;color:#dfc0a0;cursor:pointer;font-weight:500}
#methode .mk-detail>summary::-webkit-details-marker{display:none}
#methode .mk-detail>summary:after{content:'+';font-size:29px;line-height:1;flex:none;font-weight:400}
#methode .mk-detail[open]>summary:after{content:'−'}
.mk-detail-copy{font-size:22px;line-height:1.65;color:#d5d3d0;padding:0 0 40px;max-width:1000px}
.mk-detail-copy h4{font-size:32px;line-height:1.2;color:#f3ecdf;letter-spacing:-.025em;font-weight:500;margin:12px 0 25px}
.mk-detail-copy p{margin:0 0 22px;font-size:22px;line-height:1.65}
.mk-detail-copy ul{padding-left:24px;margin:0 0 25px}
.mk-detail-copy li{margin:0 0 15px;font-size:22px;line-height:1.6}
.mk-detail-copy .mk-detail-outcome{padding-left:22px;border-left:2px solid #b68d65;color:#e7c4a0;margin-bottom:0}
#methode .method-deliverables{padding:90px 0 100px;max-width:none;margin:0;border:0;display:grid;grid-template-columns:1fr 1.5fr;column-gap:5%;align-items:start}
#methode .method-deliverables>p:first-child{color:#d0ae8c;font-size:22px;margin-top:8px}
#methode .method-deliverables h3{font-size:clamp(38px,4.4vw,65px);font-weight:500;line-height:1.12;letter-spacing:-.04em;color:#f0eeeb;grid-row:span 2}
#methode .method-deliverables h3 em{color:#d7b797}
#methode .method-deliverables>p:last-child{font-size:22px;line-height:1.6;color:#c2c0bd;margin-top:28px;max-width:420px;grid-column:1}
.mk-animate .mk-type-row{animation:mk-type-arrive 1.1s calc(.15s + var(--mk-index)*.19s) both cubic-bezier(.15,.75,.15,1)}
.mk-animate[data-phase='1'] .mk-type-row{animation-name:mk-type-open}
.mk-animate[data-phase='2'] .mk-type-row{animation-name:mk-type-plan}
.mk-animate .mk-inputs span{animation:mk-label-arrive .8s calc(.5s + var(--mk-index)*.17s) both ease-out}
.mk-animate .mk-summary{animation:mk-summary-arrive .9s .35s both ease-out}
.mk-animate .mk-trace-draw{animation:mk-line-draw 1.85s .05s both cubic-bezier(.28,.7,.25,1)}
.mk-animate .mk-light-streak{animation:mk-light-travel 2.4s .05s both ease-out}
[data-motion-stopped='true'].mk-animate *{animation-play-state:paused!important}
@keyframes mk-type-arrive{from{opacity:0;transform:translate3d(0,35px,0);filter:blur(3px)}to{opacity:1;transform:translate3d(0,0,0);filter:blur(0)}}
@keyframes mk-type-open{from{opacity:0;transform:translate3d(-35px,0,0);letter-spacing:-.11em}to{opacity:1;transform:translate3d(0,0,0);letter-spacing:inherit}}
@keyframes mk-type-plan{from{opacity:0;transform:translate3d(0,25px,0) scale(.96)}to{opacity:1;transform:translate3d(0,0,0) scale(1)}}
@keyframes mk-label-arrive{from{opacity:0;transform:translateY(9px)}to{opacity:1;transform:translateY(0)}}
@keyframes mk-summary-arrive{from{opacity:.25;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}
@keyframes mk-line-draw{from{stroke-dashoffset:100}to{stroke-dashoffset:0}}
@keyframes mk-light-travel{0%{stroke-dashoffset:100;opacity:0}15%{opacity:1}78%{opacity:1}100%{stroke-dashoffset:-100;opacity:0}}
@media(max-width:1100px){#methode .xp-kinetic{grid-template-columns:165px minmax(0,1fr);gap:0 25px}#methode .xp-tab-name{font-size:25px}#methode .mk-panel{padding:30px 32px 35px;min-height:720px}#methode .mk-type{font-size:clamp(64px,7.8vw,100px)}.mk-summary-copy{font-size:23px}.mk-composition{min-height:420px}[data-phase='1'] .mk-type-row:nth-child(2){margin-left:5%}[data-phase='1'] .mk-type-row:nth-child(3){margin-left:10%}}
@media(max-width:700px){
 #methode.method{padding-top:75px}#methode>.shell{width:92%}#methode>.shell>.eyebrow{font-size:20px}#methode h2{font-size:clamp(43px,10vw,65px)}#methode .method-intro{font-size:22px;margin-top:25px}
 #methode .xp-kinetic{grid-template-columns:91px minmax(0,1fr);gap:0 14px;margin-top:35px}#methode .mk-rail{top:calc(var(--header,72px) + 12px);grid-row:1;padding-top:2px}#methode .xp-tab{padding:20px 0 20px 11px;gap:10px}#methode .xp-tab-number{font-size:20px}#methode .xp-tab-name{font-size:20px;line-height:1.3;letter-spacing:-.025em}.mk-tab-full{display:none}.mk-tab-short{display:inline}
 #methode .mk-playback{font-size:20px;padding:9px 7px;margin:22px 0 0;border:0;border-top:1px solid #676562;border-radius:0;min-height:48px;width:100%;text-align:left;overflow-wrap:anywhere}
 #methode .mk-panel{min-height:820px;padding:23px 20px 29px}.mk-scene-top{display:block}.mk-phase-label{font-size:20px;line-height:1.4}.mk-scene-count{display:block;margin-top:10px;font-size:20px;color:#a19f9c}.mk-composition{padding:30px 0;min-height:320px;flex:0}.mk-trace{left:-20px;width:calc(100% + 40px);opacity:.7}
 #methode .mk-type{font-size:clamp(38px,8.5vw,57px);line-height:1.05;letter-spacing:-.055em}#methode [data-phase='1'] .mk-type,#methode [data-phase='2'] .mk-type{font-size:clamp(33px,7.4vw,49px);line-height:1.1;gap:25px}.mk-type-caption{font-size:20px;line-height:1.4;margin-top:9px}.mk-inputs{display:grid;gap:14px;font-size:20px;line-height:1.4;margin-top:24px}.mk-inputs span{padding-top:7px;max-width:max-content}[data-phase='1'] .mk-type-row:nth-child(2),[data-phase='1'] .mk-type-row:nth-child(3){margin-left:0}[data-phase='2'] .mk-type-row{padding-left:0;padding-top:24px}.mk-action-number{font-size:20px;top:0}.mk-summary{padding-top:23px}.mk-summary-copy,.mk-result{font-size:22px;line-height:1.55}.mk-result{margin-top:20px}
 #methode .mk-detail{grid-column:1 / -1;grid-row:2;margin-top:5px}#methode .mk-detail>summary{font-size:22px;padding:25px 0}.mk-detail-copy,.mk-detail-copy p,.mk-detail-copy li{font-size:22px}.mk-detail-copy h4{font-size:29px}
 #methode .method-deliverables{display:block;padding:60px 0 75px}#methode .method-deliverables>p:first-child{font-size:22px;margin:0 0 24px}#methode .method-deliverables h3{font-size:clamp(36px,8vw,55px)}#methode .method-deliverables>p:last-child{font-size:22px;margin-top:25px}
}
@media(max-width:370px){#methode .xp-kinetic{grid-template-columns:85px minmax(0,1fr);gap:0 10px}#methode .mk-panel{padding-left:14px;padding-right:14px}#methode .mk-type{font-size:36px}#methode [data-phase='1'] .mk-type,#methode [data-phase='2'] .mk-type{font-size:32px}.mk-summary-copy,.mk-result{font-size:22px;overflow-wrap:anywhere}.mk-phase-label{overflow-wrap:anywhere}}
@media(prefers-reduced-motion:reduce){.xp-kinetic *{animation:none!important;transition:none!important}.mk-light-streak{display:none}#methode .mk-playback{display:none}.mk-ambient{background:radial-gradient(ellipse at 64% 38%,#b3895a13,transparent 70%)}}