/* A quiet landscape, paired with the knowledge behind the workshop. */
.home-hero.animated-home{padding:54px 6% 34px;min-height:0;gap:34px;grid-template-columns:1fr}
.animated-home .hero-copy h1{font-size:clamp(28px,2.7vw,41px);line-height:1.2;letter-spacing:-.035em;margin-top:26px;max-width:none;text-wrap:balance}
.animated-home .hero-copy .lead{font-size:15px;line-height:1.8;max-width:640px;margin-top:22px}
.animated-home .actions{gap:24px;flex-wrap:wrap;margin-top:22px}
.animated-home .actions .button,.animated-home .actions .text-link{margin-top:0}
.reverie{min-width:0;position:relative;z-index:1;width:100%;margin:0}
.reverie-film{overflow:hidden;background:#f1f0e3}
.reverie video{width:100%;aspect-ratio:2/1;object-fit:contain;display:block}
.reverie figcaption{display:flex;justify-content:space-between;align-items:center;padding:13px 0 0;gap:14px}
.reverie figcaption>span{font:italic 16px Georgia,serif;color:var(--accent)}
.reverie-toggle{padding:5px 0 5px 10px;border:0;background:transparent;font-size:11px;line-height:1.6;color:var(--ink);min-height:32px}
.reverie-toggle span{margin-left:9px}
.composition-1 .hero-copy{display:grid;grid-template-columns:.9fr 1.3fr;column-gap:70px;align-items:start}
.composition-1 .hero-copy>.brand{grid-column:1;grid-row:1/4;margin-top:16px}
.composition-1 .hero-copy h1,.composition-1 .hero-copy .lead,.composition-1 .hero-copy .actions{grid-column:2}
.composition-1 .hero-copy h1{margin-top:0;font-size:clamp(28px,2.4vw,36px)}
.composition-1 .brand-big .fabrique{font-size:clamp(115px,13.5vw,190px)}
.composition-1 .reverie{margin-top:-5px}
.savoir{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:75px;background:var(--wash)}
.savoir-copy p:not(.eyebrow){font-size:15px;margin-top:23px;max-width:49ch}
.savoir .book-scene{padding:35px 8px 20px}
.savoir h2{font-size:clamp(30px,3vw,44px)}
.savoir .book-drawing{height:65px}
.savoir .book-drawing img{height:100%;object-fit:contain;object-position:left}
.proposal-2 .home-hero.animated-home{grid-template-columns:.95fr 1.15fr;gap:48px;padding-top:64px;padding-bottom:64px;align-items:center}
.composition-2 .hero-copy h1{font-size:clamp(27px,2.4vw,37px)}
.composition-2 .hero-copy .lead{font-size:15px}
.composition-2 .brand-big .fabrique{font-size:clamp(105px,10vw,150px)}
.composition-2 .headline-break{display:none}
.composition-2 .reverie-film{background:transparent}
.composition-2 .reverie video{mix-blend-mode:normal}
.proposal-2 .savoir{background:transparent;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.proposal-2 .agency-reasons h3{margin:18px 0}
.proposal-3 .home-hero.animated-home{display:block;text-align:center;padding-top:45px;padding-bottom:35px}
.composition-3 .hero-copy{max-width:1000px;margin:auto}
.composition-3 .hero-copy h1{font-size:clamp(28px,2.8vw,42px);margin-top:26px}
.composition-3 .hero-copy .lead{max-width:840px;margin:22px auto 0}
.composition-3 .actions{justify-content:center}
.composition-3 .headline-break{display:none}
.composition-3 .reverie{max-width:1100px;margin:28px auto 0}
.proposal-3 .savoir .book-scene{grid-column:1;grid-row:1;transform:rotate(-1deg)}
.proposal-3 .savoir-copy{grid-column:2}
@media(min-width:1500px){.composition-1 .hero-copy{grid-template-columns:1fr 1.2fr}}
@media(max-width:1000px){.composition-1 .hero-copy{column-gap:35px}.composition-1 .brand-big .fabrique{font-size:125px}.proposal-2 .home-hero.animated-home{gap:28px}.savoir{gap:35px}.animated-home .actions{gap:14px}.animated-home .actions .button{padding:12px 15px}}
@media(max-width:700px){.home-hero.animated-home,.proposal-2 .home-hero.animated-home,.proposal-3 .home-hero.animated-home{display:block;padding:35px 6% 26px}.composition-1 .hero-copy{display:block}.animated-home .hero-copy>.brand{margin-top:0}.animated-home .brand-big .fabrique{font-size:clamp(70px,25vw,100px)}.animated-home .hero-copy h1{font-size:28px;margin-top:28px;line-height:1.23;text-wrap:initial}.animated-home .headline-break{display:none}.animated-home .hero-copy .lead{font-size:14px;line-height:1.8;margin-top:20px}.animated-home .reverie{margin-top:28px;width:calc(100% + 13.64%);margin-left:-6.82%}.reverie figcaption{padding:10px 6% 0}.reverie figcaption>span{font-size:14px}.reverie-toggle{font-size:10px}.composition-2 .reverie-film{aspect-ratio:auto;display:block}.composition-2 .reverie video{mix-blend-mode:normal}.savoir{display:flex;flex-direction:column;gap:20px}.proposal-3 .savoir .book-scene{order:2}.savoir .book-scene{width:100%;max-width:470px;margin:0;padding:25px 2px 12px}.savoir-copy p:not(.eyebrow){font-size:14px}.animated-home .actions{gap:15px}.animated-home .actions a{font-size:11px}.proposal-3 .home-hero.animated-home{text-align:left}.composition-3 .actions{justify-content:flex-start}}

.composition-1 .reverie{max-width:1080px;margin-left:auto;margin-right:auto}
@media(max-width:700px){.composition-1 .reverie{margin-left:-6.82%}}

/* Piste 02 : la rêverie partage le papier et la lumière de la page. */
.composition-2{isolation:isolate}
.composition-2>.cloud-shadow{opacity:.085}
.composition-2 .reverie{mix-blend-mode:multiply}
.composition-2 .reverie-film{overflow:visible;background:none}
.composition-2 .reverie video{
 -webkit-mask-image:linear-gradient(to right,transparent,#000 9%,#000 86%,transparent),linear-gradient(to bottom,transparent,#000 14%,#000 88%,transparent);
 -webkit-mask-composite:source-in;
 mask-image:linear-gradient(to right,transparent,#000 9%,#000 86%,transparent),linear-gradient(to bottom,transparent,#000 14%,#000 88%,transparent);
 mask-composite:intersect;
}
.composition-2 .reverie figcaption{padding-left:5%;padding-right:5%}
@media(max-width:700px){.composition-2 .reverie figcaption{padding-left:6%;padding-right:6%}}

/* Piste 02 : une scène entière dans la hauteur disponible, sans recadrage du film. */
.proposal-2{max-width:none}
.proposal-2 .home-hero.immersive-home{display:block;height:var(--scene-height,calc(100svh - 145px));min-height:460px;padding:0}
.immersive-home .hero-copy{position:absolute;z-index:2;left:6%;top:7%;width:38%;max-width:600px;pointer-events:none}
.immersive-home .hero-copy .brand{pointer-events:auto}
.immersive-home .hero-copy .fabrique{font-size:clamp(78px,min(10vw,18svh),155px)}
.immersive-home .hero-copy h1{font-size:clamp(23px,min(2.35vw,4.4svh),36px);text-wrap:initial;margin-top:24px;line-height:1.18}
.immersive-home .reverie{position:absolute;inset:0;width:100%;height:100%;margin:0;z-index:1}
.immersive-home .reverie-film{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;padding:0 0 30px}
.immersive-home .reverie video{width:min(100%,calc((var(--scene-height) - 30px)*2));height:auto;max-width:none;object-fit:contain;aspect-ratio:2/1;margin:0;transform:none;-webkit-mask-image:linear-gradient(to right,transparent,#000 7%,#000 91%,transparent),linear-gradient(to bottom,transparent,#000 8%,#000 91%,transparent);mask-image:linear-gradient(to right,transparent,#000 7%,#000 91%,transparent),linear-gradient(to bottom,transparent,#000 8%,#000 91%,transparent)}
.immersive-home .reverie figcaption{position:absolute;bottom:14px;right:6%;padding:0;justify-content:flex-end}
.scene-next{position:absolute;z-index:3;bottom:18px;left:6%;font-size:12px;display:flex;align-items:center;gap:30px}
.scene-next span{font-size:19px}
.scene-intro{display:grid;grid-template-columns:.85fr 1.15fr;gap:75px;border-top:1px solid var(--line);scroll-margin-top:20px}
.scene-intro .lead{font-size:17px}
.scene-intro .actions{margin-top:28px;flex-wrap:wrap}
.scene-intro .actions .text-link{margin-top:0}
@media(max-width:1100px) and (min-width:701px){.immersive-home .hero-copy{width:43%}.immersive-home .hero-copy h1{font-size:25px}}
@media(max-width:700px){
 .proposal-2 .home-hero.immersive-home{min-height:570px}
 .immersive-home .hero-copy{top:25px;width:88%;max-width:none}
 .immersive-home .hero-copy .fabrique{font-size:clamp(76px,24vw,105px)}
 .immersive-home .hero-copy h1{font-size:25px;max-width:370px;margin-top:22px}
 .immersive-home .reverie-film{top:310px;bottom:48px;padding:0;align-items:center}
 .immersive-home .reverie video{width:100%;object-fit:contain}
 .scene-next{font-size:11px;gap:15px}.scene-intro{grid-template-columns:1fr;gap:25px}.scene-intro .lead{font-size:15px}
}

/* The responsive scene anchors the house below the title, independently of screen ratio. */
.immersive-home .responsive-reverie{mix-blend-mode:normal}
.reverie-canvas{position:absolute;inset:0;display:block;width:100%;height:100%;pointer-events:none}
.immersive-home>.cloud-shadow{opacity:.04}