/* V3 — parcours photographique, catalogue bord à bord et footer filmé partagé. */
@media (min-width:640px) {
  .li-catalogue-image {
    right: calc((100% - 100vw) / 2);
    overflow: hidden;
    display: block;
  }
  .li-catalogue-image img { width:100%; height:100%; object-fit:cover; object-position:right 60%; transform:none; }
  .li-catalogue-image::after { content:""; position:absolute; inset:0; background:linear-gradient(90deg,#f4f6f2 0,rgba(244,246,242,.9) 5%,transparent 21%); pointer-events:none; }
  .li-catalogue-image > span { z-index:1; right:8%; bottom:34px; }
}
@media (min-width:1920px) {
  .li-catalogue-image { left:34%; }
  .li-catalogue-image > span { right:5%; }
}

.li-trace { --trace-progress:0; background:#f5f5ef; color:var(--li-ink); padding:82px 0 0; }
.li-trace .li-sectionline { margin-bottom:47px; }
.li-trace-heading { display:grid; grid-template-columns:1fr .64fr; gap:100px; align-items:end; margin-bottom:62px; }
.li-trace-heading h2 { font-size:clamp(65px,7.2vw,108px); }
.li-trace-heading > div { max-width:350px; padding-bottom:5px; }
.li-trace-heading p { color:#677261; font-size:15px; line-height:1.8; margin:0 0 20px; }
.li-trace-heading > div > span { font-family:"Manrope",sans-serif; font-size:7px; letter-spacing:.1em; font-weight:600; color:#6e7d61; }
.li-trace-layout { display:grid; grid-template-columns:1.16fr .84fr; gap:88px; align-items:start; }
.li-trace-media { position:sticky; top:max(104px,calc(50svh - 240px)); padding-bottom:30px; }
.li-trace-frame { position:relative; width:100%; aspect-ratio:4/3; background:#dbe3d2; overflow:hidden; isolation:isolate; }
.li-trace-image { position:absolute; inset:0; opacity:0; clip-path:inset(0 0 100% 0); transition:clip-path .85s cubic-bezier(.22,.7,.17,1),opacity .55s; pointer-events:none; z-index:0; }
.li-trace-image.is-active { opacity:1; clip-path:inset(0 0 0 0); z-index:1; }
.li-trace-image img { width:100%; height:100%; object-fit:cover; transform:scale(1.035); transition:transform 1.4s cubic-bezier(.22,.7,.17,1); }
.li-trace-image.is-active img { transform:scale(1); }
.li-trace-frame::after { content:""; position:absolute; inset:0; pointer-events:none; z-index:2; background:linear-gradient(180deg,transparent 65%,#0b231364); }
.li-trace-photo-caption { position:absolute; left:23px; right:23px; bottom:20px; display:flex; align-items:end; gap:17px; z-index:3; color:white; font-family:"Manrope",sans-serif; font-size:7px; letter-spacing:.1em; line-height:1.5; text-shadow:0 1px 8px #10392180; }
.li-trace-current { font-size:13px; letter-spacing:-.02em; flex-shrink:0; }
.li-trace-current-name { font-weight:600; }
.li-trace-photo-caption > span:last-child { font-size:5px; margin-left:auto; text-align:right; }
.li-trace-switch { display:flex; gap:0; border-bottom:1px solid #d1d9c8; }
.li-trace-switch button { background:transparent; border:0; position:relative; color:#687760; flex:1; text-align:left; padding:21px 6px 19px 0; font-size:10px; font-weight:500; cursor:pointer; }
.li-trace-switch button::after { content:""; position:absolute; height:2px; background:#079843; left:0; bottom:-1px; right:15px; transform:scaleX(0); transform-origin:left; transition:transform .4s; }
.li-trace-switch button.is-active { color:#067a36; }
.li-trace-switch button.is-active::after { transform:scaleX(1); }
.li-trace-switch button > span { font-family:"Manrope",sans-serif; font-size:7px; margin-right:12px; color:#849178; }
.li-trace-steps { position:relative; padding-left:37px; }
.li-trace-progress { position:absolute; left:0; top:0; bottom:0; width:1px; background:#dce2d4; }
.li-trace-progress i { display:block; width:100%; height:100%; background:#2b954b; transform:scaleY(var(--trace-progress)); transform-origin:top; }
.li-trace-step { min-height:75svh; position:relative; display:flex; flex-direction:column; justify-content:center; padding-block:85px; scroll-margin-top:100px; }
.li-trace-step::before { content:""; position:absolute; left:-40px; top:50%; width:7px; height:7px; border-radius:50%; border:1px solid #abbca1; background:#f5f5ef; transition:background .35s,border-color .35s,transform .35s; }
.li-trace-step.is-active::before { background:#079843; border-color:#079843; transform:scale(1.3); }
.li-trace-step-number { display:block; font-family:"Manrope",sans-serif; font-size:8px; letter-spacing:.1em; color:#6b7d5c; font-weight:600; margin-bottom:27px; }
.li-trace-step h3 { font-size:clamp(39px,3.8vw,58px); line-height:1.07; letter-spacing:-.06em; font-weight:500; color:#506744; margin:0 0 26px; transition:color .4s; }
.li-trace-step h3 span { color:#537844; transition:color .4s; }
.li-trace-step.is-active h3 { color:#183b26; }
.li-trace-step.is-active h3 span { color:#079843; }
.li-trace-step-copy > p { font-size:15px; line-height:1.8; color:#637159; max-width:390px; margin:0 0 25px; }
.li-trace-step ul { padding:0; margin:0 0 27px; list-style:none; }
.li-trace-step li { font-size:11px; line-height:1.75; color:#6f7b64; padding-left:17px; margin-block:8px; position:relative; }
.li-trace-step li::before { content:""; width:4px; height:4px; border-radius:50%; background:#74a364; position:absolute; left:0; top:8px; }
.li-trace-tag { display:inline-block; padding-top:15px; border-top:1px solid #cad7bf; font-family:"Manrope",sans-serif; font-size:7px; letter-spacing:.09em; color:#5b774c; }
.li-trace-step .li-textlink { font-size:11px; }
.li-trace-mobile-image { display:none; }
.li-trace-bottom { border-top:1px solid #d7dfcf; padding:32px 0 38px; margin-top:35px; display:flex; justify-content:space-between; align-items:center; gap:25px; }
.li-trace-bottom p { margin:0; font-size:13px; line-height:1.8; color:#6c7861; }
.li-trace-bottom strong { font-weight:600; color:#28482c; }
.li-trace-bottom .li-textlink { font-size:12px; }

/* Le contenu utile du footer occupe toute la scène vidéo. */
.li-footer.li-footer-film.li-contact { position:relative; isolation:isolate; display:block; min-height:0; padding:0; background:#0a281b; color:white; }
.li-footer-film .li-contact-media { z-index:-1; }
.li-footer-film .li-contact-shade { background:linear-gradient(90deg,#051b13ed 0%,#061d14ce 50%,#071f14b0 100%),linear-gradient(0deg,#04150ecc,transparent 75%); }
.li-footer-content { position:relative; z-index:1; }
.li-footer-film .li-footer-grid { border:0; padding:88px 0 52px; grid-template-columns:1.2fr .7fr 1fr 1fr; gap:58px; }
.li-footer-film .li-footer-brand .li-footer-home { display:block; border:0; margin:0 0 26px; padding:0; width:max-content; }
.li-footer-film .li-footer-home img { width:208px; height:auto; filter:brightness(0) invert(1); }
.li-footer-film .li-footer-grid h3 { color:#c5d6b9; font-size:8px; letter-spacing:.17em; margin-bottom:25px; }
.li-footer-film .li-footer-grid > div > a { color:#e4eadf; font-size:12px; margin-bottom:12px; }
.li-footer-film .li-footer-grid > div > a:hover { color:white; }
.li-footer-film .li-footer-grid p { color:#c4d0bb; font-size:12px; line-height:1.85; }
.li-footer-film .li-footer-brand p { max-width:270px; margin-bottom:22px; }
.li-footer-film .li-footer-brand > a:not(.li-footer-home) { color:white; border-bottom-color:#9db68d; }
.li-footer-film .li-footer-belief > p { color:#e1ead8; font-size:25px; line-height:1.25; letter-spacing:-.035em; }
.li-footer-film .li-footer-belief > span { color:#b9c9ad; font-size:10px; }
.li-footer-motion { display:flex; align-items:center; justify-content:space-between; gap:24px; border-top:1px solid #afc49a45; padding-block:18px; min-height:76px; }
.li-footer-motion > span { color:#b9cbae; font-family:"Manrope",sans-serif; font-size:7px; letter-spacing:.14em; }
.li-footer-film .li-footer-legal { border-top:1px solid #afc49a45; color:#b9c9ae; padding:24px 0 28px; }
.li-footer-film .li-footer-legal p { font-size:8px; }
.li-footer-film .li-footer-legal a { color:#c3d2b8; }
.li-footer-film .li-backtop > span { border-color:#aac09775; }
.li-footer-film #contact-video-toggle { font-size:8px; min-height:38px; padding:9px 14px; }

@media (max-height:740px) and (min-width:1000px) {
  .li-trace-media { top:100px; }
  .li-trace-frame { aspect-ratio:auto; height:calc(100svh - 200px); min-height:280px; }
  .li-trace-step { min-height:620px; }
}
@media (max-width:1199px) {
  .li-trace-heading { gap:65px; }
  .li-trace-layout { gap:50px; }
  .li-trace-steps { padding-left:27px; }
  .li-trace-step::before { left:-30px; }
  .li-trace-step h3 { font-size:43px; }
  .li-trace-step-copy > p { font-size:14px; }
  .li-trace-switch button { font-size:9px; }
  .li-trace-switch button > span { margin-right:7px; }
  .li-footer-film .li-footer-grid { gap:30px; }
}
@media (max-width:999px) {
  .li-trace { padding-top:65px; }
  .li-trace-heading { gap:35px; grid-template-columns:1.1fr 1fr; margin-bottom:46px; }
  .li-trace-heading h2 { font-size:8.4vw; }
  .li-trace-heading p { font-size:14px; }
  .li-trace-heading > div > span { display:none; }
  .li-trace-layout { display:block; }
  .li-trace-media { display:none; }
  .li-trace-steps { padding-left:0; }
  .li-trace-progress { display:none; }
  .li-trace-step { display:grid; grid-template-columns:1fr 1fr; gap:35px; min-height:0; padding:35px 0 55px; align-items:center; }
  .li-trace-step::before { display:none; }
  .li-trace-mobile-image { display:block; position:relative; aspect-ratio:4/4.5; overflow:hidden; margin:0; }
  .li-trace-mobile-image img { width:100%; height:100%; object-fit:cover; transform:scale(1.035); transition:transform 1s; }
  .li-trace-step.is-seen .li-trace-mobile-image img { transform:scale(1); }
  .li-trace-mobile-image figcaption { position:absolute; bottom:9px; right:12px; font-size:7px; color:white; text-shadow:0 1px 5px #15431e; }
  .li-trace-step-number { font-size:7px; margin-bottom:21px; }
  .li-trace-step h3 { font-size:40px; margin-bottom:20px; }
  .li-trace-step li { font-size:10px; }
  .li-trace-step ul { margin-bottom:20px; }
  .li-trace-bottom { margin-top:10px; }
  .li-footer-film .li-footer-grid { grid-template-columns:1.2fr .8fr 1.2fr; padding-top:65px; gap:35px; }
  .li-footer-film .li-footer-belief { display:none; }
}
@media (max-width:639px) {
  .li-trace { padding-top:44px; }
  .li-trace .li-sectionline { margin-bottom:32px; }
  .li-trace-heading { grid-template-columns:1fr; gap:23px; margin-bottom:28px; }
  .li-trace-heading h2 { font-size:62px; }
  .li-trace-heading > div { padding:0; }
  .li-trace-heading p { font-size:14px; margin:0; }
  .li-trace-step { display:flex; flex-direction:column; gap:0; align-items:stretch; padding:20px 0 55px; }
  .li-trace-mobile-image { width:100%; aspect-ratio:4/3; margin-bottom:29px; }
  .li-trace-step h3 { font-size:45px; line-height:1.04; }
  .li-trace-step-number { font-size:7px; margin-bottom:20px; }
  .li-trace-step-copy > p { font-size:14px; line-height:1.8; }
  .li-trace-step li { font-size:11px; }
  .li-trace-tag { font-size:6px; }
  .li-trace-step:not(:last-child) { border-bottom:1px solid #dce3d4; margin-bottom:20px; }
  .li-trace-bottom { display:block; padding:25px 0 35px; margin-top:0; }
  .li-trace-bottom p { font-size:12px; margin-bottom:15px; }
  .li-trace-bottom .li-textlink { font-size:11px; }
  .li-footer-film .li-footer-grid { grid-template-columns:1fr 1.2fr; gap:32px 24px; padding:45px 0 27px; }
  .li-footer-film .li-footer-brand { grid-column:1/-1; }
  .li-footer-film .li-footer-home img { width:188px; }
  .li-footer-film .li-footer-brand .li-footer-home { margin-bottom:21px; }
  .li-footer-film .li-footer-grid p { font-size:12px; }
  .li-footer-film .li-footer-brand p { max-width:315px; margin-bottom:17px; }
  .li-footer-film .li-footer-grid > div > a { font-size:11px; }
  .li-footer-film .li-footer-grid h3 { font-size:7px; margin-bottom:21px; }
  .li-footer-film .li-footer-belief { display:block; grid-column:1/-1; border-top:1px solid #afc49a45; padding-top:25px; }
  .li-footer-film .li-footer-belief > p { font-size:25px; line-height:1.3; margin-bottom:13px; }
  .li-footer-film .li-footer-belief > span { max-width:270px; font-size:10px; }
  .li-footer-motion { min-height:69px; gap:12px; padding-block:14px; }
  .li-footer-motion > span { font-size:5px; letter-spacing:.06em; }
  .li-footer-film #contact-video-toggle { font-size:7px; gap:6px; min-height:38px; padding-inline:10px; }
  .li-footer-film .li-footer-legal { padding-block:21px 28px; }
  .li-footer-film .li-footer-legal p { max-width:290px; }
}
@media (prefers-reduced-motion:reduce) {
  .li-trace-image { transition:none; }
  .li-trace-image img,.li-trace-mobile-image img { transform:none; transition:none; }
}
