/* V66 — editorial relay from the introduction into the real Cetelem chapter. */
:root{
  --h66-ivory:#f5f2ea;
  --h66-ink:#12223a;
  --h66-blue:#3158f4;
  --h66-navy:#142f41;
  --h66-green:#9be9bc;
}

.hero-intro-stage{
  --h66-progress:0;
  --h66-cut:0%;
  --h66-copy-y:0px;
  --h66-clients-y:0px;
  --h66-portrait-x:0px;
  --h66-portrait-y:0px;
  --h66-relay:0;
  position:relative;
  z-index:2;
  min-height:calc(100svh - var(--header));
  background:transparent;
  isolation:isolate;
}

.hero-intro-stage::before{display:none}

.home-page .hero--editorial{
  position:relative;
  width:100%;
  max-width:none;
  min-height:calc(100svh - var(--header));
  height:calc(100svh - var(--header));
  display:grid;
  grid-template-columns:minmax(0,1.12fr) minmax(390px,.88fr);
  grid-template-rows:1fr auto;
  align-items:center;
  column-gap:clamp(36px,5vw,86px);
  overflow:hidden;
  padding:clamp(50px,6.5vh,82px) max(56px,calc((100vw - 1280px)/2)) 28px;
  background:transparent;
  isolation:isolate;
  pointer-events:none;
}

.home-page .hero--editorial::before{
  content:"";
  position:absolute;
  z-index:-1;
  inset:0;
  background:var(--h66-ivory);
  transform:translate3d(0,var(--h66-cut),0);
  pointer-events:none;
  will-change:transform;
}

.hero-intro-stage.hero66-ready{
  height:166svh;
  min-height:1040px;
}

.hero-intro-stage.hero66-ready .hero--editorial{
  position:sticky;
  z-index:3;
  top:var(--header);
}

.hero-intro-stage.hero66-ready + #interface-en-contexte{
  position:relative;
  z-index:1;
  margin-top:-66svh;
}

.home-page .hero--editorial .hero-copy{
  grid-column:1;
  grid-row:1;
  position:relative;
  z-index:2;
  min-width:0;
  align-self:start;
  margin-top:clamp(38px,8.5vh,92px);
  transform:translate3d(0,var(--h66-copy-y),0);
  will-change:transform;
}

.home-page .hero--editorial .eyebrow{
  max-width:none;
  margin:0 0 22px;
  color:var(--h66-blue);
  font-size:12px;
  line-height:1.4;
  font-weight:700;
  letter-spacing:.16em;
  text-transform:uppercase;
}

.home-page .hero--editorial h1{
  max-width:780px;
  margin:0;
  color:var(--h66-ink);
  font-size:clamp(56px,5.25vw,80px);
  line-height:.995;
  letter-spacing:-.057em;
}

.home-page .hero--editorial .hero-title-line{
  display:block;
  position:relative;
  transform-origin:left center;
}

.home-page .hero--editorial h1 em{
  width:max-content;
  max-width:min(690px,calc(100vw - 112px));
  margin-top:.08em;
  color:var(--h66-blue);
  font-weight:400;
  white-space:nowrap;
}

.home-page .hero--editorial h1 em::after{
  content:"";
  position:absolute;
  left:calc(100% + 16px);
  top:61%;
  width:100vw;
  height:2px;
  background:var(--h66-blue);
  transform:scaleX(var(--h66-relay));
  transform-origin:left center;
  will-change:transform;
}

.home-page .hero--editorial .hero-intro,
.home-page .hero--editorial .hero-portrait figcaption,
.home-page .hero--editorial .hero-clients>p{
  display:none;
}

.home-page .hero--editorial .hero-actions{
  display:flex;
  align-items:center;
  margin-top:clamp(24px,3.2vh,34px);
  pointer-events:auto;
}

.home-page .hero--editorial .hero-actions .button{
  width:auto;
  min-height:48px;
  padding:13px 21px;
  border-radius:999px;
  box-shadow:none;
}

