/* NewVision Insight — feuille de style du site
   Concept de mise en page : « la marge de relevé ». Chaque section réserve une colonne
   de marge où vivent l'accroche, les heures et les index, comme dans un carnet de terrain.
   Le texte tient dans la colonne principale. Les sections alternent encre et ivoire,
   comme les pièces d'un même parcours. */

@font-face{font-family:'DM Sans';font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/dmsans-400.woff2) format('woff2')}
@font-face{font-family:'DM Sans';font-style:normal;font-weight:500;font-display:swap;src:url(../fonts/dmsans-500.woff2) format('woff2')}
@font-face{font-family:'DM Sans';font-style:normal;font-weight:600;font-display:swap;src:url(../fonts/dmsans-600.woff2) format('woff2')}
@font-face{font-family:'Cormorant Garamond';font-style:italic;font-weight:400;font-display:swap;src:url(../fonts/cormorant-italic-400.woff2) format('woff2')}
@font-face{font-family:'Cormorant Garamond';font-style:italic;font-weight:500;font-display:swap;src:url(../fonts/cormorant-italic-500.woff2) format('woff2')}
@font-face{font-family:'Cormorant Garamond';font-style:normal;font-weight:500;font-display:swap;src:url(../fonts/cormorant-500.woff2) format('woff2')}

:root{
  /* Couleurs de la charte */
  --encre:#111210; --ombre:#1C1E1A; --ivoire:#F0EEE6; --papier:#E7E5DC;
  --or:#B7A079; --bronze:#876B3E; --pierre:#AAA99F; --graphite:#5C5E55;
  /* Typographies : la voix, l'intuition, le relevé */
  --voix:'DM Sans',Arial,sans-serif;
  --intuition:'Cormorant Garamond',Georgia,serif;
  --releve:'Courier New',Courier,monospace;
  /* Rythme */
  --gutter:clamp(20px,5vw,88px);
  --maxw:1360px;
  --band:clamp(84px,10vw,152px);
  --margin-col:minmax(0,3fr);
  --main-col:minmax(0,9fr);
  --ease:cubic-bezier(.2,.7,.1,1);
  /* Tonalité par défaut : encre */
  --bg:var(--encre); --fg:var(--ivoire); --fg2:var(--pierre); --acc:var(--or);
  --rule:rgba(183,160,121,.28); --rule-soft:rgba(240,238,230,.1);
  color-scheme:dark;
}
.t-encre{--bg:var(--encre);--fg:var(--ivoire);--fg2:var(--pierre);--acc:var(--or);--rule:rgba(183,160,121,.28);--rule-soft:rgba(240,238,230,.1)}
.t-ombre{--bg:var(--ombre);--fg:var(--ivoire);--fg2:var(--pierre);--acc:var(--or);--rule:rgba(183,160,121,.28);--rule-soft:rgba(240,238,230,.1)}
.t-ivoire{--bg:var(--ivoire);--fg:var(--encre);--fg2:var(--graphite);--acc:var(--bronze);--rule:rgba(135,107,62,.3);--rule-soft:rgba(17,18,16,.1)}
.t-papier{--bg:var(--papier);--fg:var(--encre);--fg2:var(--graphite);--acc:var(--bronze);--rule:rgba(135,107,62,.32);--rule-soft:rgba(17,18,16,.11)}
.t-encre,.t-ombre,.t-ivoire,.t-papier{background:var(--bg);color:var(--fg)}

*,*:before,*:after{box-sizing:border-box}
[hidden]{display:none!important}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:110px}
body{margin:0;background:var(--encre);color:var(--ivoire);font-family:var(--voix);font-size:16px;line-height:1.75;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
img,svg{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
h1,h2,h3,h4,p,ul,ol,figure,blockquote,dl,dd{margin:0}
ul,ol{padding:0;list-style:none}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer;background:none;border:0;padding:0}
::selection{background:var(--or);color:var(--encre)}
:focus-visible{outline:2px solid var(--acc);outline-offset:4px}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:fixed;left:16px;top:-80px;z-index:100;background:var(--ivoire);color:var(--encre);padding:12px 18px}
.skip:focus{top:16px}

/* ---------- Typographie ---------- */
h1,h2,h3{font-weight:400;text-wrap:balance}
.h1{font-size:clamp(44px,6.1vw,88px);line-height:1.02;letter-spacing:-.055em}
.h2{font-size:clamp(34px,4.2vw,61px);line-height:1.06;letter-spacing:-.045em}
.h3{font-size:clamp(20px,1.6vw,23px);line-height:1.3;letter-spacing:-.02em;font-weight:500}
.h1 em,.h2 em,.h3 em,.quote em,.lead em{font-family:var(--intuition);font-style:italic;font-weight:400;font-size:1.12em;letter-spacing:-.02em;color:var(--acc);line-height:.9}
.lead{font-size:clamp(18px,1.5vw,21px);line-height:1.6;letter-spacing:-.012em;max-width:38em}
.prose{max-width:36em;display:grid;gap:1.1em;color:var(--fg)}
.prose p{color:var(--fg2)}
.prose strong,.lead strong{font-weight:500;color:var(--fg)}
.muted{color:var(--fg2)}
.releve{font-family:var(--releve);font-size:12px;letter-spacing:.13em;text-transform:uppercase;line-height:1.5}
.tc{font-family:var(--releve);font-variant-numeric:tabular-nums;letter-spacing:.04em}

/* L'accroche : filet or de 22 px + relevé en mono capitales */
.acc{display:flex;align-items:center;gap:14px;font-family:var(--releve);font-size:12px;letter-spacing:.13em;text-transform:uppercase;color:var(--acc);line-height:1.4}
.acc:before{content:'';flex:0 0 22px;height:1px;background:currentColor}

/* ---------- Structure ---------- */
.wrap{width:100%;max-width:calc(var(--maxw) + 2*var(--gutter));margin-inline:auto;padding-inline:var(--gutter)}
.band{padding-block:var(--band)}
.band + .band.same{padding-top:0}
.lay{display:grid;grid-template-columns:var(--margin-col) var(--main-col);column-gap:clamp(24px,4vw,72px);row-gap:28px}
.lay>*{min-width:0}
.lay__margin{position:relative}
.lay__margin .acc{position:sticky;top:120px}
.lay__main{display:grid;gap:clamp(28px,3.4vw,48px);align-content:start}
.split{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(28px,5vw,80px);align-items:start}
.split:has(> .h2:first-child){grid-template-columns:minmax(0,1fr);gap:24px}
.split:has(> .h2:first-child)>.h2{max-width:17em}
.split:has(> .h2:first-child)>.lead,.split:has(> .h2:first-child)>.prose{max-width:40em}
.rule-top{border-top:1px solid var(--rule)}

/* ---------- Boutons et liens ---------- */
.btn{display:inline-flex;align-items:center;gap:40px;min-height:54px;padding:15px 24px;font-size:14px;font-weight:500;letter-spacing:.01em;background:var(--fg);color:var(--bg);transition:background .3s var(--ease),color .3s var(--ease)}
.btn:hover{background:var(--acc);color:var(--bg)}
.t-ivoire .btn:hover,.t-papier .btn:hover{color:var(--ivoire)}
.btn__line{width:24px;height:1px;background:currentColor;transition:width .35s var(--ease)}
.btn:hover .btn__line{width:40px}
.link{display:inline-flex;align-items:center;gap:14px;font-size:14px;font-weight:500;color:var(--fg);padding-block:8px;position:relative}
.link:after{content:'';position:absolute;left:0;bottom:2px;width:100%;height:1px;background:var(--rule);transform-origin:left}
.link:before{content:'';position:absolute;left:0;bottom:2px;width:100%;height:1px;background:var(--acc);transform:scaleX(0);transform-origin:left;transition:transform .45s var(--ease);z-index:1}
.link:hover:before{transform:scaleX(1)}
.actions{display:flex;flex-wrap:wrap;align-items:center;gap:18px 34px}