.home-page .hero--editorial .hero-actions .text-link{display:none}

.home-page .hero--editorial .hero-portrait{
  grid-column:2;
  grid-row:1/3;
  position:relative;
  z-index:3;
  align-self:end;
  justify-self:end;
  width:min(100%,500px);
  height:min(77svh,730px);
  margin:0 -1.5vw -1px 0;
  overflow:visible;
  background:none;
  border:0;
  border-radius:0;
  transform:translate3d(var(--h66-portrait-x),var(--h66-portrait-y),0);
  will-change:transform;
}

.home-page .hero--editorial .hero-portrait::before,
.home-page .hero--editorial .portrait-window::before{display:none}

.home-page .hero--editorial .portrait-window{
  position:absolute;
  inset:0;
  display:block;
  overflow:visible;
  background:none;
  border:0;
  border-radius:0;
}

.home-page .hero--editorial .portrait-window img{
  position:absolute;
  right:0;
  bottom:0;
  width:auto;
  max-width:100%;
  height:100%;
  object-fit:contain;
  object-position:right bottom;
  filter:none;
  transform:none!important;
  animation:none!important;
}

.home-page .hero--editorial .hero-clients{
  position:absolute;
  z-index:2;
  left:max(56px,calc((100vw - 1280px)/2));
  bottom:clamp(54px,7.5vh,78px);
  width:min(720px,52vw);
  max-width:720px;
  margin:0;
  padding:0;
  border:0;
  color:var(--h66-ink);
  transform:translate3d(0,var(--h66-clients-y),0);
  will-change:transform;
}

.home-page .hero--editorial .hero-clients ul{
  display:flex;
  align-items:center;
  gap:0;
  margin:0;
  padding:0;
  list-style:none;
}

.home-page .hero--editorial .hero-clients li{
  display:flex;
  align-items:center;
  min-width:0;
  color:inherit;
  font-size:13px;
  font-weight:520;
  line-height:1.35;
  letter-spacing:-.01em;
  white-space:nowrap;
}

.home-page .hero--editorial .hero-clients li+li::before{
  content:"·";
  margin:0 12px;
  color:#7d8897;
}

.home-page .hero--editorial .hero-clients li span{display:none}
.hero-next{display:none!important}

/* The real Cetelem introduction is the incoming plane. The animation engine below is untouched. */
.home-page #interface-en-contexte{
  scroll-margin-top:0;
  border-top:0;
}

.home-page #interface-en-contexte .gn47-intro{
  position:relative;
  z-index:4;
  min-height:70svh;
  padding-top:clamp(42px,5.5vw,76px);
  padding-bottom:clamp(52px,6vw,88px);
  color:#f7f7f3;
  background:var(--h66-navy);
  box-shadow:0 0 0 100vmax var(--h66-navy);
  clip-path:inset(0 -100vmax);
}

.home-page #interface-en-contexte .gn47-intro .eyebrow{
  display:flex;
  align-items:center;
  gap:16px;
  margin-bottom:20px;
  color:var(--h66-green);
  white-space:nowrap;
}

.home-page #interface-en-contexte .gn47-intro .eyebrow::after{
  content:"";
  flex:1 1 auto;
  width:auto;
  min-width:80px;
  height:1px;
  background:currentColor;
}

.home-page #interface-en-contexte .gn47-intro h2{
  max-width:14ch;
  margin-bottom:24px;
  color:#fff;
  font-size:clamp(52px,5.4vw,78px);
}

.home-page #interface-en-contexte .gn47-lede{color:#f4f6f3}
.home-page #interface-en-contexte .gn47-context{color:#aebbc4}
.home-page #interface-en-contexte .gn47-intro-actions a{color:#fff}
.home-page #interface-en-contexte .gn47-intro-actions a:focus-visible{outline-color:var(--h66-green)}
.home-page #interface-en-contexte .gn47-intro-actions{grid-column:1;grid-row:2;padding-bottom:0}

@media(max-width:1100px){
  .home-page .hero--editorial{grid-template-columns:minmax(0,1.12fr) minmax(320px,.88fr);column-gap:28px;padding-inline:32px}
  .home-page .hero--editorial h1{font-size:clamp(47px,5.45vw,61px)}
  .home-page .hero--editorial .hero-portrait{width:min(100%,420px);height:min(72svh,650px);margin-right:-2vw}
  .home-page .hero--editorial .hero-clients{left:32px}
}

@media(max-width:800px){
  .hero-intro-stage{min-height:calc(100svh - var(--header))}
  .hero-intro-stage.hero66-ready{height:178svh;min-height:1120px}
  .hero-intro-stage.hero66-ready + #interface-en-contexte{margin-top:-78svh}

  .home-page .hero--editorial{
    width:100%;
    display:block;
    padding:clamp(34px,5.6vh,48px) 20px 20px;
  }

  .home-page .hero--editorial .hero-copy{
    display:block;
    position:relative;
    z-index:4;
    width:100%;
    margin-top:0;
  }

  .home-page .hero--editorial .eyebrow{margin-bottom:16px;font-size:10px;letter-spacing:.15em}
  .home-page .hero--editorial h1{max-width:none;font-size:clamp(37px,9.7vw,45px);line-height:1.015}
  .home-page .hero--editorial h1 em{max-width:100%;white-space:normal}
  .home-page .hero--editorial h1 em::after{left:78%;top:77%;width:75vw;height:1.5px}

  .home-page .hero--editorial .hero-actions{margin-top:20px}
  .home-page .hero--editorial .hero-actions .button{min-height:44px;padding:11px 17px;font-size:13px}

  .home-page .hero--editorial .hero-portrait{
    position:absolute;
    z-index:3;
    right:-12px;
    bottom:-1px;
    width:min(66vw,270px);
    height:min(54svh,490px);
    margin:0;
  }

  .home-page .hero--editorial .hero-clients{
    z-index:4;
    left:20px;
    right:16px;
    bottom:24px;
    width:auto;
    max-width:none;
  }

  .home-page .hero--editorial .hero-clients li{font-size:10.5px}
  .home-page .hero--editorial .hero-clients li+li::before{margin:0 6px}

  .home-page #interface-en-contexte .gn47-intro{min-height:78svh;padding-top:40px;padding-bottom:56px}
  .home-page #interface-en-contexte .gn47-intro .eyebrow{font-size:10px;gap:12px}
  .home-page #interface-en-contexte .gn47-intro .eyebrow::after{width:auto;min-width:38px}
  .home-page #interface-en-contexte .gn47-intro h2{max-width:11ch;font-size:clamp(43px,11.2vw,58px)}
  .home-page #interface-en-contexte .gn47-lede{max-width:26ch}
  .home-page #interface-en-contexte .gn47-context{max-width:34ch}
  .home-page #interface-en-contexte .gn47-intro-actions{grid-column:auto;grid-row:auto}
}

@media(max-width:374px){
  .home-page .hero--editorial{padding-inline:16px}
  .home-page .hero--editorial h1{font-size:clamp(34px,10.4vw,39px)}
  .home-page .hero--editorial .hero-portrait{right:-14px;width:min(66vw,218px);height:min(49svh,410px)}
  .home-page .hero--editorial .hero-clients{left:16px;right:10px}
  .home-page .hero--editorial .hero-clients li{font-size:9.5px}
  .home-page .hero--editorial .hero-clients li+li::before{margin:0 4px}
}

@media(max-width:600px){
  .hero-intro-stage.hero66-ready{height:170svh;min-height:1060px}
  .hero-intro-stage.hero66-ready + #interface-en-contexte{z-index:4;margin-top:-70svh}
}

.motion-reduced .hero-intro-stage,
html[data-motion="reduced"] .hero-intro-stage{
  height:auto;
  min-height:0;
}

.motion-reduced .hero-intro-stage + #interface-en-contexte,
html[data-motion="reduced"] .hero-intro-stage + #interface-en-contexte{
  margin-top:0;
}