/* ---------- En-tête ---------- */
.hdr{position:sticky;top:env(safe-area-inset-top,0px);z-index:50;background:rgba(17,18,16,.94);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);color:var(--ivoire)}
.hdr__in{height:84px;display:flex;align-items:center;justify-content:space-between;gap:28px;border-bottom:1px solid rgba(183,160,121,.2)}
.brand{display:block;width:clamp(150px,13vw,176px);flex:0 0 auto}
.brand svg{width:100%;height:auto}
.lg-mono{fill:var(--or)}.lg-type{fill:var(--ivoire)}
.nav{display:flex;gap:clamp(18px,2.3vw,36px);font-size:14px}
.nav a{position:relative;padding-block:8px;color:#d9d7cf;transition:color .25s}
.nav a:hover,.nav a[aria-current="page"]{color:var(--ivoire)}
.nav a:after{content:'';position:absolute;left:0;bottom:0;height:1px;width:22px;background:var(--or);transform:scaleX(0);transform-origin:left;transition:transform .35s var(--ease)}
.nav a:hover:after,.nav a[aria-current="page"]:after{transform:scaleX(1)}
.hdr__cta{font-size:14px;font-weight:500;display:inline-flex;align-items:center;gap:14px;padding:11px 0 11px 22px;border-left:1px solid rgba(183,160,121,.28)}
.hdr__cta span{width:18px;height:1px;background:var(--or);transition:width .3s var(--ease)}
.hdr__cta:hover span{width:30px}
.menu-btn{display:none;align-items:center;gap:12px;font-size:14px;padding:10px 0}
.menu-btn i{display:grid;gap:5px;width:22px}
.menu-btn i:before,.menu-btn i:after{content:'';height:1px;background:var(--or);transition:transform .3s var(--ease)}
.menu-btn[aria-expanded="true"] i:before{transform:translateY(3px) rotate(45deg)}
.menu-btn[aria-expanded="true"] i:after{transform:translateY(-3px) rotate(-45deg)}
.drawer{position:fixed;inset:84px 0 0 0;z-index:49;background:var(--encre);color:var(--ivoire);padding:36px var(--gutter) 40px;display:flex;flex-direction:column;justify-content:space-between;overflow-y:auto}
.drawer nav{display:grid}
.drawer nav a{font-size:clamp(28px,7vw,40px);letter-spacing:-.04em;padding:12px 0;border-bottom:1px solid var(--rule-soft);display:flex;justify-content:space-between;align-items:baseline}
.drawer nav a span{font-family:var(--releve);font-size:11px;letter-spacing:.13em;color:var(--or)}
.drawer nav a[aria-current="page"]{color:var(--or)}
.drawer__foot{margin-top:40px;display:grid;gap:8px;color:var(--pierre);font-size:14px}

/* ---------- Héros de l'accueil ---------- */
.hero{position:relative;overflow:hidden;background:var(--encre)}
.hero__stage{position:relative;display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);min-height:min(78vw,760px)}
.hero__copy{position:relative;z-index:2;padding-block:clamp(56px,8vw,120px) clamp(40px,5vw,72px);display:grid;align-content:center;gap:30px;grid-column:1/2;grid-row:1}
.hero__copy .h1{width:max-content;max-width:min(11.5em,64vw)}
.hero__copy .h1 em{display:block;margin-top:.08em}
.hero__copy .lead{color:#cfcdc4;max-width:30em;font-size:clamp(17px,1.35vw,19px)}
.hero__media{grid-column:1/-1;grid-row:1;position:relative;margin-left:auto;width:72%;align-self:center}
.frame{position:relative;aspect-ratio:3/2;max-width:100%}
.frame picture,.frame img{width:100%;height:100%;object-fit:cover}
.hero__media .frame:after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,var(--encre) 0%,rgba(17,18,16,0) 14%),linear-gradient(90deg,var(--encre) 0%,rgba(17,18,16,.55) 22%,rgba(17,18,16,0) 46%),linear-gradient(0deg,rgba(17,18,16,.7) 0%,rgba(17,18,16,0) 30%);pointer-events:none}
/* Les repères de visée, posés sur le seuil éclairé */
.sight{position:absolute;z-index:2;pointer-events:none}
.sight i{position:absolute;width:20px;height:20px;border-color:var(--or);border-style:solid;border-width:0}
.sight i:nth-child(1){left:0;top:0;border-left-width:1px;border-top-width:1px}
.sight i:nth-child(2){right:0;top:0;border-right-width:1px;border-top-width:1px}
.sight i:nth-child(3){right:0;bottom:0;border-right-width:1px;border-bottom-width:1px}
.sight i:nth-child(4){left:0;bottom:0;border-left-width:1px;border-bottom-width:1px}
.hero .sight{left:58%;top:6%;width:17.5%;height:66%}
.sight__label{position:absolute;left:calc(100% + 14px);top:0;font-family:var(--releve);font-size:11px;letter-spacing:.12em;color:var(--or);white-space:nowrap;text-transform:uppercase}
.sight__label b{display:block;font-weight:400;color:var(--pierre)}
.img-note{position:absolute;right:12px;bottom:10px;z-index:2;font-size:11px;color:rgba(240,238,230,.55);letter-spacing:.02em}
.hero__base{position:relative;z-index:2;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid var(--rule)}
.hero__base li{padding:24px 24px 30px 0;display:grid;gap:4px}
.hero__base li+li{padding-left:24px;border-left:1px solid var(--rule)}
.hero__base b{font-weight:500;font-size:15px;letter-spacing:.01em}
.hero__base span{font-family:var(--intuition);font-style:italic;font-size:21px;color:var(--or);line-height:1.2}
/* Une seule séquence d'ouverture : les repères se resserrent sur le seuil, le titre se pose. */
@media (prefers-reduced-motion:no-preference){
  .js .hero .sight{animation:sight-in 1.6s .35s var(--ease) both}
  .js .hero .sight__label{animation:fade 1s 1.6s both}
  .js .hero__copy .h1 em{animation:rise 1.2s .9s var(--ease) both}
  .js .hero .frame img{animation:dawn 2.4s var(--ease) both}
}
@keyframes sight-in{from{transform:scale(1.55);opacity:0}to{transform:none;opacity:1}}
@keyframes fade{from{opacity:0}to{opacity:1}}
@keyframes rise{from{opacity:0;transform:translateY(.25em)}to{opacity:1;transform:none}}
@keyframes dawn{from{opacity:.25;filter:brightness(.6)}to{opacity:1;filter:none}}

/* ---------- Héros des pages intérieures ---------- */
.phero{padding-block:clamp(56px,8vw,112px) clamp(56px,7vw,96px)}
.phero .lay__main{gap:30px}
.phero .h1{max-width:13em}
.phero__img{margin-top:clamp(40px,6vw,80px);position:relative}
.phero__img .frame{aspect-ratio:21/8}
.phero__img .frame:after{content:'';position:absolute;inset:0;background:linear-gradient(0deg,rgba(17,18,16,.35),rgba(17,18,16,0) 50%);pointer-events:none}
.phero__img .sight{inset:-12px}