.motion-reduced .home-page .hero--editorial,
html[data-motion="reduced"] .home-page .hero--editorial{
  --h66-cut:0%;
  --h66-copy-y:0px;
  --h66-clients-y:0px;
  --h66-portrait-x:0px;
  --h66-portrait-y:0px;
  --h66-relay:0;
  position:relative;
  top:auto;
}

@media(prefers-reduced-motion:reduce){
  .hero-intro-stage{height:auto!important;min-height:0}
  .hero-intro-stage + #interface-en-contexte{margin-top:0!important}
  .home-page .hero--editorial{--h66-cut:0%;--h66-copy-y:0px;--h66-clients-y:0px;--h66-portrait-x:0px;--h66-portrait-y:0px;--h66-relay:0;position:relative!important;top:auto}
  .hero-intro-stage *{animation:none!important;transition:none!important}
}

@media print{
  .hero-intro-stage{height:auto!important;min-height:0}
  .hero-intro-stage + #interface-en-contexte{margin-top:0!important}
  .home-page .hero--editorial{position:relative!important;top:auto;min-height:720px;--h66-cut:0%;--h66-copy-y:0px;--h66-clients-y:0px;--h66-portrait-x:0px;--h66-portrait-y:0px;--h66-relay:0}
}

/* V67: one compact editorial caption leads straight into the Cetelem film. */
.home-page .hero--editorial .hero-clients{display:none!important}
.hero-intro-stage.hero66-ready + #interface-en-contexte{
  z-index:1;
  margin-top:calc(-66svh - 100px);
}
.hero-intro-stage.hero66-ready .hero--editorial{
  background:var(--h66-ivory);
  clip-path:inset(0 0 var(--h67-cover-cut,0%) 0);
  will-change:clip-path;
}
.home-page .hero--editorial::before,
.home-page .hero--editorial h1 em::after{display:none!important}
.home-page .hero--editorial .hero-copy,
.home-page .hero--editorial .hero-portrait{transform:none!important}

.home-page #interface-en-contexte .gn47-intro{
  min-height:0;
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(290px,.85fr);
  grid-template-rows:auto auto;
  align-items:end;
  column-gap:clamp(38px,5vw,86px);
  row-gap:0;
  padding-top:clamp(28px,3.2vw,44px);
  padding-bottom:clamp(27px,3.1vw,42px);
  color:#f7f9f6;
  background:var(--h66-navy);
  box-shadow:0 0 0 100vmax var(--h66-navy);
  border-bottom:2px solid #b6e9c7;
}
.home-page #interface-en-contexte .gn47-intro>div:first-child{
  display:grid;
  grid-column:1/-1;
  grid-template-columns:subgrid;
  align-items:end;
}
.home-page #interface-en-contexte .gn47-intro .eyebrow{
  grid-column:1/-1;
  margin:0 0 16px;
  color:var(--h66-green);
  font-size:10px;
}
.home-page #interface-en-contexte .gn47-intro .eyebrow::after{
  background:#9fd7b7;
}
.home-page #interface-en-contexte .gn47-intro h2{
  grid-column:1;
  max-width:19ch;
  margin:0;
  color:#fff;
  font-size:clamp(34px,3.4vw,48px);
  line-height:1.04;
  letter-spacing:-.055em;
}
.home-page #interface-en-contexte .gn47-lede{
  grid-column:2;
  grid-row:2;
  max-width:44ch;
  margin:0 0 14px;
  color:#f1f6f2;
  font-size:clamp(14px,1.15vw,16px);
  line-height:1.5;
}
.home-page #interface-en-contexte .gn47-context{
  grid-column:2;
  grid-row:3;
  max-width:56ch;
  margin:0;
  color:#b1c2c9;
  font-size:11px;
  line-height:1.5;
}
.home-page #interface-en-contexte .gn47-intro-actions{
  grid-column:2;
  grid-row:2;
  justify-self:start;
  align-self:start;
  margin-top:14px;
  padding:0;
}
.home-page #interface-en-contexte .gn47-intro-actions a{
  color:#fff;
  font-size:11px;
}
.home-page #interface-en-contexte .gn47-intro-actions a:focus-visible{outline-color:#3158f4}
.home-page #interface-en-contexte .gn47-scene-track{border-top:0}

@media(max-width:900px){
  .home-page #interface-en-contexte .gn47-intro{
    grid-template-columns:1fr;
    padding-top:25px;
    padding-bottom:24px;
  }
  .home-page #interface-en-contexte .gn47-intro>div:first-child{
    display:block;
    grid-column:1;
  }
  .home-page #interface-en-contexte .gn47-intro .eyebrow{margin-bottom:11px}
  .home-page #interface-en-contexte .gn47-intro h2{
    max-width:20ch;
    font-size:clamp(32px,5.2vw,43px);
  }
  .home-page #interface-en-contexte .gn47-lede{
    max-width:42ch;
    margin:12px 0 5px;
    font-size:13px;
  }
  .home-page #interface-en-contexte .gn47-context{
    max-width:55ch;
    font-size:10px;
  }
  .home-page #interface-en-contexte .gn47-intro-actions{
    grid-column:1;
    grid-row:auto;
    justify-self:start;
    margin-top:12px;
  }
}

@media(max-width:800px){
  .hero-intro-stage.hero66-ready + #interface-en-contexte{margin-top:calc(-78svh - 70px)}
}

@media(max-width:600px){
  .hero-intro-stage.hero66-ready + #interface-en-contexte{margin-top:calc(-70svh - 70px)}
}

@media(max-width:600px){
  .home-page #interface-en-contexte .gn47-intro{
    padding-top:22px;
    padding-bottom:20px;
  }
  .home-page #interface-en-contexte .gn47-intro h2{
    max-width:17ch;
    font-size:clamp(31px,8vw,37px);
  }
  .home-page #interface-en-contexte .gn47-lede{max-width:32ch}
  .home-page #interface-en-contexte .gn47-context{max-width:37ch}
}

@media(max-width:700px){
  /* The intro already offers a keyboard-accessible skip; the floating duplicate
     obscures the V8.2 scene at narrow widths. */
  .home-page .gn47-scene-sticky .gn47-embed-cue{display:none!important}
}

/* The chapter iteration is independent of the hero motion exploration.
   Keep the live page in natural flow until that separate motion is approved. */
.hero-intro-stage.hero66-ready,
.hero-intro-stage{
  height:auto!important;
  min-height:0!important;
}
.hero-intro-stage.hero66-ready .hero--editorial,
.home-page .hero--editorial{
  position:relative!important;
  top:auto!important;
  clip-path:none!important;
  background:var(--h66-ivory);
}
.hero-intro-stage.hero66-ready + #interface-en-contexte,
.hero-intro-stage + #interface-en-contexte{
  position:relative;
  z-index:auto;
  margin-top:0!important;
}

/* The Malakoff audit is already its first slide; remove the oversized pause
   after the previous projects rather than adding another title panel. */
.home-page #autres-realisations{padding-bottom:clamp(36px,4vw,52px)}
@media(max-width:700px){
  .home-page #autres-realisations{padding-bottom:32px}
}

/* V68 — one continuous scroll handoff. The real Cetelem stage is the next
   surface; its V8.2 iframe, timeline and camera remain untouched. */