/* ---------- Le constat : grille vs parcours ---------- */
.versus{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));border-top:1px solid var(--rule)}
.versus>div{padding:28px 32px 8px 0;display:grid;gap:18px;align-content:start}
.versus>div+div{padding-left:32px;border-left:1px solid var(--rule)}
.versus h3{font-size:15px;font-weight:500;display:flex;align-items:center;gap:12px}
.versus>div:first-child h3{color:var(--fg2)}
.versus ul{display:grid;gap:0}
.versus li{padding:14px 0;border-top:1px solid var(--rule-soft);font-size:16px;line-height:1.55}
.versus>div:first-child li{color:var(--fg2)}
.grid-icon,.path-icon{width:44px;height:20px;flex:0 0 auto}

/* ---------- Le relevé interactif ---------- */
.rel{border:1px solid var(--rule);background:linear-gradient(180deg,rgba(240,238,230,.025),rgba(240,238,230,0))}
.rel__head{display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px 24px;padding:18px 28px;border-bottom:1px solid var(--rule);font-family:var(--releve);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--pierre)}
.rel__head b{font-weight:400;color:var(--or)}
.track{position:relative;display:grid;grid-template-columns:auto minmax(0,1fr) auto minmax(0,1fr) auto minmax(0,1fr) auto;align-items:start;padding:44px 28px 36px}
.mo{display:grid;justify-items:center;text-align:center;gap:12px;width:clamp(96px,10vw,140px)}
.mo__dot{width:13px;height:13px;border-radius:50%;border:1px solid var(--or);background:var(--encre);margin-top:6px}
.mo__tc{font-family:var(--releve);font-size:12px;color:var(--or);letter-spacing:.04em;order:-1;height:18px}
.mo__name{font-size:14px;line-height:1.35;color:var(--ivoire)}
.tr{position:relative;display:grid;justify-items:center;padding-top:0;margin-inline:-14px;color:var(--pierre);text-align:center}
.tr__lab{font-family:var(--intuition);font-style:italic;font-size:22px;line-height:18px;height:18px;transition:color .3s}
.tr__line{position:relative;width:100%;height:7px;margin-top:21px;border-top:1px solid rgba(183,160,121,.45);border-bottom:1px solid rgba(183,160,121,.45);transform-origin:left;transition:border-color .3s}
.tr__line:after{content:'';position:absolute;inset:-1px 0;background:var(--or);transform:scaleX(0);transform-origin:left;transition:transform .7s var(--ease);opacity:.9}
.tr__dur{margin-top:12px;font-family:var(--releve);font-size:11px;letter-spacing:.06em;color:var(--pierre)}
.tr:hover .tr__lab{color:var(--ivoire)}
.tr[aria-selected="true"] .tr__lab{color:var(--or)}
.tr[aria-selected="true"] .tr__line:after{transform:scaleX(1)}
.tr:focus-visible{outline-offset:8px}
.rel__panel{border-top:1px solid var(--rule);display:grid;grid-template-columns:minmax(0,3fr) minmax(0,9fr)}
.rel__intro{padding:28px;border-right:1px solid var(--rule);display:grid;gap:14px;align-content:start}
.rel__intro .tc{color:var(--or);font-size:13px}
.rel__intro h3{font-size:19px;letter-spacing:-.02em;line-height:1.25;font-weight:400}
.rel__nav{display:flex;gap:18px;margin-top:8px}
.rel__nav button{font-size:13px;color:var(--pierre);padding:6px 0;border-bottom:1px solid transparent}
.rel__nav button:hover{color:var(--ivoire);border-color:var(--or)}
.rel__nav button[disabled]{opacity:.3;pointer-events:none}
.levels{display:grid}
.levels>div{display:grid;grid-template-columns:120px minmax(0,1fr);gap:20px;padding:18px 28px;border-bottom:1px solid var(--rule-soft)}
.levels>div:last-child{border-bottom:0}
.levels dt{font-family:var(--releve);font-size:11px;letter-spacing:.13em;text-transform:uppercase;color:var(--pierre);padding-top:5px}
.levels dd{font-size:16px;line-height:1.6;color:#d6d4cb}
.levels>div:last-child dt{color:var(--or)}
.levels>div:last-child dd{font-family:var(--intuition);font-style:italic;font-size:22px;line-height:1.4;color:var(--ivoire)}
.rel__panel[data-switching] .levels dd{opacity:0;transform:translateY(4px)}
.levels dd{transition:opacity .35s var(--ease),transform .35s var(--ease)}
.rel__foot{padding:16px 28px;border-top:1px solid var(--rule);font-size:13px;color:var(--pierre);line-height:1.6}

/* ---------- Index des expertises ---------- */
.index{border-top:1px solid var(--rule)}
.index a{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr) auto;gap:24px 40px;align-items:baseline;padding:34px 0;border-bottom:1px solid var(--rule);transition:padding .45s var(--ease)}
.index h3{font-size:clamp(26px,2.8vw,40px);letter-spacing:-.04em;line-height:1.1;font-weight:400}
.index p{color:var(--fg2);max-width:30em}
.index .go{width:44px;height:1px;background:var(--acc);align-self:center;transition:width .4s var(--ease)}
.index a:hover{padding-left:14px}
.index a:hover .go{width:70px}

/* ---------- Protocole de restitution (I, II, III) ---------- */
.board{border:1px solid var(--rule);background:radial-gradient(ellipse at 50% 0%,#24241d 0%,var(--ombre) 70%)}
.board__top,.board__bot{display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px 24px;padding:18px 28px;font-family:var(--releve);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--pierre)}
.board__top{border-bottom:1px solid var(--rule)}
.board__top b,.board__bot b{font-weight:400;color:var(--or)}
.board__bot{border-top:1px solid var(--rule)}
.proto{display:grid;grid-template-columns:minmax(0,1fr) minmax(36px,90px) minmax(0,1fr) minmax(36px,90px) minmax(0,1fr);align-items:center;padding:clamp(36px,5vw,60px) 28px;text-align:center}
.proto__step{display:grid;gap:18px;justify-items:center}
.proto__n{font-family:var(--releve);font-size:12px;color:var(--or)}
.proto__step p{font-size:clamp(19px,1.8vw,25px);line-height:1.35;letter-spacing:-.02em}
.proto__step em{display:block;font-family:var(--intuition);font-style:italic;color:var(--or);font-size:1.55em;line-height:1.15}
.proto__cap{font-family:var(--releve);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--pierre)}
.proto__link{position:relative;height:7px;border-top:1px solid var(--rule);border-bottom:1px solid var(--rule)}
.proto__link:before{content:'';position:absolute;left:0;top:-4px;width:9px;height:9px;margin-left:-4px;border:1px solid var(--or);border-radius:50%;background:var(--encre)}
@media (prefers-reduced-motion:no-preference){
  .proto__link:before{animation:traverse 5.2s ease-in-out infinite}
  .proto__link.second:before{animation-delay:2.6s}
}
@keyframes traverse{0%,15%{left:0;opacity:0}30%{opacity:1}80%{left:100%;opacity:1}100%{left:100%;opacity:0}}

/* ---------- Pour qui ---------- */
.aud{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid var(--rule)}
.aud>div{padding:30px 32px 10px 0;display:grid;gap:14px;align-content:start}
.aud>div+div{padding-left:32px;border-left:1px solid var(--rule)}
.aud h3{font-size:20px;font-weight:500;letter-spacing:-.02em}
.aud p{color:var(--fg2);font-size:15.5px}
.aud .q{font-family:var(--intuition);font-style:italic;font-size:22px;line-height:1.3;color:var(--acc)}

/* ---------- Citation / engagement ---------- */
.quote{font-size:clamp(28px,3.2vw,46px);line-height:1.15;letter-spacing:-.04em;max-width:20em;text-wrap:balance}
.quote em{display:inline}
.pledges{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid var(--rule)}
.pledges li{padding:22px 24px 0 0;display:flex;gap:14px;align-items:baseline;font-size:16px}
.pledges li+li{padding-left:24px;border-left:1px solid var(--rule)}
.pledges li:before{content:'×';color:var(--acc);font-size:18px}

/* ---------- Bandeau contact ---------- */
.cta-band .lay__main{gap:36px}
.cta-band .h2 em{display:block}
.mail{font-family:var(--releve);font-size:14px;letter-spacing:.04em;color:var(--fg2)}
.mail a{color:var(--fg);border-bottom:1px solid var(--rule)}
.mail a:hover{border-color:var(--acc)}

/* ---------- Parcours continu (approche) ---------- */
.journey{border:1px solid var(--rule);padding:clamp(22px,3vw,34px)}
.journey__head{display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px 20px;font-family:var(--releve);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--fg2)}
.journey__head b{font-weight:400;color:var(--acc)}
.jline{display:grid;grid-template-columns:auto minmax(0,1fr) auto minmax(0,1fr) auto;align-items:start;margin:54px 0 40px}
.jpt{display:grid;justify-items:center;gap:18px;width:clamp(96px,11vw,150px);text-align:center;font-size:15px;line-height:1.35}
.jpt i{width:13px;height:13px;border-radius:50%;border:1px solid var(--acc);background:var(--bg);margin-top:28px}
.jbt{display:grid;justify-items:center;margin-inline:-16px}
.jbt span{font-family:var(--intuition);font-style:italic;font-size:23px;color:var(--acc);line-height:20px;height:20px}
.jbt b{position:relative;display:block;width:100%;height:7px;margin-top:20px;border-top:1px solid var(--acc);border-bottom:1px solid var(--acc);overflow:hidden;opacity:.8}
.jbt b:after{content:'';position:absolute;top:0;bottom:0;width:30%;background:linear-gradient(90deg,transparent,var(--acc),transparent);left:-30%}
@media (prefers-reduced-motion:no-preference){.jbt b:after{animation:pass 4.5s ease-in-out infinite}.jbt.second b:after{animation-delay:2.25s}}
@keyframes pass{0%{left:-30%}60%,100%{left:100%}}
.journey__foot{display:flex;flex-wrap:wrap;gap:8px 28px;align-items:baseline;padding-top:20px;border-top:1px solid var(--rule-soft)}
.journey__foot .releve{color:var(--acc);font-size:11px}
.journey__foot p{font-size:15px;color:var(--fg2)}

/* ---------- Le regard NVI ---------- */
.years{display:flex;gap:22px;align-items:flex-end}
.years__n{font-family:var(--intuition);font-weight:500;font-size:clamp(88px,10vw,140px);line-height:.8;color:var(--acc);letter-spacing:-.04em}
.years__n sup{font-size:.45em;vertical-align:top;position:relative;top:.1em}
.years p{font-size:15px;line-height:1.5;color:var(--fg2);max-width:15em;padding-bottom:6px}
.years p b{display:block;color:var(--fg);font-weight:500}
.idx{border-top:1px solid var(--rule)}
.idx li{display:grid;grid-template-columns:44px minmax(0,1fr);gap:12px;padding:15px 0;border-bottom:1px solid var(--rule);font-size:17px;line-height:1.45}
.idx li span{font-family:var(--releve);font-size:12px;color:var(--acc);padding-top:4px}
.idx li small{display:block;color:var(--fg2);font-size:14.5px;margin-top:4px}

/* ---------- Moments observés ---------- */
.moments{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;border-top:1px solid var(--rule)}
.moments li{padding:22px 22px 24px 0;border-bottom:1px solid var(--rule);display:grid;gap:6px}
.moments li:not(:nth-child(3n+1)){padding-left:22px;border-left:1px solid var(--rule)}
.moments b{font-weight:500;font-size:17px;letter-spacing:-.01em}
.moments span{color:var(--fg2);font-size:15px;line-height:1.55}

/* ---------- Niveaux de lecture (méthode) ---------- */
.ladder{border-top:1px solid var(--rule)}
.ladder details{border-bottom:1px solid var(--rule)}
.ladder summary{list-style:none;display:grid;grid-template-columns:52px minmax(0,4fr) minmax(0,6fr) 24px;gap:20px;align-items:baseline;padding:26px 0;cursor:pointer}
.ladder summary::-webkit-details-marker{display:none}
.ladder .n{font-family:var(--releve);font-size:12px;color:var(--acc)}
.ladder h3{font-size:clamp(30px,3vw,44px);letter-spacing:-.045em;line-height:1;font-weight:400}
.ladder details[open] h3{font-family:var(--intuition);font-style:italic;color:var(--acc);letter-spacing:-.02em;font-size:clamp(34px,3.4vw,50px)}
.ladder .def{color:var(--fg2);font-size:16px}
.ladder .pm{width:16px;height:16px;position:relative;align-self:center}
.ladder .pm:before,.ladder .pm:after{content:'';position:absolute;left:0;right:0;top:50%;height:1px;background:var(--acc);transition:transform .3s var(--ease)}
.ladder .pm:after{transform:rotate(90deg)}
.ladder details[open] .pm:after{transform:rotate(0)}
.ladder__body{display:grid;grid-template-columns:52px minmax(0,4fr) minmax(0,6fr) 24px;gap:20px;padding:0 0 30px}
.ladder__body .verb{grid-column:2;font-family:var(--releve);font-size:11px;letter-spacing:.13em;color:var(--fg2);text-transform:uppercase;padding-top:6px}
.ladder__body .ex{grid-column:3;border-left:1px solid var(--acc);padding-left:20px;display:grid;gap:6px}
.ladder__body .ex small{font-family:var(--releve);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--fg2)}
.ladder__body .ex p{font-size:17px;line-height:1.55}

/* ---------- Déroulé d'une mission ---------- */
.steps{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));border-top:1px solid var(--rule);counter-reset:s}
.steps li{position:relative;padding:34px 22px 10px 0;display:grid;gap:12px;align-content:start}
.steps li+li{padding-left:22px}
.steps li:before{content:'';position:absolute;top:-5px;left:0;width:9px;height:9px;border-radius:50%;border:1px solid var(--acc);background:var(--bg)}
.steps li+li:before{left:22px}
.steps .n{font-family:var(--releve);font-size:12px;color:var(--acc)}
.steps h3{font-size:19px;font-weight:500;letter-spacing:-.015em;line-height:1.25}
.steps p{font-size:15px;line-height:1.6;color:var(--fg2)}

/* ---------- Plan de reconstitution ---------- */
.plan{border:1px solid var(--rule);background:var(--encre)}
.plan svg{width:100%;height:auto}
.plan__cap{display:flex;justify-content:space-between;flex-wrap:wrap;gap:6px 20px;padding:14px 22px;border-top:1px solid var(--rule);font-size:13px;color:var(--pierre)}
.plan__cap b{font-family:var(--releve);font-weight:400;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--or)}
.strip{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid var(--rule);border-bottom:1px solid var(--rule)}
.strip li{padding:22px 20px 22px 0;display:flex;gap:14px;align-items:baseline;font-size:17px;letter-spacing:-.01em}
.strip li+li{padding-left:20px;border-left:1px solid var(--rule)}
.strip li:before{content:'';flex:0 0 22px;height:1px;background:var(--acc);transform:translateY(-5px)}
.whenwhen{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(28px,5vw,72px)}
.whenwhen h3{font-size:17px;font-weight:500;margin-bottom:10px}
.whenwhen ul{border-top:1px solid var(--rule)}
.whenwhen li{padding:13px 0;border-bottom:1px solid var(--rule-soft);color:var(--fg2);font-size:16px;line-height:1.55}