.hero-intro-stage,
.hero-intro-stage.hero66-ready{
  height:calc(100svh - var(--header))!important;
  min-height:0!important;
  z-index:1;
  background:var(--h66-ivory);
}
.hero-intro-stage .hero--editorial,
.hero-intro-stage.hero66-ready .hero--editorial{
  position:relative!important;
  top:auto!important;
  height:calc(100svh - var(--header));
  min-height:0;
  overflow:hidden;
  background:var(--h66-ivory);
  clip-path:none!important;
}
.hero-intro-stage + #interface-en-contexte,
.hero-intro-stage.hero66-ready + #interface-en-contexte{
  position:relative!important;
  z-index:2!important;
  margin-top:0!important;
  background:#fff;
}
.home-page .hero--editorial .hero-copy{
  transform:translate3d(0,var(--h68-copy-y,0px),0)!important;
}
.home-page .hero--editorial .hero-portrait{
  transform:translate3d(0,var(--h68-photo-y,0px),0)!important;
}
@media(min-width:801px){
  .home-page .hero--editorial .hero-portrait{
    transform:translate3d(0,calc(var(--h68-photo-y,0px) + 27px),0)!important;
  }
}
.home-page .hero--editorial .portrait-window{
  aspect-ratio:auto!important;
  height:100%!important;
}
.home-page .hero--editorial .hero-actions .button{
  box-shadow:0 1px 0 rgba(19,45,69,.12);
}

/* A chapter caption, not another introductory slide. The full heading and
   explanatory copy remain available to assistive technology. */
.home-page #interface-en-contexte .gn47-intro{
  position:relative;
  display:flex!important;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  min-height:0!important;
  padding-top:15px!important;
  padding-bottom:15px!important;
  color:var(--h66-navy);
  background:#fff!important;
  box-shadow:0 0 0 100vmax #fff!important;
  border-top:1px solid #d8e5dd;
  border-bottom:1px solid #e6ece8;
}
.home-page #interface-en-contexte .gn47-intro>div:first-child{
  display:block!important;
  grid-column:auto;
}
.home-page #interface-en-contexte .gn47-intro .eyebrow{
  display:block;
  margin:0!important;
  color:#21543c;
  font-size:10px;
  font-weight:750;
  letter-spacing:.13em;
  line-height:1.4;
  white-space:normal;
}
.home-page #interface-en-contexte .gn47-intro .eyebrow::after{display:none}
.home-page #interface-en-contexte .gn47-intro h2,
.home-page #interface-en-contexte .gn47-intro .gn47-lede,
.home-page #interface-en-contexte .gn47-intro .gn47-context{
  position:absolute!important;
  width:1px!important;
  height:1px!important;
  padding:0!important;
  margin:-1px!important;
  overflow:hidden!important;
  clip:rect(0,0,0,0)!important;
  white-space:nowrap!important;
  border:0!important;
}
.home-page #interface-en-contexte .gn47-intro-actions{
  grid-column:auto!important;
  grid-row:auto!important;
  align-self:center!important;
  justify-self:end!important;
  flex:0 0 auto;
  margin:0!important;
  padding:0!important;
}
.home-page #interface-en-contexte .gn47-intro-actions a{
  color:#3158f4;
  font-size:11px;
  line-height:1.3;
  text-decoration-thickness:1px;
  text-underline-offset:3px;
}
.home-page #interface-en-contexte .gn47-scene-track{border-top:0!important}