/* ---------- Livrables ---------- */
.deliv{border-top:1px solid var(--rule)}
.deliv li{display:grid;grid-template-columns:52px minmax(0,4fr) minmax(0,6fr);gap:20px;padding:24px 0;border-bottom:1px solid var(--rule);align-items:baseline}
.deliv .n{font-family:var(--releve);font-size:12px;color:var(--acc)}
.deliv h3{font-size:20px;font-weight:500;letter-spacing:-.02em;line-height:1.3}
.deliv p{color:var(--fg2)}
.essentiel{font-size:clamp(24px,2.5vw,34px);line-height:1.3;letter-spacing:-.03em;max-width:24em}
.essentiel em{font-family:var(--intuition);font-style:italic;color:var(--acc);font-size:1.12em;display:block}

/* ---------- Profils détaillés ---------- */
.profiles{display:grid;border-top:1px solid var(--rule)}
.profiles article{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,6fr);gap:20px 48px;padding:36px 0;border-bottom:1px solid var(--rule)}
.profiles h3{font-size:clamp(24px,2.3vw,32px);letter-spacing:-.035em;line-height:1.15;font-weight:400}
.profiles .who{font-family:var(--releve);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--fg2);margin-top:12px;display:block}
.profiles ul{display:grid;gap:8px;margin-top:6px}
.profiles li{padding-left:22px;position:relative;color:var(--fg2);line-height:1.6}
.profiles li:before{content:'';position:absolute;left:0;top:.8em;width:12px;height:1px;background:var(--acc)}
.profiles p{line-height:1.7}

/* ---------- Engagements ---------- */
.nots{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));border-top:1px solid var(--rule)}
.nots li{padding:26px 28px 26px 0;border-bottom:1px solid var(--rule);display:grid;gap:8px}
.nots li:nth-child(even){padding-left:28px;border-left:1px solid var(--rule)}
.nots b{font-weight:400;font-size:clamp(20px,1.8vw,25px);letter-spacing:-.025em;line-height:1.25;display:flex;gap:14px;align-items:baseline}
.nots b:before{content:'×';color:var(--acc);font-size:.9em}
.nots span{color:var(--fg2);font-size:15.5px;padding-left:28px}
.vocab{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(24px,4vw,56px)}
.vocab h3{font-family:var(--releve);font-size:11px;font-weight:400;letter-spacing:.13em;text-transform:uppercase;color:var(--fg2);margin-bottom:12px}
.vocab p{font-size:clamp(20px,1.8vw,24px);line-height:1.5;letter-spacing:-.02em}
.vocab .no p{color:var(--fg2);text-decoration:line-through;text-decoration-color:var(--acc);text-decoration-thickness:1px}

/* ---------- Contact ---------- */
.form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:26px 32px}
.field{display:grid;gap:8px}
.field.full{grid-column:1/-1}
.field label,.field legend{font-size:13px;font-weight:500;color:var(--fg)}
.field label small{font-weight:400;color:var(--fg2)}
.field input,.field select,.field textarea{width:100%;background:transparent;border:0;border-bottom:1px solid var(--rule);padding:10px 0 12px;font-size:17px;color:var(--fg);border-radius:0;transition:border-color .25s}
.field textarea{min-height:140px;resize:vertical;line-height:1.6}
.field select{appearance:none;-webkit-appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--acc) 50%),linear-gradient(135deg,var(--acc) 50%,transparent 50%);background-position:calc(100% - 12px) 55%,calc(100% - 7px) 55%;background-size:5px 5px;background-repeat:no-repeat}
.field select option{background:var(--ivoire);color:var(--encre)}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-bottom-color:var(--acc)}
.field input:focus-visible,.field select:focus-visible,.field textarea:focus-visible{box-shadow:0 1px 0 0 var(--acc)}
.field input::placeholder,.field textarea::placeholder{color:var(--fg2);opacity:.7}
.chips{display:flex;flex-wrap:wrap;gap:10px;border:0;padding:0;margin:0}
.chips legend{margin-bottom:12px;padding:0}
.chips label{position:relative}
.chips input{position:absolute;opacity:0;inset:0;cursor:pointer}
.chips span{display:inline-block;padding:9px 16px;border:1px solid var(--rule);font-size:14px;transition:background .25s,color .25s,border-color .25s}
.chips input:checked+span{background:var(--fg);color:var(--bg);border-color:var(--fg)}
.chips input:focus-visible+span{outline:2px solid var(--acc);outline-offset:3px}
.form__foot{grid-column:1/-1;display:flex;flex-wrap:wrap;align-items:center;gap:16px 32px;margin-top:6px}
.form__note{font-size:13.5px;color:var(--fg2);max-width:34em;line-height:1.6}
.form__status{grid-column:1/-1;font-size:15px;padding:14px 18px;border-left:1px solid var(--acc);background:rgba(135,107,62,.07)}
.form__status[data-kind="error"]{border-color:#9b3b2e}
.side{display:grid;gap:28px;align-content:start}
.side dl{display:grid;gap:18px}
.side dt{font-family:var(--releve);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--acc)}
.side dd{font-size:16px;margin-top:4px}
.side dd a{border-bottom:1px solid var(--rule)}
.side dd a:hover{border-color:var(--acc)}
.copy-btn{font-size:12.5px;color:var(--fg2);margin-left:10px;border-bottom:1px solid transparent}
.copy-btn:hover{color:var(--fg);border-color:var(--acc)}

/* ---------- Mentions légales ---------- */
.legal{max-width:44em;display:grid;gap:44px}
.legal section{display:grid;gap:12px}
.legal h2{font-size:24px;letter-spacing:-.025em;font-weight:500}
.legal p{color:var(--fg2)}
.legal p strong{color:var(--fg);font-weight:500}
.todo{background:rgba(135,107,62,.14);color:var(--fg);padding:1px 6px;font-family:var(--releve);font-size:.86em;letter-spacing:.02em}

/* ---------- Pied de page ---------- */
.ftr{background:var(--encre);color:var(--ivoire);padding-block:72px 32px;border-top:1px solid rgba(183,160,121,.2)}
.ftr__grid{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,3fr) minmax(0,3fr) minmax(0,2fr);gap:40px}
.ftr .brand{width:170px}
.ftr__tag{margin-top:26px;font-size:15px;line-height:1.6;color:var(--pierre)}
.ftr__tag em{font-family:var(--intuition);font-style:italic;color:var(--or);font-size:1.15em}
.ftr h2{font-family:var(--releve);font-size:11px;letter-spacing:.13em;text-transform:uppercase;font-weight:400;color:var(--or);margin-bottom:16px}
.ftr nav{display:grid;gap:6px;font-size:14.5px}
.ftr nav a{color:#d6d4cb}
.ftr nav a:hover{color:var(--ivoire)}
.ftr__base{margin-top:64px;padding-top:22px;border-top:1px solid rgba(183,160,121,.2);display:flex;flex-wrap:wrap;justify-content:space-between;gap:10px 28px;font-size:12.5px;color:var(--pierre)}
.ftr__base a:hover{color:var(--ivoire)}

/* ---------- 404 ---------- */
.lost{min-height:62vh;display:grid;align-content:center}

/* ---------- Responsive ---------- */
@media (max-width:1100px){
  .nav{gap:18px;font-size:13.5px}
  .hdr__cta{display:none}
  .steps{grid-template-columns:repeat(3,minmax(0,1fr));row-gap:10px}
  .steps li:nth-child(4){padding-left:0}.steps li:nth-child(4):before{left:0}
  .ftr__grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:980px){
  .nav{display:none}
  .menu-btn{display:inline-flex}
  .lay{grid-template-columns:minmax(0,1fr)}
  .lay__margin .acc{position:static}
  .hero__stage{grid-template-columns:minmax(0,1fr);min-height:0}
  .hero__copy{grid-column:1;grid-row:1;padding-bottom:0}
  .hero__copy .h1{width:auto;max-width:12em}
  .hero__media{grid-column:1;grid-row:2;width:calc(100% + var(--gutter));margin-right:calc(-1 * var(--gutter));margin-top:28px}
  .hero__media .frame:after{background:linear-gradient(0deg,rgba(17,18,16,.6) 0%,rgba(17,18,16,0) 35%),linear-gradient(90deg,rgba(17,18,16,.5),rgba(17,18,16,0) 30%)}
  .rel__panel{grid-template-columns:minmax(0,1fr)}
  .rel__intro{border-right:0;border-bottom:1px solid var(--rule)}
  .aud{grid-template-columns:minmax(0,1fr)}
  .aud>div,.aud>div+div{padding:26px 0;border-left:0}
  .aud>div+div{border-top:1px solid var(--rule)}
  .moments{grid-template-columns:repeat(2,minmax(0,1fr))}
  .moments li:not(:nth-child(3n+1)){padding-left:0;border-left:0}
  .moments li:nth-child(even){padding-left:22px;border-left:1px solid var(--rule)}
}
@media (max-width:760px){
  body{font-size:16px}
  .hdr__in{height:72px}
  .drawer{inset:72px 0 0 0}
  .brand{width:148px}
  .hero__base{grid-template-columns:minmax(0,1fr)}
  .hero__base li,.hero__base li+li{padding:16px 0;border-left:0;grid-template-columns:auto 1fr;gap:12px;align-items:baseline}
  .hero__base li+li{border-top:1px solid var(--rule)}
  .sight__label{display:none}
  .split,.split:has(> .h2:first-child),.versus,.whenwhen,.vocab,.nots,.form,.pledges,.strip{grid-template-columns:minmax(0,1fr)}
  .versus>div,.versus>div+div{padding:24px 0 6px;border-left:0}
  .versus>div+div{border-top:1px solid var(--rule)}
  .pledges li,.pledges li+li{padding:16px 0;border-left:0}
  .pledges li+li{border-top:1px solid var(--rule)}
  .strip li,.strip li+li{padding:16px 0;border-left:0}
  .strip li+li{border-top:1px solid var(--rule)}
  .nots li,.nots li:nth-child(even){padding:22px 0;border-left:0}
  /* Le relevé passe à la verticale */
  .track{grid-template-columns:minmax(0,1fr);padding:28px 22px;justify-items:stretch}
  .mo{width:auto;grid-template-columns:62px 13px minmax(0,1fr);justify-items:start;text-align:left;gap:14px;align-items:center}
  .mo__tc{order:0;height:auto}
  .mo__dot{margin-top:0}
  .tr{margin:0;grid-template-columns:62px 13px minmax(0,1fr);justify-items:start;text-align:left;column-gap:14px;align-items:center;padding-block:6px}
  .tr__line{grid-column:2;grid-row:1/3;width:7px;height:56px;margin:0 3px;border:0;border-left:1px solid rgba(183,160,121,.45);border-right:1px solid rgba(183,160,121,.45)}
  .tr__line:after{inset:0 -1px;transform:scaleY(0);transform-origin:top}
  .tr[aria-selected="true"] .tr__line:after{transform:scaleY(1)}
  .tr__lab{grid-column:3;grid-row:1;height:auto;line-height:1.2}
  .tr__dur{grid-column:3;grid-row:2;margin-top:2px}
  .levels>div{grid-template-columns:minmax(0,1fr);gap:6px;padding:16px 22px}
  .rel__intro,.rel__foot,.rel__head{padding-inline:22px}
  .proto{grid-template-columns:minmax(0,1fr);gap:8px;padding-block:36px}
  .proto__link{width:7px;height:44px;margin:6px auto;border:0;border-left:1px solid var(--rule);border-right:1px solid var(--rule)}
  .proto__link:before{left:-5px;top:0;margin:0;animation-name:traverse-v}
  .jline{grid-template-columns:minmax(0,1fr);justify-items:start;margin:30px 0 24px}
  .jpt{grid-template-columns:13px auto;width:auto;justify-items:start;text-align:left;gap:18px;align-items:center}
  .jpt i{margin:0}
  .jbt{margin:0;grid-template-columns:13px auto;column-gap:18px;justify-items:start;align-items:center}
  .jbt b{grid-column:1;grid-row:1;width:7px;height:62px;margin:0 3px;border:0;border-left:1px solid var(--acc);border-right:1px solid var(--acc)}
  .jbt b:after{width:auto;height:30%;left:0;right:0;top:-30%;background:linear-gradient(180deg,transparent,var(--acc),transparent);animation-name:pass-v}
  .jbt span{grid-column:2;grid-row:1;height:auto}
  .ladder summary,.ladder__body{grid-template-columns:36px minmax(0,1fr) 20px;gap:12px}
  .ladder .def{grid-column:2;grid-row:2}
  .ladder .pm{grid-column:3;grid-row:1}
  .ladder__body .verb,.ladder__body .ex{grid-column:2}
  .steps{grid-template-columns:minmax(0,1fr);border-top:0;border-left:1px solid var(--rule);margin-left:4px}
  .steps li,.steps li+li{padding:0 0 30px 28px}
  .steps li:before,.steps li+li:before,.steps li:nth-child(4):before{left:-5px;top:6px}
  .deliv li{grid-template-columns:36px minmax(0,1fr);gap:6px 12px}
  .deliv li p{grid-column:2}
  .profiles article{grid-template-columns:minmax(0,1fr)}
  .moments{grid-template-columns:minmax(0,1fr)}
  .moments li:nth-child(even){padding-left:0;border-left:0}
  .index a{grid-template-columns:minmax(0,1fr) auto;padding:26px 0}
  .index p{grid-column:1}
  .index .go{grid-column:2;grid-row:1}
  .phero__img .frame{aspect-ratio:4/3}
  .ftr__grid{grid-template-columns:minmax(0,1fr)}
}
@keyframes traverse-v{0%,15%{top:0;opacity:0}30%{opacity:1}80%{top:100%;opacity:1}100%{top:100%;opacity:0}}
@keyframes pass-v{0%{top:-30%}60%,100%{top:100%}}
@media (prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}html{scroll-behavior:auto}}
.stack{display:grid;gap:36px;align-content:start}
.kicker{margin-bottom:14px}
.narrow{max-width:40em}
@media (max-width:760px){
  .steps li:nth-child(4){padding-left:28px}
  .plan__scroll{overflow-x:auto}
  .plan__scroll svg{min-width:620px}
}