@media(min-width:700px) and (max-width:800px){
  .home-page .hero--editorial{
    display:grid;
    grid-template-columns:54% 46%;
    grid-template-rows:1fr;
    align-items:center;
    column-gap:0;
    padding:30px 30px 0;
  }
  .home-page .hero--editorial .hero-copy{
    align-self:center;
    margin-top:-4vh;
  }
  .home-page .hero--editorial h1{
    max-width:11ch;
    font-size:clamp(40px,5.8vw,48px);
  }
  .home-page .hero--editorial h1 em{
    max-width:100%;
    white-space:normal;
  }
  .home-page .hero--editorial .hero-portrait{
    grid-column:2;
    position:absolute;
    right:-12px;
    bottom:-8px;
    width:min(51vw,400px);
    height:min(73svh,72vw);
  }
}
@media(max-width:800px){
  .home-page .hero--editorial .hero-copy{margin-top:0}
  .home-page .hero--editorial .hero-portrait{
    right:-12px;
    bottom:-8px;
    width:min(83vw,340px);
    height:min(57svh,118vw);
  }
  .home-page #interface-en-contexte .gn47-intro{
    padding-top:13px!important;
    padding-bottom:13px!important;
  }
}
@media(max-width:374px){
  .home-page .hero--editorial .hero-portrait{
    right:-12px;
    width:min(83vw,280px);
    height:min(57svh,118vw);
  }
  .home-page #interface-en-contexte .gn47-intro{
    gap:10px;
  }
  .home-page #interface-en-contexte .gn47-intro .eyebrow{font-size:9px}
  .home-page #interface-en-contexte .gn47-intro-actions a{font-size:10px}
}
@media(max-width:800px) and (max-height:700px){
  .home-page .hero--editorial .hero-portrait{
    width:min(77vw,300px);
    height:min(52svh,110vw);
  }
}
@media(min-width:700px) and (max-width:800px){
  .home-page .hero--editorial .hero-copy{
    align-self:start;
    margin-top:clamp(110px,15svh,170px);
  }
  .home-page .hero--editorial .hero-portrait{
    width:min(55vw,430px);
    height:min(70svh,79vw);
  }
}
@media(prefers-reduced-motion:reduce){
  .hero-intro-stage,
  .hero-intro-stage.hero66-ready{height:auto!important}
  .hero-intro-stage .hero--editorial,
  .hero-intro-stage.hero66-ready .hero--editorial{position:relative!important;top:auto!important}
  .hero-intro-stage + #interface-en-contexte,
  .hero-intro-stage.hero66-ready + #interface-en-contexte{margin-top:0!important}
  .home-page .hero--editorial .hero-copy,
  .home-page .hero--editorial .hero-portrait{transform:none!important}
}
html[data-motion="reduced"] .hero-intro-stage,
.motion-reduced .hero-intro-stage{height:auto!important}
html[data-motion="reduced"] .hero-intro-stage .hero--editorial,
.motion-reduced .hero-intro-stage .hero--editorial{position:relative!important;top:auto!important}
html[data-motion="reduced"] .hero-intro-stage + #interface-en-contexte,
.motion-reduced .hero-intro-stage + #interface-en-contexte{margin-top:0!important}
html[data-motion="reduced"] .home-page .hero--editorial .hero-copy,
html[data-motion="reduced"] .home-page .hero--editorial .hero-portrait,
.motion-reduced .home-page .hero--editorial .hero-copy,
.motion-reduced .home-page .hero--editorial .hero-portrait{transform:none!important}

/* V69 — the supplied aperture gives the portrait its own visual world without
   enlarging its raster. It stays behind the cutout and moves at a second,
   slower scroll depth. */
.home-page .hero--editorial .hero-portrait{isolation:isolate}
.home-page .hero--editorial .hero-aperture{
  position:absolute;
  z-index:0;
  right:-4%;
  bottom:8%;
  width:112%;
  height:auto;
  max-width:none;
  opacity:.78;
  filter:saturate(.82);
  transform:translate3d(0,var(--h69-aperture-y,0px),0) rotate(var(--h69-aperture-turn,0deg));
  transform-origin:52% 50%;
  pointer-events:none;
  will-change:transform;
}
.home-page .hero--editorial .portrait-window{z-index:1}
.home-page .hero--editorial .portrait-window img{z-index:1}

/* Malakoff is now the first real chapter; the hero's scroll response stays
   identical while its incoming plane changes from Cetelem to Malakoff. */
.hero-intro-stage + #malakoff-experience{position:relative;z-index:2}

@media(max-width:800px){
  .home-page .hero--editorial .hero-aperture{
    right:-3%;
    bottom:25%;
    width:115%;
    opacity:.72;
  }
}
@media(prefers-reduced-motion:reduce){
  .home-page .hero--editorial .hero-aperture{transform:none!important;will-change:auto}
}
html[data-motion="reduced"] .home-page .hero--editorial .hero-aperture,
.motion-reduced .home-page .hero--editorial .hero-aperture{transform:none!important;will-change:auto}