/* ===== v3 : premier écran façon v1 ===== */
.hero1{background:var(--encre);padding-top:clamp(40px,6vw,80px)}
.hero1__grid{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:clamp(36px,7vw,110px);align-items:center}
.hero1__copy{display:grid;gap:26px;align-content:center}
.hero1__copy .h1 em{display:block;margin-top:.06em}
.hero1__ni{font-size:clamp(19px,1.6vw,23px);font-weight:500;letter-spacing:-.02em;color:var(--ivoire);display:flex;align-items:center;gap:16px}
.hero1__ni:before{content:'';flex:0 0 22px;height:1px;background:var(--or)}
.hero1__copy .lead{color:#cfcdc4;max-width:31em;font-size:clamp(16.5px,1.3vw,18.5px)}
.hero1__visual{position:relative;margin-right:10px}
.hero1__visual .frame{aspect-ratio:4/5}
.hero1__visual .frame:after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,rgba(17,18,16,.05) 45%,rgba(17,18,16,.85));pointer-events:none}
.hero1__visual .sight{left:44%;top:7%;width:31%;height:62%}
@media (prefers-reduced-motion:no-preference){.js .hero1__visual .sight{animation:sight-in 1.6s .35s var(--ease) both}.js .hero1__copy .h1 em{animation:rise 1.2s .8s var(--ease) both}}
.hero1__cap{position:absolute;z-index:2;left:24px;right:24px;bottom:34px;display:flex;align-items:center;gap:16px;font-size:19px;line-height:1.3;color:var(--ivoire)}
.hero1__cap i{flex:0 0 28px;height:1px;background:var(--or)}
.hero1__cap em{font-family:var(--intuition);font-style:italic;color:var(--or);font-size:1.3em;display:block}
.pillars{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin-top:clamp(48px,6vw,80px);border-top:1px solid var(--rule)}
.pillars a{display:grid;gap:8px;padding:28px 28px 34px 0;position:relative;transition:background .3s}
.pillars a+a{padding-left:28px;border-left:1px solid var(--rule)}
.pillars .releve{color:var(--or);font-size:11px}
.pillars h2{font-size:17px;font-weight:500;letter-spacing:-.01em}
.pillars p{font-size:14.5px;line-height:1.6;color:var(--pierre);max-width:22em}
.pillars a:after{content:'';position:absolute;left:0;top:-1px;height:1px;width:0;background:var(--or);transition:width .5s var(--ease)}
.pillars a+a:after{left:28px}
.pillars a:hover:after{width:44px}

/* Différence */
.prose--lg{max-width:40em}
.prose--lg p{font-size:clamp(17px,1.35vw,19px);line-height:1.7}
.statement{font-size:clamp(28px,3.2vw,46px);line-height:1.15;letter-spacing:-.04em;max-width:18em;padding:clamp(20px,3vw,36px) 0;border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);text-wrap:balance}
.statement em{font-family:var(--intuition);font-style:italic;font-size:1.12em;color:var(--acc);letter-spacing:-.02em}
.cmp{display:grid;border-top:1px solid var(--rule)}
.cmp__row{display:grid;grid-template-columns:minmax(0,2.2fr) repeat(3,minmax(0,3fr));border-bottom:1px solid var(--rule)}
.cmp__row>span{padding:18px 20px 18px 0;font-size:15.5px;line-height:1.5;color:var(--fg2)}
.cmp__row>span+span{padding-left:20px}
.cmp__row [role=rowheader]{font-family:var(--releve);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--fg2);padding-top:22px}
.cmp__row--head>span{font-size:15px;font-weight:500;color:var(--fg);padding-block:16px}
.cmp__nvi{background:rgba(135,107,62,.08);color:var(--fg)!important;border-left:1px solid var(--acc)}
.cmp__row--head .cmp__nvi{color:var(--acc)!important}

/* Scénarios d'arrivée */
.scen{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(24px,3vw,40px)}
.scen__item{margin:0;display:grid;gap:18px;align-content:start}
.scen__head{display:grid;gap:6px}
.scen__head .releve{color:var(--or);font-size:11px}
.scen__head h3{font-size:clamp(19px,1.6vw,22px);font-weight:400;letter-spacing:-.02em}
.scen__keys{display:grid;border-top:1px solid var(--rule)}
.scen__keys li{display:grid;grid-template-columns:30px minmax(0,1fr);gap:12px;padding:12px 0;border-bottom:1px solid var(--rule-soft);align-items:baseline}
.scen__keys span{display:inline-grid;place-items:center;width:22px;height:22px;border:1px solid var(--or);border-radius:50%;font-family:var(--releve);font-size:11px;color:var(--or)}
.scen__keys p{font-size:15px;line-height:1.55;color:#d6d4cb}
.scen__note{font-size:13px;color:var(--pierre)}

/* Niveaux de lecture (tableau retravaillé) */
.levels4{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-top:1px solid var(--rule);position:relative}
.lv{display:grid;gap:10px;align-content:start;padding:26px 22px 26px 0;position:relative}
.lv+.lv{padding-left:22px;border-left:1px solid var(--rule)}
.lv__n{font-family:var(--releve);font-size:12px;color:var(--acc)}
.lv__verb{font-family:var(--releve);font-size:11px;letter-spacing:.13em;text-transform:uppercase;color:var(--fg2)}
.lv h3{font-size:clamp(26px,2.4vw,34px);font-weight:400;letter-spacing:-.04em;line-height:1.05}
.lv:last-child h3{font-family:var(--intuition);font-style:italic;color:var(--acc);letter-spacing:-.01em}
.lv p{font-size:15px;line-height:1.55;color:var(--fg2)}
.lv .lv__ex{margin-top:6px;padding-top:12px;border-top:1px dashed var(--rule);color:var(--fg);font-size:14.5px}
.lv:before{content:'';position:absolute;top:-4px;left:0;width:7px;height:7px;border-radius:50%;background:var(--bg);border:1px solid var(--acc)}
.lv+.lv:before{left:-4px}

@media (max-width:980px){
  .hero1__grid{grid-template-columns:minmax(0,1fr)}
  .hero1__visual{margin-right:0}
  .hero1__visual{max-width:520px}
  .scen{grid-template-columns:minmax(0,1fr)}
  .levels4{grid-template-columns:repeat(2,minmax(0,1fr))}
  .lv:nth-child(3){padding-left:0;border-left:0}
  .lv:nth-child(3):before{left:0}
  .lv:nth-child(n+3){border-top:1px solid var(--rule)}
}
@media (max-width:760px){
  .pillars{grid-template-columns:minmax(0,1fr)}
  .pillars a,.pillars a+a{padding:22px 0;border-left:0}
  .pillars a+a{border-top:1px solid var(--rule)}
  .pillars a+a:after{left:0}
  .cmp__row--head{display:none}
  .cmp__row{grid-template-columns:minmax(0,1fr);padding:14px 0}
  .cmp__row>span,.cmp__row>span+span{padding:8px 0 8px 0}
  .cmp__row>span[data-l]:before{content:attr(data-l);display:block;font-size:12.5px;font-weight:500;color:var(--fg);margin-bottom:2px}
  .cmp__nvi{padding-left:14px!important}
  .cmp__row>span.cmp__nvi:before{color:var(--acc)}
  .levels4{grid-template-columns:minmax(0,1fr)}
  .lv,.lv+.lv,.lv:nth-child(3){padding:22px 0 22px 22px;border-left:1px solid var(--rule);border-top:0}
  .lv:before,.lv+.lv:before,.lv:nth-child(3):before{left:-4px;top:28px}
  .levels4{border-top:0}
  .hero1__cap{font-size:16px;bottom:22px}
}

/* Page relevé */
.rel-warn{font-size:13.5px;color:var(--pierre);display:flex;gap:12px;align-items:baseline}
.rel-warn:before{content:'';flex:0 0 22px;height:1px;background:var(--or);transform:translateY(-4px)}
.track--static .tr{text-decoration:none}
.track--static .tr .tr__line:after{transform:scaleX(1);opacity:.35}
.track--static .tr:hover .tr__line:after{opacity:.9}
.track--static .tr:hover .tr__lab{color:var(--or)}
.fiches{gap:clamp(40px,5vw,64px)}
.fiche{border:1px solid var(--rule);scroll-margin-top:110px}
.fiche__head{display:flex;flex-wrap:wrap;align-items:baseline;gap:10px 24px;padding:22px 28px;border-bottom:1px solid var(--rule)}
.fiche__n{font-family:var(--releve);font-size:11px;letter-spacing:.12em;color:var(--pierre)}
.fiche__head .tc{color:var(--or);font-size:13px}
.fiche__head h3{font-family:var(--intuition);font-style:italic;font-weight:400;color:var(--or);font-size:clamp(28px,2.6vw,36px);line-height:1;margin-left:auto}
.fiche__ctx{padding:22px 28px;border-bottom:1px solid var(--rule);font-size:clamp(18px,1.5vw,21px);line-height:1.5;letter-spacing:-.015em;max-width:40em}
@media (max-width:760px){
  .fiche__head,.fiche__ctx{padding-inline:20px}
  .fiche__head h3{margin-left:0;width:100%}
  .track--static .tr .tr__line:after{transform:scaleY(1)}
}

.hero1 .h1{font-size:clamp(44px,5.6vw,84px)}
.scen>*,.scen__item>*{min-width:0}.plan{max-width:100%}

.plan__hint{display:none}
@media (max-width:760px){.plan__hint{display:block;font-size:12px;color:var(--pierre);padding:10px 14px 0}.plan__scroll svg{min-width:540px}}

/* ===== v4 ===== */
/* Héros intérieurs avec vignette verticale */
.phero--img .lay__main{grid-template-columns:minmax(0,1fr) minmax(0,300px);column-gap:clamp(32px,6vw,96px);align-items:end}
.phero__txt{display:grid;gap:30px;align-content:start}
.phero__fig{margin:0;display:grid;gap:12px}
.phero__fig .frame{aspect-ratio:4/5}
.phero__fig .sight{inset:-10px}
.phero__fig figcaption{display:grid;gap:2px;font-size:12.5px;color:var(--pierre)}
.phero__fig figcaption span:first-child{font-family:var(--intuition);font-style:italic;font-size:17px;color:var(--or)}
@media (max-width:760px){
  .phero--img .lay__main{grid-template-columns:minmax(0,1fr)}
  .phero__fig{max-width:240px}
}

/* Accueil : un seul scénario, plan plus grand */
.scen--one{grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);align-items:start}
.scen--one .scen__item{display:contents}
.scen--one .scen__head{grid-column:1/-1}
.scen--one .plan{grid-column:1}
.scen--one .scen__keys{grid-column:2;align-self:center}
@media (max-width:980px){.scen--one{grid-template-columns:minmax(0,1fr)}.scen--one .plan,.scen--one .scen__keys{grid-column:1}}

/* Bloc 06 : schéma de la toute première version */
.v1r-title{display:flex;justify-content:space-between;align-items:end;gap:50px}
.v1r-title>p{font-size:15px;line-height:1.7;color:var(--pierre);padding-bottom:4px;flex:0 0 auto}
.v1r-board{padding:26px 34px 22px;border:1px solid var(--rule);background:radial-gradient(ellipse at 50% 0%,#292820 0%,#151611 70%)}
.v1r-top,.v1r-bot{display:flex;justify-content:space-between;gap:20px;font-family:var(--releve);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--or)}
.v1r-top{padding-bottom:20px;border-bottom:1px solid var(--rule)}
.v1r-top>span:last-child{color:#949587}
.v1r-proto{display:grid;grid-template-columns:1fr 70px 1fr 70px 1fr;align-items:center;padding:45px 0 47px;text-align:center}
.v1r-idx{display:block;color:var(--or);font-family:var(--releve);font-size:12px;margin-bottom:24px}
.v1r-proto p{font-size:24px;line-height:1.4;letter-spacing:-.02em}
.v1r-proto em{font-family:var(--intuition);font-style:italic;font-size:39px;color:var(--or);line-height:1.3}
.v1r-cap{font-family:var(--releve);font-size:11px;letter-spacing:.09em;text-transform:uppercase;display:block;margin-top:21px;color:#a4a496}
.v1r-link{height:1px;background:var(--rule);position:relative}
.v1r-link:before{content:'';position:absolute;left:0;top:-3px;width:7px;height:7px;border:1px solid var(--or);border-radius:50%;background:var(--encre)}
@media (prefers-reduced-motion:no-preference){.v1r-link:before{animation:v1-traverse 5s ease-in-out infinite}.v1r-link--2:before{animation-delay:2.5s}}
@keyframes v1-traverse{0%,20%{left:0;opacity:0}35%{opacity:1}80%{left:100%;opacity:1}100%{left:100%;opacity:0}}
.v1r-bot{border-top:1px solid var(--rule);padding-top:20px;color:#b3b3a5}
.v1r-bot>span:first-child{color:var(--or)}
.v1r-copy{display:grid;grid-template-columns:1fr 1fr;gap:13%}
.v1r-copy p{color:#aaad9f;font-size:16px}
.v1r-copy p+p{margin-top:20px}
.v1r-copy strong{color:var(--ivoire);font-weight:500}
.v1r-privacy{display:flex;justify-content:space-between;gap:20px;border-top:1px solid var(--rule);padding-top:24px}
.v1r-privacy span{font-size:14px;color:#c6c6ba;display:flex;align-items:center;gap:12px}
.v1r-privacy span:before{content:'—';color:var(--or)}
@media (max-width:1050px){.v1r-title{align-items:start;gap:35px}.v1r-title>p{max-width:230px}.v1r-proto{grid-template-columns:1fr 35px 1fr 35px 1fr}.v1r-proto p{font-size:21px}.v1r-proto em{font-size:34px}}
@media (max-width:760px){
  .v1r-title{display:block}.v1r-title>p{margin-top:25px;max-width:none;font-size:16px}.v1r-title br{display:none}
  .v1r-board{padding:22px}
  .v1r-top>span:last-child,.v1r-bot>span:last-child{display:none}
  .v1r-proto{grid-template-columns:1fr;padding:29px 0;gap:23px;text-align:left}
  .v1r-proto>div{display:grid;grid-template-columns:30px 1fr;gap:0 14px;align-items:baseline}
  .v1r-idx{margin:0;grid-row:span 2}
  .v1r-proto p{font-size:21px}.v1r-proto p br{display:none}.v1r-proto em{font-size:32px}
  .v1r-cap{margin-top:12px;grid-column:2}
  .v1r-link{width:1px;height:34px;margin-left:8px}.v1r-link:before{display:none}
  .v1r-copy{grid-template-columns:1fr;gap:23px}
  .v1r-privacy{flex-direction:column;gap:16px}
}

/* Reconstitution : déroulé chronologique */
.flow{display:grid;max-width:46em;position:relative}
.flow:before{content:'';position:absolute;left:17px;top:18px;bottom:18px;width:1px;background:var(--rule)}
.flow__step{display:grid;grid-template-columns:36px minmax(0,1fr);gap:24px;padding:0 0 34px}
.flow__step:last-child{padding-bottom:0}
.flow__n{position:relative;z-index:1;display:grid;place-items:center;width:36px;height:36px;border:1px solid var(--acc);border-radius:50%;background:var(--bg);font-family:var(--releve);font-size:13px;color:var(--acc)}
.flow__body{display:grid;gap:8px;padding-top:5px}
.flow__body h3{font-size:clamp(19px,1.6vw,22px);font-weight:500;letter-spacing:-.02em;line-height:1.3}
.flow__body p{color:var(--fg2);font-size:16px;line-height:1.6}
.flow__no{display:flex;gap:12px;align-items:baseline;margin-top:6px;padding:10px 14px;border-left:1px solid var(--acc);background:rgba(135,107,62,.07);font-size:15px!important}
.flow__no span{font-family:var(--releve);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--acc);flex:0 0 auto}
@media (max-width:760px){.flow__step{gap:16px}.flow__no{flex-direction:column;gap:4px}}
.phero--img .h1{font-size:clamp(40px,4.6vw,68px);max-width:none}.phero--img .lay__main{grid-template-columns:minmax(0,1fr) minmax(0,270px)}